[z_coil]

Hello all,

I am in need of some CSS help. I have a page I am building that uses a small background pattern (1600x20px) that simply repeats over and over, that works perfectly. The pattern has a dark gradient on the left and right sides and has a grey in the middle. The grey is where my content will go. Now, I am trying to position elements onto that content area, but I cannot figure it out. The research I have done says I should use relative positioning, but I don't know how to get one object to position relative to that grey content area. Any words of advice?

Kevin

[herkalees]

The one element that you've set the repeating background on... is it a fixed width? (I'm assuming it is). If so, simply add some padding, like this:

Before:
#elementName {
width: 800px;
background: url(path/to/repeatingImage.jpg) repeat-y left top;
}

After:
#elementName {
width: 750px;
padding-right: 25px;
padding-left: 25px;
background: url(path/to/repeatingImage.jpg) repeat-y left top;
}

Just remember that the padding values, plus the width value, need to add-up to the original width. In my fake example, 750px + 25px + 25px = 800px.