fluid-images

This one goes out to the CSS pros: I wonder if it's possible to achieve a image scaling behavior like on this site using pure CSS? Be aware that the images only start scaling if the height of the browser window changes, not its width. (Just saying because all info on the web I found is about the alteration of the width.) The real sticking point seems to be the different threshold values: Landscape-shaped images just start scaling down if they have the same height as the already downscaled portrait-shaped images. Any feedback on that matter is highly appreciated! You can do it with a

How do I get an image to stay centered when its fluid width (percentage based) container is too small to show the whole image? How can I center the image inside it's container This means it should show the middle of the image instead of the sides when container is too small. When It Works You might have a container that holds some content such as two <div> s that are 50% wide each, sitting next to each other. For this example, we can illustrate just one child of the container: We'll name outer rectangle .container , the inner rectangle .content and the image img . This arrangement is perfectly