Log in

View Full Version : Problem positioning tiling background image



springtime
09-18-2008, 03:53 AM
I am fairly new to CSS and trying to break out of my old table habits for positioning. This may be a simple problem with a simple solution. I think it may involve floats, or absolute positioning, or something like that, but I'm looking for something that will do the trick.

Here's the page in question (http://www.newton-designs.com/new/test.htm).

I want the background tiling image to match up with the stripe in the banner. Right now on my PC, it is looking ok in IE, but FF and Safari are "off" a bit. The stripe in the tiling background image is a tad low relative to the stripe in the main image (banner). I think it has to do with how the banner image is positioned by default in each of the browsers.

Help? Anyone? Any input is much appreciated. THANKS!

jscheuer1
09-18-2008, 06:14 AM
The problem has to do with the default margins for the body element which vary in various browsers. Try adding these styles:


body {
background-color: #4F1E0C;
background-image: url(images/background_squares.gif);
background-repeat: repeat-x;
background-position:top;
margin: 15px 10px;
padding: 0;
}

SpOrTsDuDe-Reese
09-18-2008, 09:16 AM
Or he can do * { margin:0; padding:0;}

But you might have to mess with the margins and paddings throughout the page.

springtime
09-18-2008, 01:49 PM
Thank you both. I tried both solutions and they both actually were great ;) Much appreciated.