...

View Full Version : Table aligning and cell size setting?



joejoejoe
05-24-2010, 07:57 AM
So I'm having trouble getting my table where I want it and getting the cells to keep the shape I want, could someone assist me? I'm trying to get a table to stay on the top-right of a div, on top of everything else. Also, I'm trying to keep its cells in a specific size. Neither of these are working properly for me.
My HTML and CSS are here:
HTML


<div class="page">
<div class="header">
<table class="header">
<tr class="header">
<td class="header" />
<td class="header"><img src="./images/masthead_pic_1.gif" alt = "" height="77" width="78" /></td>
</tr>
<tr class="header">
<td class="header"><img src="./images/masthead_pic_2.gif" alt = "" height="78" width="78"/></td>
<td class="link"><a class="header" href="#about"> About Us </a></td>
</tr>
<tr class="header">
<td class="header" />
<td class="header">
<img src="./images/masthead_teeth_top.gif" alt = ""/>
<img class="header" src="./images/masthead_teeth_bot.gif" alt = ""/>
</td>
</tr>
</table>
<h2 class="header">Dr. Grave Digger<br /> &nbsp;&nbsp;Dr. Charles Senior</h2>
<p class="header"> <b>Office</b>: Address in some location, City, State<br /> <b>Tel</b>: (123)-456-6789</p>
<ul class="menu">
<li><a class="menu" href="#home">Home</a></li>
<li><a class="menu" href="#about">About Us</a></li>
<li><a class="menu" href="#appl">Appliances</a></li>
<li><a class="menu" href="#first">First</a></li>
<li><a class="menu" href="#fun">Fun Zone</a></li>
<li><a class="menu" href="#news">News</a></li>
<li><a class="menu" href="#faq">FAQ</a></li>
<li><a class="menu" href="#911">Problems &amp; Emergencies</a></li>
<li><a class="menu" href="#tech">Technology</a></li>
</ul>
</div>
CSS

ul.menu {
list-style-type:none;
color:#336633;
margin:0;
padding:0;
overflow:hidden;
}
li {
float:left;
}
a.menu {
font: bold 8pt "Arial";
text-decoration:none;
text-transform:none;
padding:4px;
background-color:#9CD3A3;
text-align:center;
display:block;
height: 15px;
/*padding: 5px 10px;*/
}

a:link.menu,a:visited.menu {
color:#336633;
}

a:hover.menu,a:active.menu {
color:black;
/*font-style: oblique;*/
}
div.header {
padding-left: 22px;
background-color:#9CD3A3;
}

table.header {
position:relative;
left:500px;
z-index:0;
border: 0px;
border-collapse:collapse;
padding: 0px;
margin: 0px;
overflow:
}
a.header {
text-decoration: none;
z-index: 1;
}
tr.header {
height: 78px;
}
td.header {
border: 0px;
padding: 0px;
border-collapse:collapse;
width: 78px;
text-align:center;
}

td.link {
background-color: #7accc8;
width: 78px;
height: 77px;
text-align:center;
}
h2.header {
font-weight: normal;
font-size: 26pt;
margin: 0px;
padding-top: 30px;
padding-left: 12px;
z-index: 1;
}
p.header {
font: normal 13px Arial;
z-index: 1;
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum