drop down menu - CSS 'Dropdown' Fix -


In the afternoon, I have an issue with CSS. The third dropdown is incorrectly placed and I have no solution .

Here's what I want:

Before:

After: < P> Here is the CSS:

  ul.dropdown, ul.dropdown li, ul.dropdown ul {list-style: none outside none; } Ul.dropdown {background: url (".. / img / nav_bg.png") Any repeating scroll left top-transparent; Swim left; Padding: 0 3px; Status: Relative; Width: 9 70px; Z-index: 100; } Ul.dropdown li {float: left; Font size: 1.2mm; font-weight: bold; Line-height: 1.2m; Margin: 0; Padding: 0; Status: Relative; } Ul.dropdown li a {color: # 000000; Display area; Padding: 7px 0; } Ul.dropdown li a: Hover {color: # 0971BA; } Ul.dropdown li a duration (border-right: 1px solid # d6DBE0; display area; padding: 8px 12px;) Ul.dropdown li a.active {color: # 0971BA;} Ul.dropdown li.drop a span {background : Url ("../img/new_icons.png") Any repeat scroll right 13px transparent; minimum height: 0; padding: 8px 25px 8px 12px;} Ul.dropdown li.drop: hover {margin: 0 -1px ; Align text: left;} Ul.dropdown li.drop a {background: url ("../ img / nav_sub_bg.png") Repeat-X scroll 0 -999em transparent;} Ul.dropdown li.drop: hover a {Background: url ("../img/new_sub_bg.png") Replaced -X scrolls 0 0 # 0653 AE; Minimum height: 0;} Ul.dropdown li.drop: Hover one Db {background-position: right -12px; border: medium none; color: #fffff; padding: 8px 26px 8px 13px;} ul.dropdown ul {left: 0; margin: 0 0 -1 px; hidden Wave: Padding: 8px; position: full; top: 36px; visibility: hidden; width: 182px; z-index: 102;} ul.dropdown li ul li {float: none; font-size: 12px ; Text-shadow: # 000 0px 1px 0px; font-weight: bold; Minimum height: 0; Padding: 0; } Ul.dropdown li.hover, ul.dropdown li: Hover {Status: Relative; Z-index: 103; } Ul.dropdown li.drop: hover ul a {background: url ("../ img / nav_sub_bg.png") Repeat-X scroll 0 -54px transparent; Color: #FFFFFF; Display area; Height: 14 pixels; Minimum height: 0; Padding: 7px 12px; } Ul.dropdown li.drop: hover ul li a: hover {background-position: 0 -92px; Minimum height: 0; } Ul.dropdown li.drop: hover ul li a span {background: none repeat scroll 0 0 transparent; Display: Inline; Padding: 0; } Ul.dropdown li.drop: hover ul li.lastBild {height: 30px; } Ul.dropdown li.drop: hover ul li.lastChild a {padding: 7px 12px 9px; } Ul.dropdown li.drop: hover ul li.lastChild a {background-position: 0-130px; } Ul.dropdown li.drop: hover ul li.lastBild a: hover {background-position: 0 -168px; } Ul.dropdown li: Hover & gt; Ul {visibility: visible; } Ul.dropdown li.home A {Background: URL ("../img/new_icons.png") No-repeat scroll 14px-36px transparent; Display area; Minimum height: 0; } Ul.dropdown li.home a: hover {background-position: 14px-69px; } Ul.dropdown li.home A: Active {background-position: 14px-102px; } Ul.dropdown li.home a period {cursor: indicator; Display area; Minimum height: 0; Padding: 8px 19px 8px 20px; Text Indent: -99 9em; }    

Change the left position of 0 and the next dropdown. Normally 100 ul element

  ul.dropdown ul ul {left: 100%;}   

which is left: 0; should be mentioned in the following:

  ul.dropdown ul {left: 0; Margin: 0 0 -1 px; Hidden flurry; Padding: 8px 0; Status: Completed; Top: 36px; Visibility: hidden; Width: 182px; Z-index: 102; }   

Note You may also be overruled (by adding additional rules) Top: 36px; to above: 0;

Comments