Note that there are some explanatory texts on larger screens.

plurals
  1. POcss submenu ul li problems
    primarykey
    data
    text
    <p>I have a menu using SuperFish but the last 2 submenu's do not align up properly.</p> <p>Here is my jsfiddle: <a href="http://jsfiddle.net/uP4bY/4/" rel="nofollow">http://jsfiddle.net/uP4bY/4/</a></p> <p>My CSS looks like this:</p> <pre><code> /* Header/Navigation */ div#Nav { background:transparent url(../Images/nav_Bg.png) no-repeat scroll top left; height:70px; width:980px; margin:0 auto; display:block; position:relative; z-index:2; } /*Level 1 or Parent / Destination*/ div#Nav ul { padding-top:9px; display:inline; list-style-type:none; margin:0; } div#Nav ul li { background:transparent url(../Images/nav_li_Separator.png) no-repeat scroll center left; padding-left:8px; margin-left:8px; display:inline; position:relative; } div#Nav ul li.First { background:none; margin:0; padding:0; } /*Level 2 Treks*/ div#Nav ul li ul { left:10px; position:absolute; top:26px; padding:0 !important; z-index:100; height:500px; float:left; list-style:outside; width:auto; } /*Level 3 Everest Region*/ div#Nav ul li ul li ul { float: left; height: 500px; left: 50px; list-style: disc outside none; padding: 0 !important; position: absolute; top: 30px; width: auto; z-index: 100; } /*Level 5 Everest Base Camp*/ div#Nav ul ul ul ul ul { float: left; height: 500px; left: 50px; list-style: disc outside none; padding: 0 !important; position: absolute; top: 60px; width: auto; z-index: 100; } div#Nav ul li ul li { border-top:1px solid #2f3b48; border-right:1px solid #384857; border-bottom:1px solid #384857; height:24px; display:block; padding:5px 15px 0; width:150px; /*width:150px;*/ border-left:1px solid #384857; margin:0 !important; background:transparent url(http://www.kenticotemplates.net/themeforest/DreamTravel/Images/Nav_ul_li_Bg.png) repeat scroll top left !important; } div#Nav a, div#Nav a:link, div#Nav a:visited { color:#7f8b98; } div#Nav a:hover, div#Nav a.selected { color:#96b2cb !important; text-decoration:none; } div#Nav ul#Links, div#Nav ul.nav { float:left; text-transform:uppercase; } div#Nav ul.Lang { float:right; } div#Nav ul li { float:left; } </code></pre> <p>I am pretty certain i need to style the last <code>ul li</code> but when i do this it moves the previous ul li. </p> <p><strong>UPDATE: it should look like this minus the white space!</strong> <a href="http://i48.tinypic.com/1zfpxqf.png" rel="nofollow">http://i48.tinypic.com/1zfpxqf.png</a></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload