asp css与简单浮动不在treeview上工作

时间:2015-04-27 03:06:45

标签: html css asp.net treeview

我的目标是在左侧treeview和右侧content place holder。这是HTML

<body>
    <form id="formMenu" runat="server">
    <asp:TreeView ID="treeMenu" runat="server" DataSourceID="SiteMapDataSource1">
    </asp:TreeView>

    <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />

    <div id="content">
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

        </asp:ContentPlaceHolder>
    </div>
    </form>
</body>

这是我的CSS

#treeMenu
{
    float:left;
    width:200px;
}

#content
{
    float:right;
    margin-left:auto;
    margin-right:auto;
}

浮子过早工作。 #content浮动到#treeMenu的右侧,但其浮动太右,其位置低于 #treeMenu,而不是在其右侧。

我尝试使用overflow:hidden,但它没有产生任何影响。

请帮助我。谢谢你的帮助。

2 个答案:

答案 0 :(得分:2)

您可以将overflow:auto添加到#content,不要在其上设置任何float

&#13;
&#13;
#menubar {
    float:left;
    width:200px;
    background:lime;
}
#content {
    overflow:auto;
    background:orange;
}
&#13;
<div id="menubar">menubar</div>
<div id="content">Chocolate liquorice gummi bears biscuit macaroon cheesecake candy sugar plum. Liquorice sugar plum caramels cookie candy toffee pie. Bonbon pudding cotton candy. Soufflé bear claw sesame snaps soufflé pudding chupa chups pudding ice cream candy. Marshmallow carrot cake muffin apple pie powder. Tootsie roll cotton candy cheesecake. Dragée candy canes toffee. Dragée toffee macaroon. Ice cream gummies chocolate sugar plum. Oat cake danish powder cake sugar plum biscuit. Gummi bears liquorice jelly beans. Chocolate bar biscuit gummi bears pastry chocolate cake marzipan cake.</div>
&#13;
&#13;
&#13;

或者,您可以为这两个元素设置使用table-cell

&#13;
&#13;
#menubar {
    display:table-cell;
    width:200px;
    background:lime;
}
#content {
    display:table-cell;
    background:orange;
}
&#13;
<div id="menubar">menubar</div>
<div id="content">Chocolate liquorice gummi bears biscuit macaroon cheesecake candy sugar plum. Liquorice sugar plum caramels cookie candy toffee pie. Bonbon pudding cotton candy. Soufflé bear claw sesame snaps soufflé pudding chupa chups pudding ice cream candy. Marshmallow carrot cake muffin apple pie powder. Tootsie roll cotton candy cheesecake. Dragée candy canes toffee. Dragée toffee macaroon. Ice cream gummies chocolate sugar plum. Oat cake danish powder cake sugar plum biscuit. Gummi bears liquorice jelly beans. Chocolate bar biscuit gummi bears pastry chocolate cake marzipan cake.</div>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

我需要将TreeViewdiv打包在一起,然后使用div&#39; id执行CSS以使其正常工作