HTML and CSS Reference
In-Depth Information
FiGure 17-8
To get the desired effect, change the CSS rule to reference a more specific target. Here's the CSS as
well as the excerpted HTML:
th.separatedCell {
border-right: 2px solid black;
}
<tr>
<th colspan=”2” class=”separatedCell”>Atlantic Division</th>
<th colspan=”2”>Pacific Division</th>
</tr>
This code results in a border separating only the table header cells as shown in Figure 17-9.
FiGure 17-9
There's a great deal of design flexibility available to working with border styles, but you have to be
very specific about your CSS rules.
ModiFyinG TabLe coLors
Color, in tables, is not only great for spicing up potentially boring data, but it can also make the
same data easier to read. You can add two types of color to a table: background color and text color.
Often, both color options are applied at the same time to maintain a high contrast for increased
