How to create a table with the same dimensions as a previous one
I would want to create a table with the same widths (table and its cells) then a previous one created dynamically
1st
__________________
|_____|___|_______|
|_____|___|_______|
|_____|___|_______|
2nd
__________________
|_____|___|_______|
|_____|___|_______|
What do I need to do to set the second one wi开发者_开发技巧th the desired widths. (Table 1 widths depends on it's content).
Edit: Finally, I went for the jQuery solution and did it like that:
$("#mySecondTable tr") // mySecondTable was already generated server side
.first() // All rows in my second table are similar so I just apply on the first one
.find("td")
.width(function(i){ return $("#myFirstTable tr").eq(1).find("td").eq(i).width() })
// eq(1) fetches the line I want to use as a model since some have different colspans
.end()
Use Javascript (I'd recommend jQuery) to get the width of each "column" (th
/td
) from the 1st table, and set the width
CSS property to that pixel value on the th
and/or td
s in the 2nd table.
if it is acceptable in your case use style="table-layout:fixed;" on both the tables to exactly controls the cell width
You could accomplish this with jQuery pretty easily:
$("table.foo")
.clone()
.find("td")
.html("")
.width(function(i){ return $("table.foo td").eq(i).width() })
.height(function(i){ return $("table.foo td").eq(i).height() })
.end()
.appendTo("body");
Online Demo: http://jsbin.com/obuco/3/edit
The quick and dirty answer: you could make them one table, with the text in between them being a single row with colspan="x", where x is either the number of columns in the table, or the number of columns + 1.
Since PHP works server side it can't be aware of browser windows dimensions and/or table design. It may check the table cell contents for string lengths and you may estimate and set the width of any cell in your output. But if table one has no width properties you'll probably need to use some javascript on your second table to make them fit the first widths.
'luca' and 'Bears will eat you' gave two good solutions. The only other one I see is to put all the data in one table, rather than two.
If I'm understanding correctly, its seems you should just css the desired width, and then everything will stretch according to the content inserted
精彩评论