I am using the same sample from Twitter Bootstrap 2.0 above as you can see in the picture, and then using the code at hand. It is not responding well to screen size changes as you can see in the screenshot attached. It's quite weird. Even the source code looks same. ERr
<!-- Main hero unit for a primary marketing message or call to action -->
<div class="hero-unit">
<div class="row">
<table class="table">
<thead>
<tr><th>#</th><th>First Name</th><th>Last Name</th><th>Username</th></tr>
</thead>
<tbody>
<tr><td>1</td> <td>Mark</td> <td>Otto</td> <td>@mdo</td> </tr>
<tr><td>2</td> <td>Jacob</td> <td>Thornton</td> <td>@fat</td> </tr>
<tr><td>3</td> <td>Larry</td> <td>the Bird</td> <td>@twitter</td></tr>
</tbody>
</table>
<table class="table table-bordered">
<thead>
<tr>
<th>ID</th>
<th>Username</th>
<th>First Name</th>
<th>Last Name</th>
<th>Email Address</th>
<th>Country</th>
<th>Referrer</th>
</tr>
</thead>
<tbody>
<tr>
<?php
if (isset($content) && !empty($content) && is_array($content)) {//2
$i = 0;
$entries = array();
while(array_key_exists($i, $content)) {//1
$entries[$i] = "\n" .'<td>'.$id[$i] .'</td>';
$entries[$i] .= "\n" .'<td>'.$username[$i].'</td>';
$entries[$i] .= "\n" .'<td>'.$first_name[$i].'</td>';
$entries[$i] .= "\n" .'<td>'.$last_name[$i].'</td>';
$entries[$i] .= "\n" .'<td>'.$email_address[$i].'</td>';
$entries[$i] .= "\n" .'<td>'.$country[$i].'</td>';
$entries[$i] .= "\n" .'<td>'.$where_about[$i].'</td>';
//$entries[$i] .= '<td>'.$sample[$i].'</td>';
echo $entries[$i];
$i++;
}//1
}//2
?>
</tr>
</tbody>
</table>
</div> <!-- row -->
</div> <!-- hero -->
<tr></tr>
for each entry? Otherwise it looks like you're just pumping all that entry data into a single row.