html - HTML & CSS Layout float issue

Question

This is basically the site http://funkz.nfshost.com/
The bottom post with <div id="big-post"></div> element is floated to the left,
and the sidebar with <aside id="tab-lists"></aside> element is floated to the right,
but when i add another(or more) <div id="big-post"> element after the first one it moves the whole sidebar down with the post... I've tried clearing, but nothing helped...I'm pretty sure the solution is simple, can someone help me?

Answer 1

<div class="some_new_div">
  <div id="big-post">...</div> 
  <div id="big-post">...</div> 
  <div id="big-post">...</div> 
</div>
<aside id="tab-lists"></aside>

CSS

.some_new_div{float: left;}

从 big-post 中删除 float，然后在 that-put big-post 元素中取一个新元素

Answer 2

在这种情况下，右边超过左边，你的侧边需要在链中向上移动，在这种情况下，在大柱上方。

Answer 3

右浮动元素必须放在其他元素之前，所以你必须这样做：

....
<aside id="tab-lists"></aside>
<div id="big-post"></div>
<div id="big-post"></div>
....

Answer 4

您的<aside id="tab-lists"></aside>元素需要出现在任何<div id="big-post">元素之前。

我刚刚将它移到 chrome 开发人员工具中的帖子 div 上方，并且可以成功添加另一个帖子。