SitePoint Sponsor

User Tag List

Page 2 of 2 FirstFirst 12
Results 26 to 34 of 34
  1. #26
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Hello. Posting from my phone so I obviously can't look at code. Previously in this thread you had #top-nav li a{} and set the text decoration there. Is it still like that? Well to reset it for the dropdown, just do something like...#top-nav li li a{text-decoration:none} . It'll select the dropdowns anchors and format that.
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  2. #27
    SitePoint Enthusiast
    Join Date
    Feb 2012
    Posts
    31
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My code is set to:
    Code:
    #top-nav li li a {text-decoration:none}
    It can wait until your in front of a computer.

    Thanks Ryan!

  3. #28
    SitePoint Enthusiast
    Join Date
    Feb 2012
    Posts
    31
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry about this, but I am stuck on yet another issue.

    I am trying to add a background color and a border radius to the #top-navigation {} to help make it stand out better.

    I've got it all set, I just can't get aligned with the right-hand side edge of the container. I've add margin-right:300px; to the #top-navigation {} then yes it will move it over to the right. However, if you maximize the window that it doesn't say in line with the container.

  4. #29
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,791
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)
    Your rule is cascading. all you need to do is override it on the next level.

    #top-navigation li li a {text-decoration:none; }


    ASIDE:
    You could alter your original selector for underlining #top-nav>li a {text-decoration:none; }if you don't mind having the underline appear for IE6 users. Then you wouldn't have to override the rule as I suggested earlier.

  5. #30
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Sword Dancer View Post
    My code is set to:
    Code:
    #top-nav li li a {text-decoration:none}
    It can wait until your in front of a computer.

    Thanks Ryan!
    This was a bit tricky. It's because on "#top-nav li:hover,#top-nav li.sfhover" you set a text-decoration. Thus when you hover over and the dropdown appears, the LI is still being hovered.

    To fix this, just remove that text-decoration rule on that and it'll remove it .

    Quote Originally Posted by Sword Dancer View Post
    Sorry about this, but I am stuck on yet another issue.

    I am trying to add a background color and a border radius to the #top-navigation {} to help make it stand out better.

    I've got it all set, I just can't get aligned with the right-hand side edge of the container. I've add margin-right:300px; to the #top-navigation {} then yes it will move it over to the right. However, if you maximize the window that it doesn't say in line with the container.
    It's because the #top-navigation is centered via margin:0 auto (I don't even see the margin right rule on it??)

    On #top-navigation, remove the margin:0 auto rule, and replace it with float:right. Then on #container, give that clear:both to clear from the navigation .
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  6. #31
    SitePoint Enthusiast
    Join Date
    Feb 2012
    Posts
    31
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    <rant>

    I have splitting headache right now and I feel so incredibly stupid/frustrated over this...argggg

    </rant>

    I tried removing the text-decoration: one from #top-nav li:hover,#top-nav li.sfhover but it wasn't working the way I wanted it. Where do I put text-decoration: underline so that only the Home, Calendars, Newsletters, and Contact links will have an underline when hovering, while the links on the Calendars drop-down menu won't have any underline at all.

    I removed the margin: 0 auto; rule from the #top-navigation and I replaced it with float: right; then on the #container I added clear:both; but it's still not aligning correctly with the container.

    argggg

    I just started over by copying the code from my public site and pasting it into my test CSS file.

    My test site can be found here and my CSS file can be found here.

  7. #32
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Via your page. The top nav is aligning exactly like I wanted it to. Where is it supposed to be? I thought you wanted it on the right of hte page. You want it aligned with the right side of the container border? From my understanding? If so, put back the margin:0 auto on #top-navigation. Change the width to match the container (960px)

    The purple background will now extend the full 960px. You can fix that by moving the background/border radius to the <ul> #top-nav

    You'll have to mess with little aesthetics to make it look good (padding) but it's fine.

    This next part about the underline is untested, though it should work (if it doesn't, I'll actually go through and do tests)
    You have this.
    Code:
    #top-navli:hovera,#top-nav li.sfhover a {
        color: yellow; /* rollover text for the main menu */
        text-decoration: none;
    }


    Make it this
    Code:
    #top-nav li:hover li a,
    Code:
    #top-nav li.sfhover li a {
        color: yellow; /* rollover text for the main menu */
        text-decoration: none;
    }
    #top-nav li:hover a{text-decoration:underline;}
    Edit-I hate this friggin editor. Those last two code blocks. Combine the rules. I don't know WHY it's separating the rules. Frustrating.
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  8. #33
    SitePoint Enthusiast
    Join Date
    Feb 2012
    Posts
    31
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That was it Ryan! You are a CSS genius!

    Major thanks!

  9. #34
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    All sorted? Good . Glad that's all done with . You're welcome.
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work


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
  •