I have given both of my tables the same styling to create a 1px border, but the problem is that when the two tables are touching each other the bottom border from the top table and the top border from the bottom table meet and create what looks like a 2px border.
As you can see here: jsfiddle
this is the CSS I'm using to style my tables:
table,td, th {
border-style:solid;
border-width:1px;
border-color:#000;
}
I've tried border-collapse:collapse;
but it doesn't seem to do the trick.
The idea here is to remove all relevant top borders on every table immediately following another table.
http://jsfiddle.net/thirtydot/yrUXb/10/
table, td, th {
border-collapse: collapse;
border: 1px solid #000;
}
table + table, table + table tr:first-child th, table + table tr:first-child td {
border-top: 0;
}
Give style to lower table as :
margin-top:-1px;
padding-top:-1px;
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With