W3C home > Mailing lists > Public > www-style@w3.org > January 2011

Re: [css3-images] Reintroduce object-fit: none

From: Philip Jägenstedt <philipj@opera.com>
Date: Wed, 26 Jan 2011 16:46:09 +0100
To: www-style@w3.org, "Leif Arne Storset" <lstorset@opera.com>
Cc: "Simon Pieters (zcorpan)" <simonp@opera.com>
Message-ID: <op.vpw927hmsr6mfa@kirk>
On Wed, 26 Jan 2011 11:50:31 +0100, Leif Arne Storset <lstorset@opera.com>  

> I was asked recently whether and why 'object-fit: none' was removed from
> the spec. Digging in the archives, it seems the proposal to keep/revive  
> it
> was forgotten amid other issues. So this is a request to re-introduce
> 'none' as a value for 'object-fit'. The definition would be "Render the
> content at its intrinsic dimensions, overflowing if necessary."
> The use case is easy centering or positioning images without scaling  
> them.
> Centering images vertically in a box can be a PITA today, especially if
> you don't know the dimensions. With image-fit:none, it is super-easy.  
> Have
> a look at the attached demo (only supported in Opera 11, AFAIK).
> (To avoid any confusion: There were objections to our proposal of another
> value, 'object-fit: auto', because the proposal was that behavior depend
> on content type. These issues do not affect the current proposal of
> 'object-fit: none', since no content-type negotation takes place for
> 'object-fit: none'.)

In addition to this, I would also like to propose another state that is a  
mix of none and contain:

* if the image fits in the content box, behave like "contain"

* if the image does not fit in the content box, behave like "none"

In short, it is "scale down only". The use case for this is for an image  
viewer where one wants to use the "best" fit, not either scale up small  
images or have large images overflow, which is the choices one has with  
just "contain" and "none".

The exact syntax isn't very important. Either it is just a new value, as  

object-fit: scale-down; /* with another name, probably */

... or one makes object-fit and object-position take two comma-separated  
values, where the first one applies to "too small" images and the second  
applies to "too large" images, as such ...

object-fit: none, contain;

Philip Jägenstedt
Core Developer
Opera Software
Received on Wednesday, 26 January 2011 15:46:44 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:07:55 UTC