WEB any clue why my first CSS attribute doesn't work, but the rest do? v.pics

Discussion in 'OT Technology' started by Falconer, Nov 7, 2008.

  1. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    Whatever attribute I specify first in a div doesn't get recognized, but all the rest do.

    If I put something above the one that doesn't get recognized, then it gets recognized but the one above it doesn't.

    For example:
    [​IMG]

    [​IMG]



    Am I doing something wrong where it's not accepting the first line after a division is declared?

    Sorry if I used the wrong terminology for anything. CSS is not my forte.
     
  2. RetardedMonkey

    RetardedMonkey is a retarded monkey.

    Joined:
    Oct 21, 2006
    Messages:
    20,867
    Likes Received:
    0
    Location:
    Gold Coast, Australia
    H1/H2/H3 and so on, aren't attributes, they're tags.
     
  3. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    Ok, so any clue why my first CSS tag in each division isn't being recognized, but all the rest are?
     
  4. pkr

    pkr Guest

    Why are you enclosing the heading tags inside of an individual container?
     
  5. kingtoad

    kingtoad OT Supporter

    Joined:
    Sep 2, 2003
    Messages:
    55,918
    Likes Received:
    10
    Location:
    Los Angeles
    If you want to get technical, in this context, it's an element.

    If you want your h1, h2, h3, and p elements to be children of div#main, you'd declare it as so:
    Code:
    div#main h1, div#main h2 {
      color: #00ff00;
    }
    div#main h3 {
      color: #dda0dd;
    }
    div#main p {
      color: #0000ff;
    }
    
    You should also utilize semi-colons at the end of each statement.
     
  6. RetardedMonkey

    RetardedMonkey is a retarded monkey.

    Joined:
    Oct 21, 2006
    Messages:
    20,867
    Likes Received:
    0
    Location:
    Gold Coast, Australia
    Damn, he wins on the technical side of things :rofl:
     
  7. kingtoad

    kingtoad OT Supporter

    Joined:
    Sep 2, 2003
    Messages:
    55,918
    Likes Received:
    10
    Location:
    Los Angeles
    I'm kingtoad. :eek4:
     
  8. RetardedMonkey

    RetardedMonkey is a retarded monkey.

    Joined:
    Oct 21, 2006
    Messages:
    20,867
    Likes Received:
    0
    Location:
    Gold Coast, Australia
    :bowdown::bowdown::bowdown:
     
  9. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    I am a super noob at CSS.

    I thought by doing it this way, those heading attributes would only apply within the section I've declared as "main" ( <div id="main"> )within my page body, and not in any other section.

    Is that correct?
     
  10. Pepsi1975

    Pepsi1975 Mod of the Year

    Joined:
    Jan 6, 2005
    Messages:
    47,590
    Likes Received:
    0
    Location:
    Detroit
    damn i am in his sig 6 times :eek3:
     
  11. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    I will try this.

    I copied my syntax from w3schools. I assumed they would have it correct.
     
  12. RetardedMonkey

    RetardedMonkey is a retarded monkey.

    Joined:
    Oct 21, 2006
    Messages:
    20,867
    Likes Received:
    0
    Location:
    Gold Coast, Australia
    awdw

    You love the Kingtoad.
     
  13. kingtoad

    kingtoad OT Supporter

    Joined:
    Sep 2, 2003
    Messages:
    55,918
    Likes Received:
    10
    Location:
    Los Angeles
    That's weird w3schools would recommend that. h1, h2, h3, and p elements cannot be children of div#main in the way you've declared them. The way declared that way is syntaxically incorrect. You could have meant to create your selector like this:

    Code:
    div#main h1, h2, h3, p {
      color: #fff;
    }
    
    Which would give all h1 elements within div#main the color of #fff, and all h2, h3, and p elements in the document the color of #fff as well.
     
  14. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    I also need to modify link colors. So look at this example:

    http://www.w3schools.com/css/pr_pseudo_hover.asp

    It recommends this:

    Code:
    a:link {color: #FF0000}     /* unvisited link */
    a:visited {color: #00FF00}  /* visited link */
    a:hover {color: #FF00FF}   /* mouse over link */
    a:active {color: #0000FF}   /* selected link */}
    Which gives me the exact same problem as before.

    It won't recognize the first line, but all the rest work just fine.

    If I add something above that first line, then it recognizes it but ignores the line I just added.
     
  15. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    So I can declare div#main more than once? I thought you could only declare a division one time and everything had to go under it, like:

    div#main{
    - something in main
    - something else in main
    - another thing in main
    }

    and not

    div#main
    - one thing

    div#main
    - another thing

    div#main
    - a third thing,

    etc.
     
  16. Pepsi1975

    Pepsi1975 Mod of the Year

    Joined:
    Jan 6, 2005
    Messages:
    47,590
    Likes Received:
    0
    Location:
    Detroit
    you are just jealous that the kingtoad loves the pepsi
     
  17. kingtoad

    kingtoad OT Supporter

    Joined:
    Sep 2, 2003
    Messages:
    55,918
    Likes Received:
    10
    Location:
    Los Angeles
    This could be because you were implementing it the way you did in your first example. What w3schools is showing you right now is correct.
     
  18. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    So when I copy their code and paste it into my CSS file, why do I get the same issue where it ignores the first line after div#main { ?
     
  19. kingtoad

    kingtoad OT Supporter

    Joined:
    Sep 2, 2003
    Messages:
    55,918
    Likes Received:
    10
    Location:
    Los Angeles
    You could do this:
    Code:
    div#main h1,
    div#main h2,
    div#main h3, 
    div#main p {
      color: #fff;
    }
    
    Which would give the elements h1, h2, h3, and p the color of #fff within the div#main container.
     
  20. RetardedMonkey

    RetardedMonkey is a retarded monkey.

    Joined:
    Oct 21, 2006
    Messages:
    20,867
    Likes Received:
    0
    Location:
    Gold Coast, Australia
    :wtc: Don't tell everyone my secrets Pepsi!
     
  21. Pepsi1975

    Pepsi1975 Mod of the Year

    Joined:
    Jan 6, 2005
    Messages:
    47,590
    Likes Received:
    0
    Location:
    Detroit
    sorry man :hug:
     
  22. RetardedMonkey

    RetardedMonkey is a retarded monkey.

    Joined:
    Oct 21, 2006
    Messages:
    20,867
    Likes Received:
    0
    Location:
    Gold Coast, Australia
    I think the problem is that you're trying to specify an element (thanks Kingtoad) inside another.

    To specify an element, it has to be in this format:

    Code:
    div#main h1 { color: #000000; }
    Instead of

    Code:
    div#main { h1 { color: #000000; } }
    You're basically trying to specify an element where the attributes should go.
     
  23. RetardedMonkey

    RetardedMonkey is a retarded monkey.

    Joined:
    Oct 21, 2006
    Messages:
    20,867
    Likes Received:
    0
    Location:
    Gold Coast, Australia
    :hug:
     
  24. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    Thanks for the help.

    Working with this little bit of CSS makes me remember why I said f it on my last site and did the whole thing with tables and html. I spent 1 week trying to get it right with CSS, and then made it look perfect in one day with html.

    I hate how FF and IE interpret CSS differently. Why is IE centering all my text but FF is correctly left justifying it?

    Is CSS like the way of the future for web design? Do I have to learn it?

    edit - so none of my color attributes or anything are working on the web, but they are all working when I preview it in Dreamweaver. yes I have the correct css file uploaded to my site :hithead: I feel like it takes me 2 fucking hours to change the color of font with CSS. That's why I like html :hs:
     
  25. kingtoad

    kingtoad OT Supporter

    Joined:
    Sep 2, 2003
    Messages:
    55,918
    Likes Received:
    10
    Location:
    Los Angeles
    Keep pushing. It's harder for a person to transition from old-style HTML to XHTML/CSS, than a new person starting out fresh on XHTML/CSS

    When developing your documents you will come across a lot of problems between many browsers and that is because each browser renders your HTML differently than other browsers, despite how you declare you doctype (which tells browsers how to render your document). Often times, there are inheritance (parent/child relationships) issues that IE and sometimes even FF have problem parsing correctly. This could be why IE is centering your text. You'll find ways to fix these as long as you practice and stick with it. Read up on the box model differences in the IE rendering engine and Gecko.

    CSS isn't too hard, you just need it to "click". Once it "clicks" you'll sit back and all of a sudden realize that everything makes sense. All the attributes, syntax, properties, structure, etc. And from the way it looks right now, CSS is the future :hs: as it's currently the only thing right now dividing presentation from structure. It's still evolving and seems to continue evolving, along with HTML.
     

Share This Page