SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Addict webmistress's Avatar
    Join Date
    Aug 2002
    Location
    Derbyshire, UK
    Posts
    295
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    problem with table borders

    I am having a bit of a mare with table borders...

    I want to define a class that puts a border around all the individual cells and the border to be 1px wide.

    I can only get the border around the outside of the whole table and it doesn't apply to the cells... I have tried using the border-collapse: separate; but I can't get it working....

    Help!

    Thanks.

    ****************
    The Webmistress

  2. #2
    SitePoint Member leoo24's Avatar
    Join Date
    Dec 2003
    Location
    spain
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    here's a quick crude example but should give you the idea,remember that 'border-collapse' is IE propietary

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

    <html>
    <head>
    <title>Untitled</title>
    </head>
    <style type="text/css">
    table {border-collapse: collapse ;border:1px solid red;}
    td {border:1px solid red;}
    </style>
    <body>

    <table border=0 >
    <tr><td>kdfjdskfjdskjk</td><td>sdfjdskfjdsk</td></tr>
    <tr><td>kdfjdskfjdskjk</td><td>sdfjdskfjdsk</td></tr>
    <tr><td>kdfjdskfjdskjk</td><td>sdfjdskfjdsk</td></tr>
    </table>
    </body>
    </html>
    Free invisible counter / stats tool for tracking your visitors
    The best alternative if you don't have access to your raw logs.

  3. #3
    SitePoint Addict webmistress's Avatar
    Join Date
    Aug 2002
    Location
    Derbyshire, UK
    Posts
    295
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Ta

    Thank you.
    ****************
    The Webmistress

  4. #4
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by leoo24
    here's a quick crude example but should give you the idea,remember that 'border-collapse' is IE propietary
    Border-collapse is not proprietary!
    http://www.w3.org/TR/REC-CSS2/tables...apsing-borders

  5. #5
    SitePoint Member leoo24's Avatar
    Join Date
    Dec 2003
    Location
    spain
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmm, interesting, it's not something i've ever used really and certainly not researched. Admittedly i hadn't used it because i thought it was proprietary!
    Webmistress nothing to worry about then

    cheers vgarcia


    you learn something new every day
    Free invisible counter / stats tool for tracking your visitors
    The best alternative if you don't have access to your raw logs.

  6. #6
    SitePoint Addict webmistress's Avatar
    Join Date
    Aug 2002
    Location
    Derbyshire, UK
    Posts
    295
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks.

    I dont suppose anyone knows if you can center a table in css can you? I can't find that one anywhere?

    So instead of specifiying it here: <table align="center">
    I want it in the CSS file...?

    You can't specify table widths either can you?
    ****************
    The Webmistress

  7. #7
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Code:
    table {
      width: 800px;
      /*will center the table, except in IE5/Windows*/
      margin: auto;
    }
    I believe the above is what you're after .

  8. #8
    SitePoint Addict webmistress's Avatar
    Join Date
    Aug 2002
    Location
    Derbyshire, UK
    Posts
    295
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmm it doesn't work in IE v 6 either? I might have to hard code it in for safety....

    Thanks for the width! that one works!
    ****************
    The Webmistress

  9. #9
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,555
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    hmm it doesn't work in IE v 6 either
    Then you're probably working in quirks mode. Are you using a full doctype with uri?

    You could enclose the table in a div that has a class set with text-align:center that will center for ie5 and ie6 in quirks mode.

    Hope that helps.

    Paul

  10. #10
    SitePoint Member leoo24's Avatar
    Join Date
    Dec 2003
    Location
    spain
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yes this gets around ie 5.5 problems too, you need a container div with text-align:center; and the content div/table with margin:0 auto; for it to center cross browser. If you're using a transitional doctype leave the DTD part out.

    <div style="text-align:center;">
    <table style="margin:0 auto;">
    tablerow, cell, content etc</table>
    </div>
    Free invisible counter / stats tool for tracking your visitors
    The best alternative if you don't have access to your raw logs.


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
  •