"Christopher Benson-Manica" <at***@nospam.cyberspace.org> wrote in message
news:c2**********@chessie.cirr.com...
Given the following style definitions,
#menu tr {
width: 100%
text-align: left;
}
#menu td {
text-align: left;
white-space: nowrap;
background-color: 4169E1; /* royalblue */
}
#menu a {
text-decoration: none;
color: white;
font-size: 10pt;
font-family: "Arial", "Helvetica", "MS Sans Serif",
"sans-serif"; text-decoration: none;
font-weight: bold;
}
#menu {
color: white;
font-size: 10pt;
font-family: "Arial", "Helvetica", "MS Sans Serif",
"sans-serif"; text-decoration: none;
font-weight: bold;
}
why doesn't the following table render the way I'd like? The table
cells are indeed blue, but the row does not extend all the way across
the screen, and the cells are center aligned. Thanks for any help.
<table id=\"menu\" border=\"0\" cellspacing=\"3\">
<tr colspan=\"5\">
<td>
<a href=\"/index.html\">Home</a>
|
<a href=\"/public/contactus.html\">Contact Us</a>
</td>
</tr>
</table>
I don't know how this works at all with all your backslashes. When I used
your code exactly as above, I get no background and underscored links..
Remove the backslashes. Then add
background-color: yellow;
to the properties for #menu, and you'll see how wide the table is--much less
than 100% of the width of the screen. Then observe that when you make the
width of a block 100%, it means 100% of the width of its containing block,
not of the screen. So setting width="100%" on a TR means that the TR will
take up 100% of the width of the table. But that's beside the point, because
by definition a row must be as wide as the table (taking all the padding and
margins and borders into account)!
So if you want the *table* to take up the full width of the screen, you need
to say so in your styles.
