I updated my WordPress installation the other day, and also the Atahualpa theme. The updates installed without a hitch, but the updated theme breaks some of my posts. Specifically, those that have images.

For example, my Bears! post has two images. The size of the first one is set to 780 by 429 pixels, and that’s the size it displays if your browser window is wide enough. If you narrow the browser window, the image is automatically scaled to fit. In Chrome, the scaling appears to be correct.

The results with Internet Explorer 8 aren’t anywhere near as pretty. IE narrowed the image, but for reasons unknown to me decided to maintain the original height. Nice. It’s like a circus fun house mirror.

I spent a little time with the browser’s developer tools (debugger) trying to trace the styles. Somewhere in the stylesheet there’s something that tells the browser to scale the box. It looks like Chrome is scaling in both directions to maintain the aspect ratio, but IE is only scaling the width. I don’t know enough about CSS or this particular stylesheet to say who’s interpreting the CSS incorrectly.

Fixing the error should be fun. My experience with CSS and WordPress themes is that trying to edit somebody else’s theme is like trying to modify an APL program. “Good luck.”