Can a td have width and colspan?

HTML & CSS
1

can a td have width and colspan BOTH ?

what does it mean ? This is confusing.

if I set width and if I set colspan … what it is going to set at the end ?

my problem is …are not they mean the same thing here ?

can anyone please simplify this concept ?

2

remember that a cell width is kinda like a ‘min-width’ ; so for example if you were to put in an IMG that was wider than your cell tyne cell would stretch to accommodate it. In other words, table cells don’t have overflow and don’t think of a width as something set in stone… cells may stretch to accommodate content wider than their ‘set width’

colspan is a TOTALLY different animal. for starters it cannot be set with CSS. Colspan basically means “take into consideration” the width of adjacent cells in adjacent rows when calculating your own width.

thinking predictably:

say you have a cell with COLSPAN=2 AND width=150

ROUGHLY this is what happens,

  • (assuming the other cells do no need to stretch for any reason)
    if the sum total of any cells within the colpan is >150, the cell in question will match that width
    if the sum total of any cells within the colpan is <150, the cell the OTHER cells will match the width ( see, greatest size wins)
    if the cell in question contains something wider than 150px, the cell will stretch to fit, and the other cells in the colspan will adjust accordingly.
    how other cells accommodate to this changes also depends on how you have set your ‘table-layout’ mode

the above is a ‘practical’ guideline if you want to read up on the details an inner workings on how column widths are calculated, go to :http://www.w3.org/TR/html401/struct/tables.html#h-11.2.4.4

hope that helps

3

Thanks for your time. I understand you tried to explain nicely. but unfortunately I could not understand a bit. I got more confused now.

I need a visual example to understand this concept

4

[font=calibri]Yes, a cell can have both width and colspan. Both work exactly as you would expect them to. The width says how wide it is, the colspan says how many columns the one cell will cover. Obviously if you have set widths on all your columns/cells then you’re going to get in a mess if the numbers don’t add up.

Example:

<table border>
<tr><td colspan="3" width="300" style="color:red;">This cell is 300px wide</td>
<td colspan="2" width="400" style="color:blue;">This cell is 400px wide</td></tr>

<tr><td style="color:red;">and it covers</td>
<td style="color:red;">3 columns</td>
<td style="color:red;">with no width set</td>

<td width="250" style="color:blue;">and covers 2 columns with the first one being 250px</td>
<td style="color:blue;">and the second having<br>no width set</td></tr></table>

You can see the result here:

724×72 2.36 KB

The browser will calculate the cell widths in the normal way.[/font]

5

aah…this is a breather. Thanks . This helped.

Thanks for your time.