0

We have a custom sub theme built on Tao and I tried adding

body { color:#fff; background:#333; }

to the style.css file, but to no avail. In Chrome dev tools I started inspecting elements and changing their backgrounds individually, but I cannot figure out how to change the background color for all divs, form elements, blocks, etc without some super complicated CSS.

I'm trying to avoid doing this, if possible:

#main-content {
  background: #333;
}

#page {
  background: #333;
}

#page-title {
  background: #333;
}

#branding {
  background: #666;
}

div.limiter {
  background: transparent;
}

div.region {
  background: #333;
}

span.fieldset-title {
  background: #333;
}

div.tabs {
  background: #333;
}

fieldset.collapsible {
  background: #333;
}

.collapsed .fieldset-legend a {
  background: #333;
  color: #fff;
}

Further, when implementing this code, I cannot get some divs to change color, for instance <div id="page-title">

0

It depends on the structure of the theme. If your can´t see any change after apply this, there are two possible reasons:

body {
  color:#fff;
  background:#333;
  }
  1. There are other elements, like divs, upon your body elemnts.
  2. The change that you made is not reflected on your site. Check if you are working in the correct css file. If it is a .sass file, maybe it needs to compile. Other reason for that, is for the cache, try to delete by going to admin/config/development/performance

Good luck!.

  • I'm seeing my changes. I have compressed JS/CSS turned off for development. You're right, there are all kinds of divs on top of the body element. What I don't understand is that it looks like all their backgrounds are set to transparent. – Brent Connor Apr 10 '18 at 18:40

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.