...

View Full Version : Problem trying to code this particular psd



juanc
06-27-2010, 01:41 AM
Hi I'm not sure how I should slice and code this particular psd.....here's a screenshot but bear in mind I'm having trouble only coding the main body section after the navbar. Before that I'm fine.

http://www.juanchandler.com/screenshot.png

Secondly here are the .png's I've sliced from the main image.

http://www.juanchandler.com/body_bgtop.png
http://www.juanchandler.com/body_background.png

Bear in mind it's going to be a Wordpress theme ie. the height of the container would be different each time, so body_background.png needs to tile vertically. Then the text needs to start further up over body_bgtop.png which won't repeat as a background.

So this is what I've written.




<style type="text/css">

body{
background: #000000;
margin: 0px;
padding: 0px;
color: #ffffff
}

#container{
width: 1245px;
margin: 0px auto;
background: url(images/body_background.png) repeat-y;
}

#container-bgtop{
width: 1245px;
background: url(images/body_bgtop.png) no-repeat;
}
</style>


</head>

<body>

<div id="container">
<div id="container-bgtop">
Text goes here
</div>
</div>

</body>




Whilst this does achieve the goal I mentioned above it makes body_background.png appear overlapping body_bgtop.png.

If someone could advise it would be much appreciated.

Brucey2010
06-27-2010, 02:15 AM
I'm still learning myself but why do you need <div id="container-bgtop"> inside <div id="container"> could you not just have.


<div id="container"></div>
<div id="container-bgtop">
Text goes here
</div>



Other than that cant you just use padding to position it?


padding: 0px 0px 0px 0px; /* top-right-bottom-left */


This could be nonsense if so just ignore it :D



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum