Need help with background and content aligning.

min-width aligning issue in firefox and opera.

[ThisWake]

Hi all,

I've run into a problem that's frustrated me for hours.

I've set up all my content into a 900px fixed-width area.
The background for the page is 1012px wide and set to "align:center top;" and "background-attachment: scroll;". "min-width" is set to 1012.

The problem is, in Firefox and Opera, when the window is re-sized below 900px width the left side of the background is cropped. Meaning that when i scroll to see the content on the right, the background has shifted so the content overlaps it.

The only explanation i can think of is that in Firefox and Opera the background is aligning center to the window. Whereas in IE it is aligning center to "min-width".

Is there any way to 'force' Firefox and Opera into aligning central to the min-width field? Or even to set the background to align left when the window size drops below a certain width?

I'm still relatively new to web design so any help would be greatly apprieciated.

[swa66]

Without code its hard to guess, but the 900px width is probably still there and you're using overflow ?

I guess the main issue is how do you fit 1012px min-width into something that's only 900px wide. IE typically chooses other solutions to dilemmas then all other browsers, best tip: don't look at IE while designing, it'll make your a lot life easier if you postpone it till the very last.

Perhaps post a bit of relevant, sanitized code that shows the problem you have.