側欄不正確定位

Question

基本上，我不明白爲什麼不在右上角？它將自己定位在底部，即使按照我的理解，它應該位於右上角？

見的jsfiddle詳細代碼

http://jsfiddle.net/5JhMj/

#content section { 
padding: 4%; 
width: 70%; 
float: left; 
background-color: white; 
margin-bottom:8%; 
-webkit-box-sizing:border-box; 
-moz-box-sizing:border-box; 
box-sizing:border-box; 

}

aside { 
width: 30%; 
float: right; 
background-color: green; 

}

Answer 1

你漂浮在你的最後一節元素側邊欄。

取而代之，將您的部分包裹在另一個浮動的容器周圍。然後讓你的側邊欄在新的容器旁邊浮動。

<div class="container"> 
    <div class="section-container"> 
     <section>...</section> 
    </div> 
    <aside> 
     ... 
    </aside> 
</div> 

CSS

.section-container{ 
    width: 70%; 
    float: left; 
} 

aside { 
    width: 29%; 
    float: right; 
    background-color: green; 
} 

小提琴： http://jsfiddle.net/5JhMj/2/

Answer 2

簡單的辦法就是section

之前把你放在一邊

像

<div class="container"> 
<aside> 
<h1>placeholder</h1> 
</aside> 
<section> 
... 
... 

Working Fiddle