Maintain aspect ratio of fluid images?

[imsky]

Maintain aspect ratio of fluid images?

[davcpas1234]

For anyone having this issue more recently, this is now implemented like so: <img data-src="holder.js/100px100?auto">.

[imsky]

Have you tried percentage widths for both dimensions? Something like <div style="width:500px;height:200px"><img data-src="holder.js/100%x100%"></div>

[Fatbat]

Too many unnecessary divs that way for my liking. Normally a responsive image only needs to be declared with:

max-width: 100%;
height: auto;

To fill the width of it's parent container automatically, assuming the image is wide enough, while the height works itself out. I'd rather not have to wrap each image in an extra div to accomplish the same thing.

[imsky]

This is now implemented, using the auto flag on a fluid image, like so: <img data-src="holder.js/100%x100/auto">

[Fatbat]

Edit: sorry, misread the post. Downloaded the new version and it's great, thank you very much!

[imsky]

Have you downloaded the latest file?

On Oct 22, 2013, at 4:43 PM, Brad Shaw [email protected] wrote:

I tried that, but it doesn't work. Height stays at whatever you set it to. In your example above the height stays pegged at 100px while the width adapts to the container width.

—
Reply to this email directly or view it on GitHub.

[Fatbat]

Yep, got it and it's working great. Thank you very much!