2

I would like to have 2 tbody side by side. I tried with float and display inline, but doesn't seem to result.

This is the markup that I have today: 

table, th, td {
    border: 1px solid black;
}
<table style="width:100%">
    <thead>
        <tr>
            <th>Month</th>
            <th>Savings</th>
            <th>Column 3</th>
        </tr>
    </thead>
    <tbody align="right">
        <tr>
            <td>January</td>
        </tr>
        <tr>
            <td>February</td>
        </tr>
    </tbody>
    <tbody align="right">
        <tr>
            <td>$100</td>
            <td>test</td>
        </tr>
        <tr>
            <td>$80</td>
            <td>test2</td>
        </tr>
    </tbody>
</table>

I would like to have the side by side tbody, because my actual table is using some libraries to resize the column width and to reorder the lines.

Sean
  • 6,873
  • 4
  • 21
  • 46
Guilherme Felipe Reis
  • 773
  • 13
  • 26
  • A table can only have one body. –  Mar 05 '19 at 15:20
  • I agree with @Amy. You could try creating two tables side-by-side instead. – Bodrov Mar 05 '19 at 15:35
  • 5
    @Amy and @Bodrov—according to the docs, a `table` element may have zero or more `tbody` elements. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table – Sean Mar 05 '19 at 15:50
  • 2
    @Amy and Bodrov, Sean is right. we can have more than one tbody. see here -> https://stackoverflow.com/questions/3076708/can-we-have-multiple-tbody-in-same-table The difference is they are not using side by side – Guilherme Felipe Reis Mar 05 '19 at 15:53
  • @Amy I cannot not use two tables =( I am using a library to resize each column, and if I use a 2 tbody seems to work, and if I use 2 tables the first column wouldn't be resized – Guilherme Felipe Reis Mar 05 '19 at 15:55
  • 4
    I can't find a definitive answer in the spec, but I think `tbody` is supposed to contain *entire* rows, whereas you're using it to contain *partial* rows. Is there a reason you can't put your `td` elements in the natural order (Month > Savings > Column 3)? – mfluehr Mar 05 '19 at 16:16
  • 2
    You are using a separate tbody for each column, which in terms of HTML tables doesn't make much sense. If you must do it that way, you really should have three separate tables. But since you have theads with 3 entries in each row it would make much more sense to have tbodys with 3 entries in each row. It's not obvious why you are trying to do something so complicated (and I suspect impossible) when the eventual result you want could easily be in a simple table. -- Also, yes multiple tbbodys are legal, but "align=" is long obsolete. – Ray Butterworth Mar 05 '19 at 16:34
  • 3
    I think this is a great example of asking for help with a failed solution rather than asking for help with the original problem (which is usually a lot easier to solve). – Ray Butterworth Mar 05 '19 at 16:36

0 Answers0