Here’s a little piece I’ve written discussing a technique for including wide images inside fluid CSS layouts.
At the heart of the issue is the effect of images that become too wide to fit inside their containing element when the user’s browser window is sized too small.
The trick is to simply apply the image as a background image to a
DIV element. The
DIV will take up whatever width is available and the background image will be cropped to fit whatever space is available.
I kind of lost my energy towards the end of writing this. I’m by no means a professional writer (surely by now you’ve found more than a few grammatical and spelling errors in the things I’ve written) and I never proof-read enough. I’m more stream-of-consciousness when I write and that leads to some crazy mistakes. But I also like that approach. Sometimes I’ll talk myself into a solution or new idea while typing up these write-ups on CSS-related topics. So it’s great for me because it’s not just writing, it’s something of an exploration. But you guys just get stuck with my crappy writing, spelling and grammar. Those of you who do not have English as your primary language must have an especially difficult time.
Oh well. No worries.