我有一个默认的 Sharepoint 2013 母版页,左侧有 float 菜单。问题是我不能在内容区域中使用 float 元素。简化的布局摘录如下所示:
<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%。除非我将 float 元素放在内容 block 中,否则模板表现良好。然后我得到了意想不到的行为 - 清除 div 和 float 元素下方的任何内容出现在左侧菜单的底线下方。
是否可以使内容 block 正常运行?我希望内容 block 高度不超过两个行高:~30px。顺便说一句,我想在不使用 JavaScript 技巧的情况下解决它。
最佳答案
只需删除 <div style="clear:both"></div>
来自 HTML
有关更多信息,请查看:What is the use of style="clear:both"?
关于html - float 菜单内容高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19490529/