6 {{ upvoteCount | shortNum }}
6 {{ upvoteCount | shortNum }}

Help Me Spot the CSS Error (SOLVED)

by Dan C. Rinnert
5 replies
  • WEB DESIGN
    • |
I have two sections on a page.

One is the footer. I want text in the footer to be in white because the background is a dark color.

Code:
.footer {
height: auto;
width: 780px;
float: left; 
padding: 5px;
text-align: center;
font-size: .9em;
color: #FFFFFF;
}

.footer a {
color: #FFFFFF; 
text-decoration: none;
}
That works fine. The text displays in white.

Here's another part of the page. I also want the text to appear in white.

Code:
.navigation {
height: auto;
width: 780px;
float: left;
text-align: center;
background-color: #000000;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 18px;
color: #FFFFFF;
}
	
.navigation a {
text-decoration: none;
color: #FFFFFF;
}
The text in this section appears in black. I try different colors (other than white) and it's still black. To be more specific, if the text is a link, it appears in black. If it is non-linked text, it will be white.

I cannot spot where the error might be, but maybe I've been looking at it too long. Does anyone else see it?
#css #error #spot
  • Profile picture of the author ODSF
    Im going to give this a try... I may be wrong..

    But if you're floating a section, shouldn't it be

    #navigation {
    height: numberpx;
    width: numberpx;
    float: left;
    background-color: #000;
    color: #fff;
    etc
    }
    {{ DiscussionBoard.errors[2343247].message }}
    • Profile picture of the author Dan C. Rinnert
      Originally Posted by ODSF View Post

      Im going to give this a try... I may be wrong..

      But if you're floating a section, shouldn't it be

      #navigation {
      height: numberpx;
      width: numberpx;
      float: left;
      background-color: #000;
      color: #fff;
      etc
      }
      It doesn't work at all if I do that.

      Thanks for trying though!
      Signature

      Dan's content is irregularly read by handfuls of people. Join the elite few by reading his blog: dcrBlogs.com, following him on Twitter: dcrTweets.com or reading his fiction: dcrWrites.com but NOT by Clicking Here!

      Dan also writes content for hire, but you can't afford him anyway.
      {{ DiscussionBoard.errors[2343754].message }}
      • Profile picture of the author Dan C. Rinnert
        The odd thing is that everything else works. Background color, font-family, etc. Everything appears as defined, except for the color of the linked text.
        Signature

        Dan's content is irregularly read by handfuls of people. Join the elite few by reading his blog: dcrBlogs.com, following him on Twitter: dcrTweets.com or reading his fiction: dcrWrites.com but NOT by Clicking Here!

        Dan also writes content for hire, but you can't afford him anyway.
        {{ DiscussionBoard.errors[2343765].message }}
        • Profile picture of the author Dan C. Rinnert
          Ah-ha! Found it.

          Had this little gem hidden.

          Code:
          a:link {
color:black; 
text-decoration: none;
}
          It was after the navigation settings but before the footer settings. So, it overrode the navigation settings but not the footer settings.
          Signature

          Dan's content is irregularly read by handfuls of people. Join the elite few by reading his blog: dcrBlogs.com, following him on Twitter: dcrTweets.com or reading his fiction: dcrWrites.com but NOT by Clicking Here!

          Dan also writes content for hire, but you can't afford him anyway.
          {{ DiscussionBoard.errors[2343775].message }}
  • Profile picture of the author ODSF
    Close enough!

    Just kidding .. I failed miserably. Glad you found the mistake though.
    {{ DiscussionBoard.errors[2343861].message }}

Trending Topics