Working on first responsive website template; layout is part fluid, with fixed sidebars, using media queries. I want to have some of my images be scalable. Per this article http://www.blissfulinterfaces.com/making-wordpress-images-responsive/ it should be very simple, at least for manually loaded images. Add this to stylesheet:

img{max-width: 100%;}
img{ -ms-interpolation-mode: bicubic; }

and manually remove width and heights that wp automatically adds. Have done both and not a thing happens.

See images in the main areas (not sidebars) on these 2 pages: and

I haven't added code to functions for thumbnails yet -- wanted to get the basics working first.

What am I missing?


  • That's a pure CSS question, isn't it? – fuxia Apr 28 '12 at 22:16

Nothing appears to happen because the size of the images is smaller than the available width. If I add a bunch of padding to the container in Chrome and then resize the window, the image scales once all horizontal width is consumed.

Not the answer you're looking for? Browse other questions tagged or ask your own question.