Monday, November 7, 2016

HTML5 tables and borders

Since a few years ago, if you put in a table without ANY css, you are going to get a borderless table. Worse, if you put borders="1"  you will get the ugly, nasty  way old-school HTML double borders.  Worse STILL, even if you put the css for 1px solid black , you will STILL get the ugly double borders!!

The secret is to set the borders-collapse: to collapse.  (the default value is SEPARATE).




<style>
table {
    border-collapse: collapse;
}

table, td, th {
    border: 1px solid black;
}
</style>




No comments: