TABLE with no vertical cell borders

I would like my HTML table to only show the horizontal cell borders. Is there a way where I can hide the vertical cell borders?

How do I remove vertical borders from a table?

to select the table and show the Table Design tab. On the Table Design tab, click the arrow next to Borders and then click No Border .

How do you remove borders from a table cell?

Remove a cell borderClick Home > the Borders arrow > Erase Border, and then select the cells with the border you want to erase.

How can we avoid the borders seen between the table cells?

To avoid having double borders like in the example above, set the CSS border-collapse property to collapse .

How do I remove horizontal borders from a table?

Remove a horizontal lineOn the Home tab, click the arrow next to the Borders and Shading button, and click No Border.

You can add strictly horizontal border lines by styling tr tags via CSS.

Example CSS:

tr {
    border-bottom: 1px solid black;
    border-top: 1px solid black;
    border-collapse: collapse;
}

Of course, you can use any border style/width/color you choose.

JS Fiddle: http://jsfiddle.net/XPyzM/

Donate For Us