I'm new to CSS and looking for help on how to format a table to appear as two distinct tables side by side. I want the brown cells to be brown and the rest blue.
https://i.sstatic.net/NrbsU.png
Here is my attempt so far, but I'm struggling with setting the border widths correctly. Any assistance with CSS would be greatly appreciated:
html {overflow: auto;}
div.dhtmlx_window_active, div.dhx_modal_cover_dv { position: fixed !important; }
body{width:99%;}
table {
width: 100%;
border-collapse: collapse;
text-align: center;
white-space: nowrap;
}
table * {
border: 1px solid black;
}
table thead * {
background-color: rgb(242, 242, 242);
}
.titlePrev {
background-color: rgb(183, 222, 232);
}
.titlegeneriquedpt {
background-color: rgb(196, 189, 151);
}
table tbody * {
background-color: rgb(218, 238, 243);
}
.generiquedpt {
background-color: rgb(238, 236, 225);
}
th:first-child, td:first-child {
border-left: 2px;
}<table><thead>
<tr>
...
Don't worry about the colspan settings I've used, they are necessary for future tables on this page.