Monday, 21 July 2014

Add border-bottom / border-top to table row using CSS 0


We can do it with table's border-collapse property.
Collapse

In which both the space and the borders between table cells collapse. So, there is only one border and no space between cells.

Just change the table border-collapse style into collapse using this following css
table {
    border-collapse: collapse;
}
Now the each cells are independent. So, you can apply border-bottom or border-top style for each td like bellow CSS.

To Set border-bottom,
.border_bottom {
    border-bottom: 1px solid #000;
}
To Set border-top,
.border_top {
    border-top: 1px solid #000;
}
LIVE DEMO
Have any doubt? Feel free to comment here!!!

0 comments:

Post a Comment