jquery clone table and keep the same dimensions

I am having an issue that I am hoping is easy to fix开发者_开发知识库.

I have an html table which I am cloning using

var clonedTable = $("#mytable").clone();

I then append my cloned table to a div

$("#mydiv").append(clonedTable)

If I then remove all the from my cloned table and only keep the header, the dimensions of the table change.

What is the easiest way for me to keep the dimensions of my cloned table the same as the original table after removing all the and only keeping the header ?

Use CSS and style the table the way you wish, with or without content.

It sounds like the table size is dependent on the contents, so once those are removed it goes back to "auto sizing".

Another alternative is to get the size of the original table's columns and apply them as width styles to the clone, but this involves some further processing.

It sounds like you are relying on the default table width algorithm that browsers use. You should set the width of the table element explicity, aka:

 <table style="width: 400px;">

OR

 <table style="width: 50%;">

So the table remains that width even in another element.