html - table columns does not show up in resize -

html - table columns does not show up in resize -

i have 3 tables...... first table not given margin left..... next 2 tables have given margin-left move on left side.... when resize window not able see lastly column in other 2 tables.... how prepare it.... first table looks fine even after resize......

http://jsfiddle.net/x7hd9/

providing code below

<table class="table" style="margin-left: 160px; width: 1759px;"> <thead> <tr class="subbomlistheading subbomheading" style=""> <th>bom type</th> <th>product p/n</th> <th>version</th> <th>brand name</th> <th>bom description</th> <th>generation</th> <th>version</th> <th>notes</th> <th>delete</th> </tr> </thead> <tbody> <tr style="background-color: #e5dcd1;" class=" subbom"> <td>sub bom</td> <td>99-00302-00</td> <td>v.02</td> <td>creative</td> <td>hardware v1.0 system</td> <td>g1</td> <td>1</td> <td>new</td> <td><input type="radio" name="sex" value="male"></td> </tr> </tbody> </table>

try :

<table class="table" style="margin-left: 160px; width: 100%;">

also, maintain in mind <tables> not 'responsives' (has in 're-layout'), still 'extensibles'.

your table displayed @ it's minimum width, it's normal don't see lastly column, overflows viewport.

html css html5 css3 css-float