Immortal
09-14-2008, 10:58 PM
Hey guys, I will try keep this short. Having a layout problem with CSS and really need some help, as you can see in my below layout, the main structure bit, it all the way at the top and cut off, anyone know whats going on?
http://img233.imageshack.us/img233/8319/testerhx6.th.jpg (http://img233.imageshack.us/my.php?image=testerhx6.jpg)
Code:
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-image: url();
background-repeat: no-repeat;
height: 100%;
width: 100%;
position: inherit;
}
#main {
background-image: url(Images/backgroundScene.jpg);
background-repeat: no-repeat;
background-position: center bottom;
height: 100%;
position: absolute;
width: 100%;
text-align: center;
vertical-align: bottom;
}
#main #main-structure {
text-align: center; /* counter the body center */
height: 500px;
width: 625px;
background-image: url(Images/mainStructure.jpg);
background-repeat: no-repeat;
background-position: center bottom;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
z-index: 2;
}
#overlay {
background-image: url(Images/overlay.png);
height: 330px;
width: 100%;
z-index: 5;
background-position: center bottom;
}
-->
</style>
Thanks for any help!
http://img233.imageshack.us/img233/8319/testerhx6.th.jpg (http://img233.imageshack.us/my.php?image=testerhx6.jpg)
Code:
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-image: url();
background-repeat: no-repeat;
height: 100%;
width: 100%;
position: inherit;
}
#main {
background-image: url(Images/backgroundScene.jpg);
background-repeat: no-repeat;
background-position: center bottom;
height: 100%;
position: absolute;
width: 100%;
text-align: center;
vertical-align: bottom;
}
#main #main-structure {
text-align: center; /* counter the body center */
height: 500px;
width: 625px;
background-image: url(Images/mainStructure.jpg);
background-repeat: no-repeat;
background-position: center bottom;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
z-index: 2;
}
#overlay {
background-image: url(Images/overlay.png);
height: 330px;
width: 100%;
z-index: 5;
background-position: center bottom;
}
-->
</style>
Thanks for any help!