SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Addict
    Join Date
    Dec 2009
    Posts
    302
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    can a td have width and colspan ?

    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. #2
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,821
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)
    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/...tml#h-11.2.4.4

    hope that helps

  3. #3
    SitePoint Addict
    Join Date
    Dec 2009
    Posts
    302
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by dresden_phoenix View Post
    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/...tml#h-11.2.4.4

    hope that helps
    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. #4
    Mouse catcher silver trophy Stevie D's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    5,892
    Mentioned
    123 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by windowsxp View Post
    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 ?
    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:
    HTML Code:
    <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:


    The browser will calculate the cell widths in the normal way.

  5. #5
    SitePoint Addict
    Join Date
    Dec 2009
    Posts
    302
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    aah.....this is a breather. Thanks . This helped.

    Thanks for your time.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •