JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css">
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-collapse.js"></script>
<h2>Tables</h2>
<table class="table">
<tr><th>Id <th>Name <th>Email address</tr>
<tr><td>100001 <td>Joe <td>[email protected]</tr>
<tr><td>100 <td>Christine <td>[email protected]</tr>
<tr><td>1001 <td>John <td>[email protected]</tr>
</table>
<h2>using the bootstrap <a href="http://twitter.github.com/bootstrap/scaffolding.html#gridSystem">grid system</a></h2>
<div class="row">
<div class="span2">ID</div>
<div class="span2">Name</div>
<div class="span8">E-Mail</div>
</div>
<div class="row">
<div class="span2">100001</div>
<div class="span2">Joe</div>
<div class="span8">[email protected]</div>
</div>
<div class="row">
<div class="span2">100</div>
<div class="span2">Christine</div>
<div class="span8">[email protected]</div>
</div>
<h2>using a custom class</h2>
<div class="row">
<div class="spanFl">100000001</div>
<div class="spanFl">Joe</div>
<div class="spanFl">[email protected]</div>
</div>
<div class="row">
<div class="spanFl">100</div>
<div class="spanFl">Christine</div>
<div class="spanFl">[email protected]</div>
</div>
<h2>using a custom class and a dirty markup</h2>
<div class="row">
<div class="spanFl">100000001 <br />
100
</div>
<div class="spanFl">Joe <br/>
Christine
</div>
<div class="spanFl">[email protected] <br />
[email protected]
</div>
</div>
CSS
body {padding: 1em;}
td,th {padding: 1px 2px 1px 2px;}
th {font-weight: bold;}
.span4 {overflow:scroll;}
.spanFl { float: left; width: auto;}