Is there a way to set the width of all td's in the same column without doing it manually for each td?

Is there开发者_StackOverflow a way to set the width of all td's in the same column without doing it manually for each td?

You can also use HTML <col> tag:

<table width="100%" border="1">
  <col class='first-col' />
  <col />
  <col />
  <tr>
    <th>ISBN</th>
    <th>Title</th>
    <th>Price</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>My first HTML</td>
    <td>$53</td>
  </tr>
</table>

.first-col {background:red; /*add width or any other styling here*/ }

jsFiddle link

This should do the trick for you

tr td:first-child {
    width:100px;
}

You could always give all the <td>'s in a particular column a class, like <td class="column3"> which would simplify things greatly:

.column3 {
    width:100px;
}

Use :first-child and + to get the column you want:

td:first-child { }                  /* Column 1 Styles */
td:first-child + td { }             /* Column 2 Styles */
td:first-child + td + td { }        /* Column 3 Styles */
td:first-child + td + td + td { }   /* Column 4 Styles */

This works in older browsers that don't support nth-child(n).

If you set the width of one cell in a column, all the cells in that column will have that width too.

I am pretty sure changing the width of a cell in one column does it for the rest of them. If that doesn't work, I would give them all a class and style the class. Hope this helps, it's my first answer.