Home/ Questions/Q 4550410
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-21T16:29:33+00:00

How can I make the table header appear on the left side of the

  • 0

How can I make the table header appear on the left side of the table as a column instead on the top as a row? I have this markup:

<table>
  <thead>
    <tr>
      <th>a</th>
      <th>b</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>2</td>
    </tr>
  </tbody>
</table>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    How’s this?

    Example

    Example

    CSS

    thead {
  float: left;   
}

thead th {
  display: block;   
}

tbody {
  float: right;   
}

    jsFiddle.

    Update

    Well, the 1, 2 should also be as column, obviously.

    jsFiddle.

    It also looks like IE baulks at this. You may have to trade semantic-ness for cross browser compatibility.

    Update

    Example

    If you have multiple rows that you want to become columns.

    jsFiddle.

    • 0