fixed width cells?

[gloryboy]

hi guys

can anyone tell me how to do fixed width cells, i have width="33%" but when i put in a bigger picture the cell expands which is not what i want as i have 3 cells.

code is:

<td width="33%">
<img src="img/metal-balls.jpg" />
<p>Text</p>
</td>

<td width="34%">&nbsp
</td>

<td width="33%">&nbsp
</td>

thanks in advance

[Dan Schulz]

Rather than using a relative unit such as a percentage, try using an absolute unit such as pixels for your table cells.

Or better yet, declare an absolute width for the table element itself.

[DaveWoods]

Alternatively you could place the image in the cell using a background image.

<td style="width: 33%; background-image: url(img/metal-balls.jpg); background-repeat: no-repeat;">
<p>Text</p>
</td>

<td style="width: 33%;">&nbsp
</td>

<td style="width: 33%;">&nbsp
</td>

Although you'll also need a height associated with it otherwise the cell will only appear at the height of actual content in a cell.

Obviously you should also be doing this in an external CSS file but this should serve to demonstrate how this could work.

[AutisticCuckoo]

Table cells will normally expand to accommodate their content. Cell widths are more like min-width.

You may be able to achieve the desired result by playing with table-layout:fixed for the table and overflow for the cells.