javascript - Hiding elements in table causes columns to shift -

in example http://jsfiddle.net/byak4/ why hiding cell cause whole column shift on , can avoid this?

html

<table>     <tr>         <td>john</td>         <td>doe</td>     </tr>     <tr>         <td>hello</td>         <td><div class="hide">world</div></td>     </tr> </table> 

css

table {     width:400px; } 

js

$(document).ready(function() {     $('.hide').slideup(); }); 

try with

$(document).ready(function() {     $('.hide').hide(); }); 

slideup may causes meshup , give width td like

table tr td{     width:200px; } 

see demo

see using slideup demo2