JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<div id="main">
<div id="sidebar">
側邊<br>側邊<br>側邊<br>側邊<br>側邊<br>
側邊<br>側邊<br>側邊<br>側邊<br>側邊<br>
側邊<br>側邊<br>側邊<br>側邊<br>側邊<br>
</div>
<div id="content">
<div class="row">
<div class="col-md-12">
1
</div>
</div>
<div class="row">
<div class="col-md-4">
2
</div>
<div class="col-md-4">
3
</div>
<div class="col-md-4">
4
</div>
</div>
<div class="row">
<div class="col-md-4">
5
</div>
<div class="col-md-4">
6
</div>
<div class="col-md-4">
7
</div>
</div>
</div>
<div style="clear:both"></div>
</div>
<div id="footer">
底部跟著內容跑
</div>
CSS
#sidebar {
position: absolute;
width: 200px;
background-color: red;
}
#content {
margin-left: 200px;
background-color: green;
}
#footer {
color: white;
background-color: blue;
}
.row {
border: 1px solid #fef;
}