This is an archived snapshot of W3C's public bugzilla bug tracker, decommissioned in April 2019. Please see the home page for more details.

Bug 12017 - Keeping IMG aspect ratio
Summary: Keeping IMG aspect ratio
Status: RESOLVED WORKSFORME
Alias: None
Product: HTML WG
Classification: Unclassified
Component: HTML5 spec (show other bugs)
Version: unspecified
Hardware: All All
: P2 normal
Target Milestone: ---
Assignee: This bug has no owner yet - up for the taking
QA Contact: HTML WG Bugzilla archive list
URL:
Whiteboard:
Keywords:
Depends on:
Blocks:
 
Reported: 2011-02-09 10:31 UTC by sroucheray
Modified: 2013-02-01 00:39 UTC (History)
8 users (show)

See Also:


Attachments

Description sroucheray 2011-02-09 10:31:16 UTC
What if an image need to fill a certain amount of space, i.e. a div container is of a particular size and the inner image should fill the maximum space (or a percentage) of the container without altering its aspect ratio.

I suggest adding a "keepAspectRatio" or "preserveAspectRatio" attribute on img tag.

When this attribute has "true" as a value, whatever width or height are set (either by setting width or height attributes or by setting them via CSS) the image will fill the maximum space it can inside this width and height preserving its aspect ratio.
Comment 1 Ian 'Hixie' Hickson 2011-02-28 22:42:17 UTC
This seems like something that CSS should be able to do already.
Comment 2 Karl Dubost 2011-02-28 23:22:01 UTC
It is something already done by CSS. It is defined in [CSS Image Values and Replaced Content Module Level 3][1] and a [tutorial][2] for it.

[1]: http://dev.w3.org/csswg/css3-images/
[2]: http://dev.opera.com/articles/view/css3-object-fit-object-position/
Comment 3 Robin Berjon 2013-01-21 15:57:55 UTC
Mass move to "HTML WG"
Comment 4 Robin Berjon 2013-01-21 16:00:40 UTC
Mass move to "HTML WG"
Comment 5 Travis Leithead [MSFT] 2013-02-01 00:39:41 UTC
EDITOR'S RESPONSE: This is an Editor's Response to your comment. If you are
satisfied with this response, please change the state of this bug to CLOSED. If
you have additional information and would like the Editor to reconsider, please
reopen this bug. If you would like to escalate the issue to the full HTML
Working Group, please add the TrackerRequest keyword to this bug, and suggest
title and text for the Tracker Issue; or you may create a Tracker Issue
yourself, if you are able to do so. For more details, see this document:


   http://dev.w3.org/html5/decision-policy/decision-policy.html

Status: Rejected
Change Description: No spec change
Rationale: As noted, CSS provides the requested functionality.