Reputation: 602
i have div tag like this with 3 tables inside.
<div>
<table>
<tr><td>ABC</td><td>ABC</td></tr>
</table>
<table>
<tr><td>XYZ</td><td>XYZ</td></tr>
</table>
<table>
<tr><td>LMN</td><td>LMN</td></tr>
</table>
</div>
The output is
ABC ABC
XYZ XYZ
LMN LMN
How can I change to something like this?
ABC ABC XYZ XYZ LMN LMN
Upvotes: 1
Views: 4647
Reputation: 92274
They are block level by default, make them inline.
Example
table {
display: inline-block;
/** this works too */
display: inline-table
}
You can also make them float, as suggested by @j08691
table { float: left }
Upvotes: 3
Reputation: 207901
You could float the tables left and set a margin on their right side like this jsFiddle example
table{
float:left;
margin-right:80px;
}
Upvotes: 2