Search code examples
htmlhtml-tableduplicateswidthborder

How to remove double cell borders in HTML tables


I want a simple 17x2 HTML table with single lines as borders, no spaces between cells etc. This online editor returns the following code:

HTML Code

The output looks like this:Output

I added cellspacing="0" in order to get rid of the white spaces between cells. How do I get rid of the duplicate border between neighbouring cells?

PS.: The Stackoverflow input editor returns an code indentation error, although all indents are in place.


Solution

  • You can use the border-collapse: collapse Property on the table tag.

    for example:

    table {
        border-collapse: collapse;
    }
    

    more info https://www.w3schools.com/cssref/pr_border-collapse.asp