Forum Moderators: open
In other words, I want something like the code below, but where all of the invisible dividers as visible internal dividers, and all of the visible dividers as thicker visible dividers:
<TABLE BORDER=1 CELLPADDING=4 RULES=GROUPS FRAME=BOX><COLGROUP></COLGROUP>
<COLGROUP SPAN=3></COLGROUP>
<TR> <TH>Weekday</TH> <TH>Date</TH> <TH>Manager</TH> <TH>Qty</TH> </TR>
<TR> <TD>Monday</TD> <TD>09/11</TD> <TD>Kelsey</TD> <TD>639</TD> </TR>
<TR> <TD>Tuesday</TD> <TD>09/12</TD> <TD>Lindsey</TD> <TD>596</TD> </TR>
<TR> <TD>Wednesday</TD> <TD>09/13</TD> <TD>Randy</TD> <TD>1135</TD> </TR>
<TR> <TD>Thursday</TD> <TD>09/14</TD> <TD>Susan</TD> <TD>1002</TD> </TR>
<TR> <TD>Friday</TD> <TD>09/15</TD> <TD>Randy</TD> <TD>908</TD> </TR>
<TR> <TD>Saturday</TD> <TD>09/16</TD> <TD>Lindsey</TD> <TD>371</TD> </TR>
<TR> <TD>Sunday</TD> <TD>09/17</TD> <TD>Susan</TD> <TD>272</TD> </TR>
</TABLE>
Is there a way to do this?
Thanks.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>test</title>
<style type="text/css">
.test {
border-collapse:collapse;
border: 2px solid black;
}
.test td, .test th {
padding: 4px;
border-top: 1px solid black;
border-bottom: 1px solid black;
border-right: 1px dotted black;
border-left: 1px dotted black;
}
.test th:first-child, .test td:first-child {
border: 1px solid black;
}
</style>
</head>
<body>
<table class="test>
<thead>
<tr>
<th>Weekday</th>
<th>Date</th>
<th>Manager</th>
<th>Qty</th>
<tr>
</thead>
<tbody>
<tr>
<td>Monday</td>
<td>09/11</td>
<td>Kelsey</td>
<td>639</td>
<tr>
<tr>
<td>Tuesday</td>
<td>09/12</td>
<td>Lindsey</td>
<td>596</td>
<tr>
</tbody>
</table>
</body>
</html>
I'd suggest to skip 17.2 on a first reading (it'll confuse you), but as always the standard includes gems for those digging in:
[w3.org...]