#1
  1. Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2002
    Posts
    7
    Rep Power
    0

    CSS Cellspacing - Cellpadding


    I've been reading on the internet and getting conflicting info. I would like to move the cellspacing and cellpadding attributes into my css sheet. How would I go about this?

    <HTML><HEAD><TITLE>TEST</TITLE></HEAD><BODY>
    <LINK REL=STYLESHEET TYPE=TEXT/CSS HREF=style.css>

    <BR><CENTER>
    <TABLE CELLPADDING=0 CELLSPACING=0><TR>
    <TD><TABLE CELLPADDING=0 CELLSPACING=0><TR>
    <TD WIDTH=100% COLSPAN=2><IMG SRC=img/header.gif></TD></TR>

    <TR><TD WIDTH=22% VALIGN=TOP BACKGROUND=img/navbg.gif>
    &nbsp;&nbsp;<A CLASS=MENU HREF=index.php>Link #1</A><BR>
    &nbsp;&nbsp;<A CLASS=MENU HREF=index.php>Link #1</A><BR>
    &nbsp;&nbsp;<A CLASS=MENU HREF=index.php>Link #1</A><BR>
    &nbsp;&nbsp;<A CLASS=MENU HREF=index.php>Link #1</A><BR>
    &nbsp;&nbsp;<A CLASS=MENU HREF=index.php>Link #1</A><BR>
    <BR></TD><TD VALIGN=TOP>

    CONTENT AREA

    </TD></TR></TABLE>
    </TD></TR></TABLE>
    </CENTER>
    </BODY>
    </HTML>
    Last edited by elevati0n; September 8th, 2002 at 04:54 PM.
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2002
    Location
    Norway
    Posts
    34
    Rep Power
    13
    <style type="text/css">
    <!--
    table {
    padding: 2px;
    }
    -->
    </style>
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Nov 2001
    Posts
    1,882
    Rep Power
    19
    I've never looked into the CellSpacing before.

    Found these:
    http://selfhtml.teamone.de/css/eigen...border_spacing
    http://www.milov.nl/forum/1/158
  6. #4
  7. Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2002
    Posts
    7
    Rep Power
    0
    border-collapse: collapse; /* ie6 ? */
    border-spacing: 0; /* px? ns 6? */

    This combo got it down to 1px but I still had white space. From what I read the above tags only work with new browsers. CSS has too many quirks.

    CSS is a great concept but I can't stand the way it's been, being implimented.

    TABLE.MAIN {
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    border-color: black;
    border-style: solid;
    border-top-width: 2;
    border-left-width: 2;
    border-right-width: 2;
    border-bottom-width: 2
    border-spacing: 0;
    border-collapse: collapse;
    }
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2002
    Location
    Norway
    Posts
    34
    Rep Power
    13
    Originally posted by elevati0n
    CSS is a great concept but I can't stand the way it's been, being implimented.

    TABLE.MAIN {
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    border-color: black;
    border-style: solid;
    border-top-width: 2;
    border-left-width: 2;
    border-right-width: 2;
    border-bottom-width: 2
    border-spacing: 0;
    border-collapse: collapse;
    }

    You can narrow all that down into something like this:

    table.main {
    margin: 0px;
    padding: 0px;
    border: 2px solid black;
    border-spacing: 0px;
    border-collapse: collapse;
    }
  10. #6
  11. Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2002
    Posts
    7
    Rep Power
    0
    no those are just all the tags i tried, still no luck with the cellspacing though.
  12. #7
  13. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2002
    Location
    Norway
    Posts
    34
    Rep Power
    13

    Re: CSS Cellspacing - Cellpadding


    Originally posted by elevati0n
    <HTML><HEAD><TITLE>TEST</TITLE></HEAD><BODY>
    <LINK REL=STYLESHEET TYPE=TEXT/CSS HREF=style.css>
    ...

    Btw, the link tag is supposed to be in the head tag, not the body tag.
  14. #8
  15. Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2003
    Location
    West Midlands, UK
    Posts
    2
    Rep Power
    0
    This is the code I use (with formatting taken out, of course)...

    TABLE {
    border-spacing: 0px;
    border-collapse: collapse;
    }
    TD {
    margin: 5px;
    padding: 5px;
    }

    That works in IE and Netscape. I haven't tried with older browsers, but the newest versions seem as happy as they come with that code. That means you just use 2 lines of code to tell the browsers do have no margins... if it doesn't work in the older browsers, then just chuck in:

    margin: 0px;
    or
    padding: 0px;

    And one of those 2 will sort it out. I forget which, but one of them will. As long as the browser you're using supports CSS - haha.

    Remember also that if you just want margins on one side, for example, you can type:

    margin: 0px;
    margin-bottom: 5px;

    So you don't need to type 4 lines of code when 2 will do.

    Hope I could help!
  16. #9
  17. Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2003
    Posts
    18
    Rep Power
    0
    I use the following. I've yet to find a more complete compilation of CSS properties (aside from MSDN for IE, but that's a pain to use).

    CSS Property Index

    (There's also an HTML index for those interested.)
  18. #10
  19. Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2003
    Location
    West Midlands, UK
    Posts
    2
    Rep Power
    0
    Maybe Netscape and Microsoft should use this list and save everyone the hassle...
  20. #11
  21. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2003
    Posts
    3
    Rep Power
    0
    Remember also that if you just want margins on one side, for example, you can type:

    margin: 0px;
    margin-bottom: 5px;

    So you don't need to type 4 lines of code when 2 will do.
    or even 1 line:
    margin: 0px 0px 2px 0px;
    (top right bottom left)


    sorry to bring up an old post, couldn't help helping

IMN logo majestic logo threadwatch logo seochat tools logo