• Locked
No replies
Mon, 2010-02-15 03:09
electripunk
electripunk's picture
Offline
newbie
Last seen: 12 years 26 weeks ago
Timezone: GMT-5
Joined: 2010-02-15
Posts: 1
Points: 2

I am trying to create a layout from a psd sliced and saved. I have saved all the slices and created the layout however, my content container background image is 450px tall. my content only uses maybe 250 of those pixels. How would I resize the background to whatever the content size may be at any given time?

Do I really have to use java script?

Thank in advance for any help you offer.

James

*{
margin: 0;
padding: 0;
}
 
 
body {
background-color: #000000;
color: white;
font-size: 100%;
width: 1024px;
margin: auto;
}
 
a {
text-decoration: none;
color: white;
}
 
li {
list-style: none;
}
 
a:hover {
text-decoration: underline;
color: white;
}
 
#banner {
background: url(images/banner.png) no-repeat;
width:882px;
height: 146px;
margin-left: 72px;
}
 
#nav {
background: url(images/nav.png) no-repeat;
width: 882px;
height: 48px;
overflow: hidden;
margin-left: 72px;
}
 
#nav ul {
padding-left: 245px;
}
 
#nav li {
float: left;
line-height: 48px;
}
 
#nav li a {
padding: 0 1em;
}
 
#nav li a.first {
padding: 0;
}
<----------This is in question---------->
#content {
background: url(images/content.png) ;
width: 882px;
color: white;
margin-left: 72px;
}
<----------End Question---------->
#main {
text-align: center;
padding-left: 72px;
padding-right: 72px;
width: 739px;
}
 
#main h1 {
padding-top: 20px;
padding-right: 15px;
padding-left: 0px;
}
 
#main p {
padding-top: 15px;
}
 
#footer_spacer {
background: url(images/footer_spacer.png) no repeate;
width: 882px;
height: 11px;
}
 
#footer {
background: url(images/footer.png) no-repeat;
width: 882px;
height: 54px;
line_height: 54px;
margin-left: 72px;
}

Top
Tags: