I've got one simple problem with my layout, here's the site:
http://mahrishi3.tripod.com/Rubix/
The content boxes on the right need to be pushed up to the top, aligned with the box on the left, but for some reason they're always vertically centered, even if I add more boxes....
*Yes, please ignore the tripod ads for right now, i'm going to get a better host soon*
The external css file:
Code:
body {
background-color: #FFFFFF;
background-image: url(images/background.gif);
margin: 0 auto;
padding: 0 ;
}
#border{
width: 780px;
background: #FFF;
border: solid 1px #666666;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
margin-top: 20px;
}
#header{
display: block;
width: 780px;
height: 160px;
background: url(images/top_nav_01.jpg);
padding: 0px;
margin: 0px;
}
#nav{
display: block;
width: 780px;
height: 30px;
background: url(images/nav_buttons.jpg);
padding: 0px;
margin: 0px;
}
#center{
text-align: center;
}
#boxback{
background:repeat-x url(images/box_bg.png);
border:#cccccc 1px solid;
margin: 0 auto;
padding:4px;
width: auto;
}
#box{
border: 1px solid #DDDDDD;
width: auto;
margin: 0 auto;
padding: 5px;
text-align: left;
background-color: #FBFBFB;
}
#lefter{
padding: 20px 15px 0 15px;
text-align: left;
}
td {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size : 10px;
color : #770404;
font-weight : normal;
}
th {
font-family: Verdana, Arial, Helvetica, sans-serif;
}
Now, I know it's gotta be something simple that i keep missing, but I can't think of it.
Any Ideas?
|