...

View Full Version : Multiple tables on one line



name _F1
09-30-2006, 01:33 PM
I wish to display multiple tables on one line, next to each other. This could be achieved using tables, but I want to avoid this is possible:


<table>
<tr>
<td>
<table>
<!--Table data-->
</table>
</td>
<td>
<table>
<!--Table data-->
</table>
</td>
<td>
<table>
<!--Table data-->
</table>
</td>
</tr>
</table>

I considered using display:inline, but the tables are bordered, and this caused display issues with the border as they only bordered one line.

Is there a solution to this problem using CSS? If it matters, the tables are within a DIV. In one case, there are two tables I wish to go alongside one another, in another, there are three.

mark87
09-30-2006, 03:24 PM
For the border you may want to look at using border-collapse:collapse on the table.

name _F1
10-01-2006, 12:48 AM
Tried that, it messed up the cells and for some of the tables the border was still just bordering one line, although in others it was bordering the whole thing - with messed up cells passing over the edges of the border.

Graft-Creative
10-01-2006, 01:04 AM
Why not try floats?

Just give each individual table a set width, then use css to float 'em left?

As long as your width values are correct, the tables should stack neatly side by side.

Kind regards,

Gary

name _F1
10-01-2006, 01:07 AM
So something like:


<table style="width:33%;float:left">
<!--Content-->
<table style="width:50px;float:left">
<!--Content-->
<table style="width:30px;float:left">

EDIT: That doesn't seem to work.

name _F1
10-02-2006, 08:05 AM
Can anyone help? :o



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum