Changing right Border on table cell to none.

Discussion in 'CSS' started by web_junkie, Sep 17, 2008.

  1. #1
    HI, I need some help. I have a table with right border on each TD with css. Now, i do not want the last cell of the table to have a right border, how can I do this.

    Thanks
     
    web_junkie, Sep 17, 2008 IP
  2. ClickMedia

    ClickMedia Banned

    Messages:
    104
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Write a separate class in css with no right border and apply that class for the last TD.
     
    ClickMedia, Sep 17, 2008 IP
  3. live-cms_com

    live-cms_com Notable Member

    Messages:
    3,128
    Likes Received:
    112
    Best Answers:
    0
    Trophy Points:
    205
    Digital Goods:
    1
    #3
    <td style="margin-right: 0 !important;">aa</td>
     
    live-cms_com, Sep 21, 2008 IP
  4. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #4
    <imho>!important has no place in modern web design.</imho>

    But yes, you could also write the no-border style inline like that, however it's not recommended. Because too many browsers don't understand last-child, you'll have to do what ClickMedia said and make a class.
     
    Stomme poes, Sep 22, 2008 IP
  5. live-cms_com

    live-cms_com Notable Member

    Messages:
    3,128
    Likes Received:
    112
    Best Answers:
    0
    Trophy Points:
    205
    Digital Goods:
    1
    #5
    What is an example of a browser which the above code wouldn't work in?
     
    live-cms_com, Sep 22, 2008 IP
  6. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Your code, or last-child?
    Rephrase: You'll have to use a class because last-child isn't understood by too many browsers.

    Last-child was (at least until recently) only supported by FF, though I'll bet by now Opera and Saffy can deal with it. IE6 and 7 don't.

    If you mean your code, oh, it works in all browsers as far as I know-- just like <font> tags work in all browsers. It's more a comment of the abuse of !important (it was meant for something else, but people discovered that, I think it's that IE will accept comments after !important so people use it as a hack for IE6).

    First, if the guy has an external (referenced in <link> tag) or even internal css (just sitting in the <head>), your code would override even without the !important since inline code ALWAYS gets precedence.

    Second, let's say there was a whole bunch of other stuff in your inline code... if two things conflicted, the second should will ALWAYS take precedence here too (because it was listed last) so no need for !important there either.

    And third, if the guy has like a LOT of tables and wants the last cell of every table to have no border, that's a lot more code to copy and paste (not that it's not work to add classes to all those, which is why we'd all be soooo happy if we could just use last-child : ) That's more the reason to avoid inline styles in any case, not just in this case.

    So, it's not that it doesn't work, it's just a practise best left back in the 90's.

    I did asssume you meant border: 0 or border-right: 0 or something too, right?

    Anyway I notice I've been adding to a lot of posts you've also answered. I swear I'm not stalking, just clicking my way down the posts : )
     
    Stomme poes, Sep 22, 2008 IP
  7. mypsdtohtml

    mypsdtohtml Guest

    Messages:
    96
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #7
    border: none;

    this CSS is for no borders
     
    mypsdtohtml, Sep 22, 2008 IP
  8. live-cms_com

    live-cms_com Notable Member

    Messages:
    3,128
    Likes Received:
    112
    Best Answers:
    0
    Trophy Points:
    205
    Digital Goods:
    1
    #8
    I think I have noticed cases where an inline style didn't take precedence without !important, maybe it was a browser bug or my mind playing tricks on me. :p

    Yeah, I meant border-right.
     
    live-cms_com, Sep 22, 2008 IP
  9. ads2help

    ads2help Peon

    Messages:
    2,142
    Likes Received:
    67
    Best Answers:
    1
    Trophy Points:
    0
    #9
    border-right:0 will do the job
     
    ads2help, Sep 23, 2008 IP
  10. buzzmaker

    buzzmaker Peon

    Messages:
    103
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #10
    There are two ways to do this:
    1) Change the Design
    2) Create a separate class for the last TD. If this is going to be a dynamic content page, if the last cell of the table is going to be decided dynamically, the programmers can manage this with a condition.
     
    buzzmaker, Sep 24, 2008 IP