Hi,
I'm having some background pattern issues - I wrote a write-up at http://grid9.quadspeedi.net/~plugged/css/.
Hopefully someone will help me out,
Thanks!
| SitePoint Sponsor |

Hi,
I'm having some background pattern issues - I wrote a write-up at http://grid9.quadspeedi.net/~plugged/css/.
Hopefully someone will help me out,
Thanks!


Hi,
Sounds straight forward enough
Just make a background image that is 1050 px wide and repeat it down the body using center top (or center center).
There will be a 848px gap in the middle of your image and the gradient at each sides. Just make sure that some of the gradient goes under the page content because of ie's 1 pixel rounding bug. Dont try and make the background meet the edge of the content exactly.
That will repeat the background down the whole page so you can just rub out the top and bottom of the page with some white borders or background colour in an empty element.
Paul


Something like this.
Code:body { margin: 0; padding: 0; text-align: center; background-image: url(file:///C|/Documents%20and%20Setting...es/pattern.png); background-repeat: repeat-y; background-position: center center; } .border {height:8px;overflow:hidden;background:#fff} #wrapper {PaulCode:<body> <div class="border"></div> <div id="wrapper"> etc............................... </div> <div class="border"></div> </body>

Thanks! It works perfectly, but I didn't add the border divs, because I wasn't sure what those were for. Were those just to add margins to the body?


Yes just some body margins![]()
Bookmarks