< Style > Ul { Margin : 0px ; Padding : 0px ; } Ul Li { Float : Left ; Display : Inline ; Font : 0.9em Arial, Helvetica, sans-serif ; Height : 30px ; Width : 100px ; List-style : None ; } Ul Li { Color : # Fff ; Text-Decoration : None ; Line-height : 29px ; Width : 91px ; Margin : 0px ; Padding : 0px 0px 0px 8px ; Display : Block ; Border-Right : Solid 1px # ccc ; Border-bottom : Solid 1px # ccc ; Background : #808080 ; } Ul Li ul Li { Height : 25px ; } Ul Li ul Li { Background : #666 ; Line-height : 24px ; } Ul Li A: hover { Background : #666 ; } Ul Li ul { Visibility : Hidden ; } Ul Li: hover ul { Visibility : Visible ; } Ul Li ul Li A: hover { Background : #333 ; } </ Style > < Ul > < Li > < A Href = "#" > Menu 1 </ A > </ Li > < Li > < A Href = "#" > Menu 2 </ A > < Ul > < Li > < A Href = "#" > Sub-menu 1 </ A > </ Li > < Li > < A Href = "#" > Sub-Menu 2 </ A > </ Li > < Li > < A Href = "#" > Sub-menu 3 </ A > </ Li > </ Ul > </ Li > < Li > < A Href = "#" > Menu 3 </ A > </ Li > < Li > < A Href = "#" > Menu 4 </ A > < Ul > < Li > < A Href = "#" > Sub-menu 1 </ A > </ Li > < Li > < A Href = "#" > Sub-Menu 2 </ A > </ Li > < Li > < A Href = "#" > Sub-menu 3 </ A > </ Li > </ Ul > </ Li > < Li > < A Href = "#" > Menu 5 </ A > </ Li > </ Ul >