浮动菜单内容高度

时间:2013-10-21 09:19:31

标签: html css sharepoint height floating

我有一个默认的Sharepoint 2013母版页,左侧有浮动菜单。问题是我无法在内容区域中使用浮动项目。简化的布局摘录如下所示:

<style>
    .leftMenu{height: 400px;width: 200px;float:left;border: 1px solid Red;}
    .content{border: 1px solid Blue;margin-left: 200px}
    .floatingItem{float:left;border: 1px solid Green;margin-left: 10px;}
</style>
<div class="leftMenu">LeftMenu</div>
<div class="content">
        <div class="floatingItem">floatLeft</div>
        <div class="floatingItem">floatLeft</div>
        <div class="floatingItem">floatLeft</div>
        <div class="floatingItem">floatLeft</div>
        <div style="clear:both"></div>
        I want to appear just bellow floating items
</div>

我需要模板宽度为100%。除非我在内容块中放置浮动项,否则模板行为正常。然后我得到了意想不到的行为 - 清除div和左下方菜单底线下面的任何浮动项目内容。

是否可以使内容块正常运行?我希望内容块高度不超过两行高:~30px。顺便说一下,我想在不使用JavaScript技巧的情况下解决它。

1 个答案:

答案 0 :(得分:1)

从HTML

中删除<div style="clear:both"></div>

有关详细信息,请查看以下内容:What is the use of style="clear:both"?