I'm currently working on setting up a container with a background image that repeats only when the contained div elements are long enough. However, I seem to be encountering issues getting the image to repeat properly within the #container code.
This is the current HTML structure:
<body>
<div id=container>
<div id=textblock>
<div id=maintext>
<p>text here</p>
</div>
</div>
</div>
</body>
Below is the CSS being used:
body {
background-color: #888;
background-position: top;
height:100%;
margin:0;
padding:0;
}
#container {
background-position: relative;
width: 960px;
min-height: 720px;
margin-left: auto;
margin-right: auto;
font-family: Antelope H;
font-size: 1.5em;
color: #c60;
background:url(images/containerback-01.png) repeat-y;
background-color: #fc6;
}
If you'd like to view the site as it currently stands, click here.