SitePoint Sponsor

User Tag List

Results 1 to 10 of 10

Thread: Table borders

  1. #1
    My precious!!! astericks's Avatar
    Join Date
    Mar 2002
    Location
    Vancouver, BC
    Posts
    1,971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Table borders

    Hello...I was just wondering if there is a nice way to get table borders like this. I mean displaying all the <td> borders too.

    I am aware of the use of Css tags like border-right,left,top,bottom but it looks pretty tedious since I'll have to do <td class="border"> for every <td> tag.

    So...just wondering if there is an easier way to do this...maybe something like going through the table...i.e if i type <table class="border">, all the <td> get/inherit [?] their borders on each 4 sides.

    hope this makes sense...

    asT.

  2. #2
    SitePoint Addict naveed's Avatar
    Join Date
    Feb 2003
    Location
    Ottawa, Canada
    Posts
    230
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you want every TD to have the same border, you can put something like this in your style sheet:

    td { border: solid #000000 1px; }

  3. #3
    SitePoint Enthusiast
    Join Date
    Jan 2002
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    if you use
    Code:
    table, td { border: solid #000000 1px; }
    you get 2px on the "outside" too
    cavey

  4. #4
    SitePoint Member
    Join Date
    Feb 2003
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by cavey
    if you use
    Code:
    table, td { border: solid #000000 1px; }
    you get 2px on the "outside" too
    Doesn't that really depend on what you set other attributes like cellpadding and cellspacing to?
    ITBHost.com - The web host that cares!
    SciFiWebHost.com - The premier hosting solution for the Science Fiction, Fantasy and Horror community.

  5. #5
    SitePoint Enthusiast
    Join Date
    Jan 2002
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    cellspacing yes, if you have a different background color for the table than the cells.
    cavey

  6. #6
    My precious!!! astericks's Avatar
    Join Date
    Mar 2002
    Location
    Vancouver, BC
    Posts
    1,971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok, if i do table, td { border here} , ALL the cells are gonna have a border of 1 px. This disturbs the whole layout. I was looking for something toshow the border of cells in nested tables, not a general td { codes } statement.

    and i wanna avoid typing <td class="myclass"> for every <td> tag

    is there any way to do it like this:

    <table class="myclass"> ???

    and this gives all the cell borders.

    if not, any other alternative? PS: does this make any sense?

    If not, I'll explain further.

    asT.

  7. #7
    \m/\m/ karinne's Avatar
    Join Date
    Dec 2002
    Location
    Aylmer, QC, Canada
    Posts
    409
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try this

    #tableborder {
    border: 1px solid #000;
    }

    #tableborder td {
    border: 1px solid #000;
    }

    And then apply the class to whatever table your want your td's to have a border.

  8. #8
    My precious!!! astericks's Avatar
    Join Date
    Mar 2002
    Location
    Vancouver, BC
    Posts
    1,971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thank you karinne. It wasnt working until i changed the # to a dot. But you sure put me on the right track.

    thanks to all who replied too.

    cheers
    asT.

  9. #9
    gingham dress, army boots... silver trophy redux's Avatar
    Join Date
    Apr 2002
    Location
    Salford / Manchester / UK
    Posts
    4,838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by astericks
    thank you karinne. It wasnt working until i changed the # to a dot.
    ah, i looked at this last night but didn't spot it. yes, the # only works to define styles for unique elements (a single element on the page that has that particular ID). if you need to apply it to more than one element, you need to define a class using the dot...
    re·dux (adj.): brought back; returned. used postpositively
    [latin : re-, re- + dux, leader; see duke.]
    WaSP Accessibility Task Force Member
    splintered.co.uk | photographia.co.uk | redux.deviantart.com

  10. #10
    My precious!!! astericks's Avatar
    Join Date
    Mar 2002
    Location
    Vancouver, BC
    Posts
    1,971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    cheers redux...i didnt know that


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
  •