在一篇文章中創建兩個段落HTML5

Question

我對HTML5相當陌生。現在我正在第一篇文章中嘗試兩個段落。我使用了一些http://f6design.com/projects/parallax-scrolling/的片段。簡單地說，我想在介紹文章中實現兩個段落。我嘗試過這個選擇，但失敗了。

<div class="side-container"> 
     <!-- left side --> 
     <aside> 
     Left: Fixed width, 100% height of the window or right hand content 
     </aside> 

     <!-- main content --> 
     <article> 
     Right: Fluid width      
     </article> 
    </div> 

http://jsfiddle.net/t3AxY/7/

這裏是我的代碼 http://jsfiddle.net/sw8s4/
任何建議，如何做到這一點？

最佳，
塞巴斯蒂安

Answer 1

我會嘗試這樣的事：

#content { 
    z-index: 4; 
    position: relative; 
    max-width: 900px; 
    padding: 0 10px; 
    margin: 0 auto; 
    line-height: 1.7; 
} 
#intro { 
    float:left; 
    width: 400px; 
    padding-right:40px; 
} 
#manned-flight { 
    width: 100%; 
} 
article img { 
    height:30px; 
    width:100%; 
} 

我不知道究竟你的輸出應該是什麼樣子，但這樣一來你得到兩列。 其中第一個獲得固定寬度，第二個調整大小以填充父項的其餘部分。

updatet您jsfiddle

現在你也可以把height:100%;上body，#content和#intro使其窗口高度的100％。