PDA

View Full Version : Aligning Template on Background


SuperiorShine
06-10-2008, 06:45 AM
Hi,

I am having dramas with a template and it lining up with the Backgroung Image.

The template has the same background image as the page background but its like a mesh effect so its a real pain in the butt to line up. And its not working because different screen resolutions and browser widths move the template on the page background.
See here: http://www.superiorshine.com.au/new
If you load the page and the make your browser width smaller you will see the template move along the background image this is why it never lines up cause its floating all over it.
Is there anyway i can stop this?
I have spent a total of 7 hours fiddling with the background and i still cant get it to work.
My last resort is to go into the .PSD and make the website width and height bigger then peoples resolution and save for web and make the bits outside the template (background image) a picture in a cell so the page doesnt see images and expands the scroll bars.

Here is the template overlapping: www.superiorshine.com.au/sample/overlap.jpg

Any other idea's as this is really getting to me LOL..

Cheers

demtron
06-10-2008, 05:53 PM
If you weren't concerned about centering the page content, then you could put an absolute margin on the body to try lining the BG up with the template. Not sure how cross-browser friendly that would be. I can barely notice the problem and I didn't see it at all on first glance of the site. IMHO, if I were in your shoes, I wouldn't sweat it too much.

Good luck!

SuperiorShine
06-11-2008, 05:01 AM
Thanks,
I ended up using CSS to center the template, and i also cut the template in Photoshop so it didnt have a border of the background image it is now cut to the edge of the table: www.superiorshine.com.au/fixed

coothead
06-11-2008, 07:31 AM
Hi there SuperiorShine,

your page is no longer centered and now gets a horizontal scrollbar when the width is less than 1080px.
A modern solution - (non ImageReady :D) - to your problem can be found here...
http://www.htmlforums.com/showpost.php?p=651837&postcount=3
coothead