tr border-bottom in inline style does not show

css, html, html-table

Solution

You cannot apply a border on `tr` element, you need to apply a border on `td`, or you need to use `border-collapse` for your `table` element

Demo (Applying `border-bottom` to `td`)

Demo 2 (Applying `border-bottom` to `tr` if used `border-collapse`)

table {
    width: 100%;
    border-collapse: collapse; 
}

table tr { /* Use table tr td if not using border-collapse property */
    border-bottom: 1px solid #eee;
}

Note: Avoid using inline styles, you will feel hard to change them at certain point, also, avoid using `!important` unless required, consider using more specific selectors instead.

Problem

I am trying to add border-bottom to `<tr>` element of table as below but it is not working. ``` <table> <tr style="border-bottom: 1px solid black !important;"> ``` It is working when I add the style to `<td>` but not on `<tr>`. How can I fix it?

Original source