Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3

Thread: Table Borders

  1. #1
    New Coder
    Join Date
    Oct 2004
    Posts
    67
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Arrow Table Borders

    Is there a way to take a simple, basic table, and make it so that it has borders on the sides, (aka, between each cell) and not have any on the top? So, in essence,

    data1 | data2 | data3 | data4
    data1 | data2 | data3 | data4

    Thanks

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Code:
    <table>
    <tr>
    <td style="border-right:1px solid #000000;">Data 1</td>
    <td style="border-right:1px solid #000000;">Data 2</td>
    <td style="border-right:1px solid #000000;">Data 3</td>
    <td>Data 4</td>
    </tr>
    <tr>
    <td style="border-right:1px solid #000000;">Data 1</td>
    <td style="border-right:1px solid #000000;">Data 2</td>
    <td style="border-right:1px solid #000000;">Data 3</td>
    <td>Data 4</td>
    </tr>
    </table>
    u can mess around with cellpadding and cellspacing

  • #3
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Inline styles? Yagh!!!

    If you don't use inline styles, but instead place style rules either in an internal or an external style sheet, you reduce the volume of code and be more flexible at the same time.
    In the -default- collapsing border model, it would suffice to set all left and right borders for every table cell:
    Code:
    td {
    border: 1px #000;
    border-style: none solid;
    }
    The "double" border in between two cells should collapse to a single width.
    Alternatively, you could set left borders only on the table cells, and set a right border on the table rows (left and right interchangable):
    Code:
    tr {
    border-right: 1px solid #000;
    }
    
    td {
    border-left: 1px solid #000;
    }
    Regards,
    Ronald.
    ronaldvanderwijden.com


  •  

    Posting Permissions

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