SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Member Waveneyweb's Avatar
    Join Date
    Jun 2006
    Location
    England
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question "css Anthology" help needed please

    Hi
    I'm learning css with the help of the above book by Rachel Andrew (which has become my bible).
    I've used the sub-navigation example (on page 84 for anyone else who has the book).
    However many times I check my code, I can't get the nav bar to be 'collapsed'.
    I've uploaded it here
    & would be so grateful if anyone could advise me where i've gone wrong.
    Many thanks from a sunny Suffolk, UK.
    Tina

  2. #2
    Pedantic Semantic blain's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    528
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    try adding
    #navbar ul li ul {display: none;}
    Technology is dominated by two types of people:
    those who understand what they do not manage,
    and those who manage what they do not understand.

  3. #3
    SitePoint Member Waveneyweb's Avatar
    Join Date
    Jun 2006
    Location
    England
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)


    Thanks for your reply.
    That works to hide the sub navigation. However, it doesn't now show on hovering the cursor.
    At least it looks tidy now
    Thanks again, Tina

  4. #4
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Please excuse a little rant before I get to your problem:

    Code:
    	
     border-top-width: thin;
     	border-right-width: thin;
     	border-bottom-width: thin;
     	border-left-width: thin;
     	border-top-style: dotted;
     	border-right-style: none;
     	border-bottom-style: none;
     	border-left-style: none;
     	border-top-color: #35A0AA;
     	border-right-color: #35A0AA;
     	border-bottom-color: #35A0AA;
     	border-left-color: #35A0AA;
    It's time to learn some CSS shorthand. The above can be rewritten like so:
    Code:
     border-top: thin dotted #35A0AA;
    For your problem, you need something like this:
    Code:
     #navbar ul ul {
     display: none;
     	margin-left: 12px;
     	font-size: 11px;
     }
     #navbar li:hover ul {
     display: block;
     }
    That won't work in IE without some javascript because IE doesn't support :hover on anything but anchors. The whatever:hover will help you though.

  5. #5
    SitePoint Member Waveneyweb's Avatar
    Join Date
    Jun 2006
    Location
    England
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Tyssen,
    Yes I know I will to shorten my css once i've finished, but at the moment I'm finding it easier to check everything with it in long-hand.
    Thanks so much for the link. I've read it all about four times.................. and my brain has now exploded over the keyboard.
    Please help me understand!
    Do I sound desperate? I am, Iam!
    Thanks a lot, tina

  6. #6
    SitePoint Member Waveneyweb's Avatar
    Join Date
    Jun 2006
    Location
    England
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    #navbar ul ul {
    display: none;

    The code above causes the sub navigation list to not appear at all.
    Now I've cleared the bits of brain from my keyboard I shall sit in the sun for 10 minutes with coffee & chocolate, works for me.

  7. #7
    SitePoint Member Waveneyweb's Avatar
    Join Date
    Jun 2006
    Location
    England
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Now I've got this
    Everything OK in Firefox.
    Now to read up some more how to use javascript to make the sub nav work with I.E.

  8. #8
    SitePoint Member Waveneyweb's Avatar
    Join Date
    Jun 2006
    Location
    England
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thumbs up

    She's done it! Yes I really have, pretty chuffed with myself (until I try changing something else!).
    I used this tutorial for anyone else having the same problem.
    A happy Tina

  9. #9
    SitePoint Zealot
    Join Date
    Jul 2005
    Location
    Osoyoos BC Canada
    Posts
    178
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the link to the suckerfish tutorial Tina!

  10. #10
    SitePoint Member Waveneyweb's Avatar
    Join Date
    Jun 2006
    Location
    England
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No problem, nice to be able to be of help.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •