Question

我在asp.net

中设计我的水平菜单

<div id="menu" style="margin-left:auto;margin-right:auto" >
    <asp:Menu ID="Menu1" runat="server" Orientation="Horizontal" RenderingMode="list">
        <Items>
            <asp:MenuItem NavigateUrl="" Text=""  Value=""></asp:MenuItem>
            <asp:MenuItem  NavigateUrl="" Text="" Value=""></asp:MenuItem>
            <asp:MenuItem Text="" Value="">
                <asp:MenuItem NavigateUrl="" Text="" Value="" ></asp:MenuItem>
                <asp:MenuItem NavigateUrl="" Text="" Value="" ></asp:MenuItem>
                <asp:MenuItem Text=""  Value="">
                    <asp:MenuItem NavigateUrl="" Text="" Value=""></asp:MenuItem>
                    <asp:MenuItem NavigateUrl="" Text=""  Value=""></asp:MenuItem>
                </asp:MenuItem>
            </asp:MenuItem>
            <asp:MenuItem Text=""  Value="">
                <asp:MenuItem NavigateUrl="" Text=""  Value=""></asp:MenuItem>
            </asp:MenuItem>
            <asp:MenuItem Text=""  Value="">                             
                <asp:MenuItem NavigateUrl="#" Text="" Value=""></asp:MenuItem>
                <asp:MenuItem NavigateUrl="" Text="" Value=""></asp:MenuItem>
                <asp:MenuItem NavigateUrl="" Text="" Value="" Target="_blank"></asp:MenuItem>

            </asp:MenuItem>
        </Items>
    </asp:Menu>
</div><!-- #menu-->

我的页面宽度为1200像素。但有时我有5个菜单列表，有时我有4个菜单列表取决于用户。我需要制作一个始终可以在中心显示菜单的网页。

有人知道如何将水平菜单设置为中心而不使用CSS设置特定宽度吗？

Answer 1

#menu {
    display: table;
    margin: 0 auto;
}

它将使内部元素水平居中，并且无需设置特定宽度即可工作。适用于IE8 +和现代浏览器。

Answer 2

使用id菜单

设置div的css

margin:0 auto;
Display: inline-block;

这会将它置于浏览器的中心

Answer 3

使用id菜单

设置div的css

#menu {
    margin:0 auto;
    Display: inline-block;
}

这会将它置于浏览器的中心

Answer 4

您始终可以使用css规则：text-align

还可以使用另一种选择：

display: inline-block;
vertical-align: bottom;

垂直对齐是为了去除底部的额外边距

它会正常工作

Answer 5

我遇到了同样的问题，在尝试了我遇到的所有答案之后，我偶然发现了以下哪些内容适合我，当它被放置在Div的样式标签/ css中时：

表格布局：固定的;

希望有所帮助。

如何在不设置特定宽度的情况下将水平菜单设置为中心

5 个答案: