User-985212943 posted
I'm trying to do a simple one tier horizonal menu using the cssfriendly control adapters. My problem is that if I set the width for li above a certain amount (in this case 12em) then my last item has a vertical indentation above it in firefox
- it doesn't line up horizontally. Doesn't drop down to the next line, it just drops down about 10px. I thought that this could be due to the width value of ul.Aspnet-Menu but the problem occurs however large this value is. Any ideas as to
what is happening?
.CCMenu ul.AspNet-Menu /* Tier 1 */
{
width: 52em; /* This is more than (6em x 2) because we want to leave room for borders around the <li> elements that are selected */
letter-spacing:1px;
}
.CCMenu li /* all list items */
{
width: 13em;
font-size: .8em;
text-align:center;
}
<div >
<asp:Menu ID="MainMenu" runat="server" Orientation="Horizontal" OnMenuItemClick="MainMenu_MenuItemClick"
CssSelectorClass="CCMenu" >
<Items>
<asp:MenuItem NavigateUrl="~/default.aspx" Text="Home" Value="~/default.aspx" />
<asp:MenuItem NavigateUrl="~/recommendations.aspx" Text="Client Testimonials " Value="~/recommendations.aspx" />
<asp:MenuItem NavigateUrl="" Text="Driver Application" Value="" />
<asp:MenuItem NavigateUrl="" Text="Request Quote" Value="" />
</Items>
</asp:Menu>
</div>
