ASP菜单浮动属性不起作用

Question

我有一个asp菜单，我想将它浮动到左边，以便它后面的元素可以到达它的右侧（旁边）。我为Menu设置了CssClass，并将其添加了float: left，但它不起作用。我甚至将float:left更改为float:right以查看它是否有效，但没有任何结果。

这里是我的代码：

<form id="form1" runat="server"> 
     <div class="wrapper"> 
     <div class="navbar"> 


     /*some code*/ 

    </div> 

    <div class="middle"> 



    <asp:Menu ID="MenuRec" runat="server" CssClass="recFriends"> 
     <Items> 
      <asp:MenuItem Text="People you may know:" Selectable="false" Enabled="false"></asp:MenuItem> 
      <asp:MenuItem Text="<br/>" Selectable="false" Enabled="false"></asp:MenuItem> 

     </Items> 

     <Items> 
      <asp:MenuItem Text=" Item1" Selectable="false"></asp:MenuItem> 
      <asp:MenuItem Text=" Item2" Selectable="false"></asp:MenuItem> 
      <asp:MenuItem Text=" Item3" Selectable="false"></asp:MenuItem> 
     </Items> 
    </asp:Menu> 



      <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server"> 
      <!--here goes the customized content--> 
     </asp:ContentPlaceHolder> 

    </div> 
    <div class="footer"> 

    </div> 
</div> 
</form> 

</body> 

我的CSS：

.recFriends { 

    float:left; 
    padding-top:1em; 
    color:#003366; 
    font-weight:normal; 
    font-style:italic; 
} 

内部控制ContentPlaceHolder（这将是从这个母版页继承页）一定要来的权利菜单，但这些都是在它下面。

我搜索了很多，但没有什么工作，我甚至已经检查可用的解决方案在这里：

CssClass is not working for my asp menu - all code attached

asp Menu control not floating properly

谁能告诉我怎么解决这个问题呢？

谢谢。

Answer 1

将菜单包装在div中并关闭内容占位符前的div。将您的CSS类从菜单移动到容器格。

HTML

<div class="recFriends"> 
      <asp:Menu ID="MenuRec" runat="server"> 
       <Items> 
        <asp:MenuItem Text="People you may know:" Selectable="false" Enabled="false"></asp:MenuItem> 
        <asp:MenuItem Text="<br/>" Selectable="false" Enabled="false"></asp:MenuItem> 

       </Items> 

       <Items> 
        <asp:MenuItem Text=" Item1" Selectable="false"></asp:MenuItem> 
        <asp:MenuItem Text=" Item2" Selectable="false"></asp:MenuItem> 
        <asp:MenuItem Text=" Item3" Selectable="false"></asp:MenuItem> 
       </Items> 
      </asp:Menu> 
     </div> 
     <asp:ContentPlaceHolder ID="MainContent" runat="server"> 
      <!--here goes the customized content--> 
     </asp:ContentPlaceHolder> 

CSS

.recFriends { 
     float: left; 
     padding-top: 1em; 
     color: #003366; 
     font-weight: normal; 
     font-style: italic; 
     width: 20%; 
     padding-left: 2em; 
    }