Yass
Yass

Reputation: 602

Div table float

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

Answers (2)

Ruan Mendes
Ruan Mendes

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

j08691
j08691

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

Related Questions