W3C home > Mailing lists > Public > public-respimg@w3.org > December 2015

Re: Fluid Image properties

From: Daniel Abril <daniel.abril@gmail.com>
Date: Fri, 11 Dec 2015 16:34:36 +0100
Message-ID: <CAO4OTTfSqpkWXYXtncVghnfec6HVSbT9OR+pL8tC08F0EPQJyg@mail.gmail.com>
To: Simon Bächler <b@chler.com>
Cc: "public-respimg@w3.org" <public-respimg@w3.org>, Michael Scharnagl <mich.scharnagl@googlemail.com>
yeah, is true, object-fit:cover does exactly what you say. Lets all pray
for IE to give support to this feature in short, is quite useful for

*Daniel Abril*
UI/UX Designer & Semantics Lover

On Thu, Dec 10, 2015 at 11:37 PM, Simon Bächler <b@chler.com> wrote:

> Hi Michael
> Actually object-fit and object-position would do exactly that. I didn’t
> know those. They are already supported by Chrome and Firefox. (object-fit
> is supported by Safari, too). Thank you for pointing this out.
> @Daniel
> I was not just referring to ad banners but more general an image which is
> much wider than tall. Walmart labs uses this technique for their hero
> images and they have a great talk about it here
> <https://youtu.be/CJ07hLitIfU?t=12m51s>. But it’s true, the fluidity is
> pure styling sugar and doesn’t add to the content.
> Modern Javascript module bundlers such as Webpack
> <https://github.com/webpack/webpack> or jspm <http://jspm.io/> make it
> easily possible to bundle rarely used javascript and css into different
> files and have them loaded on demand, e.g. if an element with a certain id
> is present in the DOM.
> Regards
> Simon
> Am 10. Dezember 2015 bei 18:32:12, Michael Scharnagl (
> mich.scharnagl@googlemail.com) schrieb:
> Hi Simon,
> not sure if I understand you correctly, but do you want something along
> this: http://jsbin.com/kodevoqiqa/edit?html,css,output  With object-fit
> <https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit> you can
> kinda do it already but I guess you want more precise ways to define how
> the image should be fitted in a box?
> Best,
> Michael
Received on Friday, 11 December 2015 15:35:06 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 17:06:18 UTC