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 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Sep 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help - CSS Submenu positioning

    Hi guys, hope someone can help me real quick.

    I can't position the submenu of the website I'm building at the moment. The submenu should appear when the parent menu is hovered on. But the submenu list is appearing at the very left of the inline-block parent menus. (see doingpoker.org and highlight Rules)

    Here's my CSS for the menu:

    Code:
    /* MENU CSS */
    #header #topright ul.menu {
    }
    #header #topright ul.menu li {
      	display: inline; /* KEEPS PAGE MENU HORIZONTAL */
        /*position:relative;*/
      }
    #header #topright ul.menu li a {
      display: inline-block;
      color: #000;
      font-size: 13px;
      font-family: Verdana;
      padding-top: 6px;
      padding-bottom: 10px;
      padding-left: 18px;
      padding-right: 18px;
    }
    #header #topright ul.menu li:hover {
    }
    
    	
    	/* CHILD PAGES */
    	#header #topright ul.menu li ul.children {
    		background-color: #000;
    		width: 165px;
    		display: none;
    		position: absolute;
    	}
    	#header #topright ul.menu li:hover ul.children {
    		display: block;
    	}
    		#header #topright ul.menu li ul.children li {
    		}
    		#header #topright ul.menu li ul.children li a {
    			width: 100%;
    			border: 1px solid #505050;
    		}
    		#header #topright ul.menu li ul.children li:hover a {
    			background-color: #333333;
    		}
    		
    	/* END CHILD PAGES CSS */
    		
    	/* HYBRID SETTINGS */
    		#header #topright ul.menu a:hover,
    		#header #topright ul.menu li ul.children a {
    			background-color: #000;
    			color: #FFF;
    			text-decoration: none;
    		}
    /* END MENU CSS */
    See the commented position: relative? Already tried that, doesn't work.

  • #2
    New to the CF scene
    Join Date
    Sep 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Nevermind, got it fixed. Must put "left: 0" to the child UL. Then apply "position: relative" to the parent UL's LI.


  •  

    Posting Permissions

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