How to make table with table-layout: fixed; and how to make one column wider with CSS?

Spread the love

To make table with table-layout: fixed; and how to make one column wider with CSS, we set trhe width of the td element.

For instance, we write

<table>
  <tr>
    <td>150px</td>
    <td>equal</td>
    <td>equal</td>
  </tr>
</table>

to add a table.

Then we write

table {
  table-layout: fixed;
  border-collapse: collapse;
  width: 100%;
}
td {
  border: 1px solid #000;
  width: 150px;
}
td + td {
  width: auto;
}

to make the td element 150px.

Then we set the rest of the td’s to have auto width with

td + td {
  width: auto;
}

Leave a Reply

Your email address will not be published. Required fields are marked *