Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Feb 2012
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Help with CSS for dropdown menu

    Hi all,

    I've got this simple javascript dropdown menu,
    http://www.oneeightyone.com/new/nav.htm

    and I'm having two issues. One is that I'd like the list items to have some padding on the left, so that they are not overlapping the arrows. I've tried adding 'padding-left' to every style and I still can't seem to make it look right.

    I'm also trying to get rid of the dashed line for each of the last list items. I've tried applying the ':last-child' attribute to what I thought was the right style, but I get nothing.

    Any help is appreciated

  • #2
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    Try adding the padding here:

    Code:
    .dropmenu li ul li a{
    	width: 250px;
    	display: block;	
    	/* border:1px solid #CCCCCC; */
    	border-top: none;
    
    	padding-left: 30px;
    }
    and modify to this:

    Code:
    .dropmenu li ul li a:last-child {
        background-image: none;
    }
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS

  • #3
    New Coder
    Join Date
    Feb 2012
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts
    thanks! The padding tip worked perfectly. Still having problems with that last-child style though...

  • #4
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    Quote Originally Posted by mikenap View Post
    thanks! The padding tip worked perfectly. Still having problems with that last-child style though...
    Add or modify the code I gave in the same order, preferably adding it to the existing css rules for these elements. If there is code further down that references the same element(s) then it will overrule this css.
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS

  • #5
    New Coder
    Join Date
    Feb 2012
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Ah, seems like I had a typo in my code for that. Got it all working now. Thanks!


  •  

    Posting Permissions

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