> 1) Is the way I am achieving the effect completely bonkers? Am I
> overlooking a much simpler way?
That is exactly the way to do what you are trying to do except that I would fix
the image position like this:
#outer-wrap{background: #fff url(../Bokeh.jpg) no-repeat fixed 50% top; }
The altermnative to fixed is scroll but this is not necessary in your case as
you are not repeating the image (x nor y)
>
> 2) Is there a better way to achieve what is happening?
Not that I know of except the other respondents made it very scientific and
therefore very complicated IMO.
>
> 3) Providing i'm not doing something completely insane, is it possible
> to get IE7 and 8 to play nicer (have the bg image not continue behind
> the content as the viewport decreases below 900px wide)? With a
> different method?
>
To make it liquid, use percentages instead of px. Try a width of 90% for
outer-wrap and remove the width for other divs.
You also need to make sure it validates because you don't have an opening
<head> and also an opening <body>. Always use the validation service just to
iron out basic mistakes and unbalanced html/css tags.
My 2 pence worth.
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
