Changing font color

  • 1
  • Question
  • Updated 6 years ago
I love the open space in Oulipo and the fixed menu on the left. I'd like to use it with a dark background, fixed upper left, and I'm using a few illustrations (not the ones shown), so all the text left and right needs to be a light color. I have a transparent box in the main text area, so that text needs to be a dark color. Problem is, I can't seem to change the font color in the stylesheet in any way, except the a settings. Is there an overall setting I need to change or remove in order to control font color?
Photo of bernadette


  • 1 Post
  • 0 Reply Likes

Posted 6 years ago

  • 1
Photo of akadhim09


  • 8 Posts
  • 0 Reply Likes

Two things that might be preventing you from changing the color: First, CSS documents always give priority to the rules that are lowest in the document, so if you're typing in your color changes above existing color attributes, it won't make any difference. Second, in specific cases the !important tag can be added to an attribute so that it takes dominance over other attributes no matter where they are in the document.

If you don't need a fine level of control and just need to blanket each section with a specific color, I can recommend copy-pasting these little bits of code to the bottom of your stylesheet.

For your right sidebar:
#supplementary * {
color: #ddd !important;

For your menu:
div#main_nav * {
color: #ddd !important;

For your main blog post area:
div#content * {
color: #333 !important;

By writing the containing element for each section followed by an asterisk, we are saying that anything within that section should be that specific color.
Also, by putting these lines at the bottom of the stylesheet and adding the !important after the color makes sure that it takes precedence over any other color attributes that might also have !important already added to them