asp.net - 如何制作2个asp :Menu control render in the same line?

Question

我正在尝试在与现有菜单控件相同的行中添加第二个菜单控件，但我无法做到。

<div class="clear hideSkiplink">
            <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal">
                <Items>
                    <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"/>
                    <asp:MenuItem NavigateUrl="~/About.aspx" Text="About"/>
                </Items>
            </asp:Menu>
            <asp:Menu ID="SmallMenu" runat="server" CssClass="smallMenu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal">
                <Items>
                    <asp:MenuItem NavigateUrl="~/Settings.aspx" Text="Settings"/>
                    <asp:MenuItem NavigateUrl="~/Admin.aspx" Text="Admin"/>
                </Items>
            </asp:Menu>
        </div>

尝试使用 CSS 对其进行格式化，但它不起作用。第二个菜单出现在一个新行中。我在这里做错了什么？

div.menu
{
    padding: 4px 0px 4px 8px;
    float:left;
    width:500px;
}

div.smallMenu
{
    padding: 4px 8px 4px 0px;
    width: 300px;
    float: right;
}

编辑: 如果我将它们放在 div 中并将第二个 float 到右侧，我可以使它们出现在同一行，但现在右侧菜单的一半显示在右侧(外部)页面。

Answer 1

这听起来像是您必须使用浏览器的客户端调试工具进行调试的东西。根据您的描述(右侧菜单的拆分)听起来好像 CSS 继承层次结构中更高的东西正在影响该 DIV 的定位。

您可以尝试的另一件事是进一步嵌套菜单:

<DIV>
  <DIV style="float:left;">
     <DIV style="float:right;">
        <asp:Menu />
     </DIV>
     <asp:Menu />
  </DIV>
</DIV>       

预计到达时间:Here's有类似问题的帖子。前 2 个答案(截至撰写本文时分别为 7 分和 5 分)包含一些您可以尝试的内容和一些进一步的链接。