Table cells not fitting in row properly
Preface: the table layout/old html is due to using this for a email
newsletter.
I'm in the process of building a simple navigation with a table. What I'm
looking for is a 650px wide table with a header row for a banner, and then
six cells equally spaced underneath that for the navigation links. Right
now, the second row has one really long cell with the "ABOUT" link, and
then the following five cells are way to the right of the table. It only
does this when I have an image in the top row.
Code:
<!DOCTYPE html>
<head>
<title></title>
<style>
#container {
background-color: #efefef;
width: 650px;
}
#row_nav {
width: 650px;
}
.nav_link {
width: 108px;
background-color: #AB2328;
}
</style>
</head>
<body>
<table id = "container" align="center">
<tr>
<td>
<a href="#"><img src="banner.jpg"/></a>
</td>
</tr>
<tr id = "row_nav">
<td class = "nav_link">
<a href="">ABOUT</a>
</td>
<td class = "nav_link">
<a href="">AGENDA</a>
</td>
<td class = "nav_link">
<a href="">SPEAKERS</a>
</td>
<td class = "nav_link">
<a href="">SPONSORS</a>
</td>
<td class = "nav_link">
<a href="">TRAVEL</a>
</td>
<td class = "nav_link">
<a href="">REGISTER</a>
</td>
</tr>
</table>
</body>
</html>
Any help would be much appreciated.
No comments:
Post a Comment