PDA

View Full Version : css positioning help


aoreste
May 11th, 2006, 07:53 AM
<style type="text/css">

body {
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
background-color:#D9D9D9;
margin:0 auto;
}

#headerbackground {
background:url(headerb.png) repeat-x;
z-index:1;
}

#header {
height:330px;
background:url(header.png) no-repeat center ;
z-index:100;
}

#footer {
background:url(footer.png) no-repeat center ;
height:133px;
}

#main {
background:url(body.png) repeat-y center;

}



</style>

</head>

<body>


<div id="headerbackground">

<div id="header">
</div>

</div>


<div id="main">

<h1>CONTENT GOES HERE</h1><br>
asdasdasdasdasd

</div>


<div id="footer">

</div>


</body>
</html>

that's my centerd fixed layout with css. what i am having trouble with
is placing the content in the "main" div. i just can't get the text
where i want to. what kind of positioning should i use? i want the text
aligned to the left, but NOT to the left of the page, the left of the
content area (which is centered). and one more thing: on the header
image, i need to position a bit of text at an exact position (it needs
to correspond with and image that is the reflected text).



i kept messing around with different positioning types, but i just
can't get it to work. either the graphics get messed up, or the text
gets messed when i resize the browser window. any help will be
appreciated.



thanks in advance
Inept
May 11th, 2006, 09:43 AM
I would suggest looking into using floats to position the content. But they can get tricky so make sure you check regualry in both FF and IE to make sure it's working properly.

-Inept
aoreste
May 11th, 2006, 10:04 AM
floats would't work because i need all the control i can get. but i figured it out. i used relative positioning and pointed my text pixel by pixel.