"height: auto" bug in Chrome

[CeeDesign]

I have a row of images (yes, of pigs), which works well in Firefox,
but Chrome stretches the images vertically.
I’m using PureCSS (purecss.io) for the grid.

Check out the images:
http://imgur.com/yUZUGrq
http://imgur.com/YrzWicc

And the live site:
http://cdesign.fi/FoxCenter/yrityskeskus/kuvia/

How do I make it work?

[Jonathon Harrelson]

You should use height:100%;, that will fix it and it will render properly across all browsers.

[randomdude]

Is something like

img {
  object-position: center center;
  object-fit: cover;
}

What you want?

[Jonathon Harrelson]

They’re not background images, they’re embedded images, so

img{
     height:100%;
}

should work

[randomdude]

@jharrelson Those properties are specifically for images, not background images.
I’d need to see the code to know how to fix the problem, though. I’m just guessing right now.

[leighm]

@randomdude Thanks, this sorted a problem I was having with Chrome shrinking images.

[Author]

Posts