Set Table Heading Cells Height

Dysan

The following code, displays a basic 2x2 table. Why is the height of the table heading cells 22 pixels, even after I have declared them to be 19 pixels in height?

How do I get the height of the table heading cells to be 19 pixels?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<style type="text/css">
body
{
background: url(plan.bmp) no-repeat;
}

table.coll 
{
font-size: 8pt;
font-family: "Verdana";
border-collapse: collapse;
border: 1px solid rgb(138,188,1);
}

th
{
height: 19px;
border: 1px solid rgb(138,188,1);
background: url(bg.bmp);
}


</style>
</head>

<body>
<table class="coll" border="1">
<tr>
    <th><input type="checkbox" name="checkbox" value="checkbox"></th>
    <th>First Name</th>
    <th>Last Name</th>
</tr>
<tr>
    <td><input type="checkbox" name="checkbox" value="checkbox"></td>
    <td>FirstName</td>
    <td>LastName</td>
</tr>
</table>

</body>
</html>

benracer

try adding...

style="display: inline"

...to the form, by the looks of the table you have too much height from the cellpad and cellspace, along with the text it will be over the 19px.

How do I get the height of the table heading cells to be 19 pixels?

Lower text size, set the cellspace and cellpad to anything under 2 as 3 is the defult value.

Weedpacket

You also might need to shrink the checkboxes a bit - otherwise the row height will expand to accommodate them. Or try setting their margins to 0 (Firefox for example has a default for input[type="checkbox"] of "margin: 3px 3px 3px 4px").