How to align asp:Menu in DIV tag?

Wodzu picture Wodzu · Aug 17, 2010 · Viewed 16.9k times · Source

My CSS looks like this:

#menu 
{
 width: 1024px;
 height: 25px;
 margin: 0 auto;
 text-align: right;
 background-color: Red;
}

My asp page looks like this, (in fragment):

        <asp:Menu ID="mnuMainMenu" runat="server" BackColor="#F7F6F3" 
            DynamicHorizontalOffset="2" Font-Names="Verdana" Font-Size="Medium" 
            ForeColor="#7C6F57"  
            Orientation="Horizontal" StaticSubMenuIndent="10px" Font-Bold="True">
            <StaticSelectedStyle BackColor="#5D7B9D" />
            <StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
            <DynamicHoverStyle BackColor="#7C6F57" ForeColor="White" />
            <DynamicMenuStyle BackColor="#F7F6F3" />
            <DynamicSelectedStyle BackColor="#5D7B9D" />
            <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
            <StaticHoverStyle BackColor="#7C6F57" ForeColor="White" />
            <Items>
                <asp:MenuItem Text="Projekty" Value="Projekty"></asp:MenuItem>
                <asp:MenuItem Text="Licencje" Value="Licencje"></asp:MenuItem>
                <asp:MenuItem Text="Kontrahenci" Value="Kontrahenci"></asp:MenuItem>
            </Items>
        </asp:Menu>

I want to have menu aligned to the right side of my div tag. Aligment must be done automaticaly, if I add more menu items menu should realign itself. This works as expected under split view in VS 2008, however in IE and FireFox the menu is aligned to the left. How to fix this problem?

Thanks for your time.

Answer

Joakim picture Joakim · Aug 17, 2010

You can wrap the menu in a div tag and set it to float right, this however makes it that certain html tags may float to its side as well.