SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Member
    Join Date
    Jun 2004
    Location
    Chennai
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Equivalent Style for Cellspacing

    Hi,

    We have cellspacing in <table> as attribute. Is there any equivalent style/code in CSS?

    I have used the following code in css for table but no use. Any other way?

    <style>

    table { width:780px; margin:0px; padding:0px; }
    tr { margin:0px; padding:0px; }
    td { background:#EEE; margin:0px; padding:0px; }

    </style>
    T-R
    aSr

  2. #2
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,122
    Mentioned
    29 Post(s)
    Tagged
    2 Thread(s)
    Hi,

    If you use border-collapse: collapse; on the table element:
    td { padding } = cellpadding
    td { margin } = cellspacing
    Last edited by markbrown4; Jan 30, 2007 at 23:15.

  3. #3
    SitePoint Member
    Join Date
    Jun 2004
    Location
    Chennai
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    Simple and good .... Thank you! It is working in table tag.
    T-R
    aSr

  4. #4
    bronze trophy
    Join Date
    Dec 2004
    Location
    Sweden
    Posts
    2,670
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by markbrown4 View Post
    Hi,

    If you use border-collapse: collapse; on the table element:
    td { padding } = cellpadding
    td { margin } = cellspacing
    Not quite. 'margin' doesn't apply to table cells.

    HTML cellspacing="" corresponds to CSS 'border-spacing', which only applies when the separate border model is used.
    Simon Pieters

  5. #5
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,122
    Mentioned
    29 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by zcorpan View Post
    Not quite. 'margin' doesn't apply to table cells.

    HTML cellspacing="" corresponds to CSS 'border-spacing', which only applies when the separate border model is used.
    You're right, that code was nonsense.. I'm not sure how it answered the persons problem then.. They must have just been wanting to remove cellspacing(without using cellspacing="0") so border-collapse is what they were wanting perhaps?? Who knows..

    Thanks for the correction - I was sure I had used margin on table cells, my bad.

  6. #6
    SitePoint Member
    Join Date
    Jun 2004
    Location
    Chennai
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    In CSS "border-spacing" is not working in any elements (TABLE, TR and TD).

    But the "border-collapse: collapse" is working well in TABLE (redfine) tag in CSS.

    Sample code, previously I used (Wrong one):
    -----------------------------------------------

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Table Testing</title>
    <style>

    table { width:780px; margin:0px; padding:0px; }
    tr { margin:0px; padding:0px; }
    td { background:#EEE; margin:0px; padding:0px; }

    </style>
    </head>

    <body>
    <table>
    <tr>
    <td>Test Cell</td>
    <td>Test Cell</td>
    <td>Test Cell</td>
    </tr>
    <tr>
    <td>Test Cell</td>
    <td>Test Cell</td>
    <td>Test Cell</td>
    </tr>
    <tr>
    <td>Test Cell</td>
    <td>Test Cell</td>
    <td>Test Cell</td>
    </tr>
    </table>

    </body>
    </html>

    ------------------------------------------

    Sample code (Right one, now I am using):
    ----------------------------------------

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Table Testing</title>
    <style>

    table { width:780px; border-collapse:collapse; }
    td { background:#EEE; }

    </style>
    </head>

    <body>
    <table>
    <tr>
    <td>Test Cell</td>
    <td>Test Cell</td>
    <td>Test Cell</td>
    </tr>
    <tr>
    <td>Test Cell</td>
    <td>Test Cell</td>
    <td>Test Cell</td>
    </tr>
    <tr>
    <td>Test Cell</td>
    <td>Test Cell</td>
    <td>Test Cell</td>
    </tr>
    </table>

    </body>
    </html>

    Now there is no border/spacing between two cells.

    But the spacing is still there if I use 'border-spacing' in TABLE or TD
    T-R
    aSr

  7. #7
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,122
    Mentioned
    29 Post(s)
    Tagged
    2 Thread(s)
    Internet explorer, Internet explorer, Internet explorer..

  8. #8
    SitePoint Member
    Join Date
    Jun 2004
    Location
    Chennai
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Lightbulb

    Please look at the attachment.

    I am testing in IE6.0, FF1.5.0.9 and O8.54
    Attached Images Attached Images
    T-R
    aSr


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
  •