SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot
    Join Date
    Jan 2006
    Location
    south london
    Posts
    188
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    fixed width cells?

    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

  2. #2
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.

  3. #3
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Alternatively you could place the image in the cell using a background image.

    Code:
    <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.

  4. #4
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,159
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.
    Birnam wood is come to Dunsinane


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
  •