html - set all nested li's to be width of widest li -


How do I get the same width of nested rhythm?

When I use the following code of each code as detailed in text only + margin

I want to extend all li in the form of comprehensive li under original UL.

Example:

& lt; Ul id = "menu" & gt; & Lt; Li & lt; A href = "#" headline = "menu A" & gt; Menu A & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & lt; A href = "#" headline = "menub" & gt; Menu B & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & lt; A href = "#" headline = "Nested Menu" & gt; Nested menu & lt; / A & gt; & Lt; Ul & gt; & Lt; Li & lt; A href = "#" headline = "menu item" & gt; Menu item & lt; / Li & gt; & Lt; Li & lt; A href = "#" headline = "tall menu item" & gt; Long menu item & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & lt; A href = "#" headline = "tall menu item" & gt; Long menu item & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Li & gt; & Lt; Li & lt; A href = "#" headline = "menu z" & gt; Menu z & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt;

With CSS:

  & style style = "text / css" media = "all" & gt; * {Padding: 0; Margin: 0; } Body, html {width: 100%; Height: 100%; } #wap {width: 800px; Height: 100%; Margins: Auto; } #Menuin {margin: 0x8px; Padding: 0; Font-size: 14px; Font weight: normal; } # Menu ul {list-style-type: none; List-style-status: outside; Status: Relative; Z-index: 300; Height: 32px; font-weight: bold; White-space: Abrop; Padding: 0; } # Menu one {text-decoration: none; Line-height: 32px; } #Menu A: Hover {} #Menu Li {Float: left; Status: Relative; Display: Inline; Height: 100%; List-style-type: none; Padding: 0 20px; Background: #ccc; } # Menu UL {status: absolute; display none; Left: 0px; Background: #BDCCD4; Width: 100%; } #MenuAl A, #Menu LiA {display: block; } #Menu Li Ul (background: #BDCCD4; Display area; } # Menu Li Ul A {font-weight: normal; Height: auto; Swim left; } # Menu ul ul {padding: 9 px; Display area; } #Menu Li Ul Lee {Padding: 9 px; Background: #BDCCD4; } #Menu Li: Hover {background: #ddd; Height: 32px; } #Menu Li Li: Hover, #Menu Li Li Li: Hover {background: #ddd; Height: 32px; } #Menu Li A: Link, #Menu Li A: Visited {text-decoration: none; Color: # 003E7E; Margins: Auto; }  

Longer length, you will need to manually set the width, as I know that there is no pure CSS method to get it automatically.

li {width: 100%} Fill in the list item the width of their container. If it is not set, then it will be the width of the user's browser window.


Comments

Popular posts from this blog

windows - Heroku throws SQLITE3 Read only exception -

lex - Building a lexical Analyzer in Java -

python - rename keys in a dictionary -