Question

I am building a custom app for the iPad and can use webkit specific code. I’m having difficulty with dynamic resizing images to fit within a specific div container. Is there code to do this? Also is the code to recrop an image with a mask if the image is portrait or landscape?

Answer 1

The easiest way to automatically resize an image with simple CSS:

img {
     max-width: 100%;
}

No CSS3 or HTML 5 magic required. Here’s a blog post with more information, and some JavaScript that improves scaling in IE: http://unstoppablerobotninja.com/entry/fluid-images/