Re: Dynamic Full Width Background Images

[seansean11]

Thanks @Paulie_D, I think I figured out the absolute positioning problem though. The img was absolutely positioning relative to the HTML element, because none of its containing elements were set to position: relative. Once I set the body element to relative, the overflow: hidden that was applied to the body element worked. This might not be the best solution though, because you might need horizontal scrolling at certain points (can’t think of a good example…maybe less relevant with responsive). It would probably be better to set a 100% width div.hero (or whatever you want to call it) as a parent element, that has the properties position: relative and overflow: hidden.

I’m still curious about how people go about doing this now a days, and which method they use? Inline CSS bg-image or an inline image with this absolute positioning solution? Maybe I’ll make a blog post about it once I get more info.