Attachment 116873 Details for Bug 73277 – Patch

[patch] Patch

bug-73277-20111128224638.patch (text/plain), 46.60 KB, created by Fady Samuel on 2011-11-28 19:46:40 PST

(hide)

Description:

Filename:

MIME Type:

Creator: Fady Samuel

Created: 2011-11-28 19:46:40 PST

Size: 46.60 KB

patch

obsolete

>Subversion Revision: 101316
>diff --git a/Source/WebCore/ChangeLog b/Source/WebCore/ChangeLog
>index 38e7f90bed5221c4d91129263123136bbbe42327..638c7b1bc944c30b54b33450e473798122f0ad76 100755
>--- a/Source/WebCore/ChangeLog
>+++ b/Source/WebCore/ChangeLog
>@@ -1,3 +1,59 @@
>+2011-11-28  Fady Samuel  <fsamuel@chromium.org>
>+
>+        -webkit-aspect-ratio Layout Implementation
>+        https://bugs.webkit.org/show_bug.cgi?id=73277
>+
>+        Reviewed by NOBODY (OOPS!).
>+
>+        Implement -webkit-aspect-ratio
>+
>+        Aspect ratio computations happen on the LogicalWidth/LogicalHeight phase of the
>+        dimension calculations. max/min remain largely unaffected. 
>+
>+        computeLogical* and computePositionedLogical* have been updated to recognize what
>+        phase the width/height calculation is in, so that it can process aspect ratio only at the
>+        appropriate phase.
>+        
>+        More tests and lots of tweaking is coming. This is being uploaded for early review.
>+
>+        Tests: css3/aspect-ratio/absolute-ratio-absolute-left-right.html
>+               css3/aspect-ratio/aspect-ratio-absolute-height.html
>+               css3/aspect-ratio/aspect-ratio-absolute-width.html
>+               css3/aspect-ratio/aspect-ratio-auto-height.html
>+               css3/aspect-ratio/aspect-ratio-float.html
>+               css3/aspect-ratio/aspect-ratio-inherit.html
>+               css3/aspect-ratio/aspect-ratio-stretch-to-fill.html
>+
>+        * rendering/RenderBlock.cpp:
>+        (WebCore::RenderBlock::layoutBlock):
>+        Aspect rati computation happens in three stages.
>+        1. Compute width to be as large as possible
>+        2. Compute height to preserve aspect ratio while respecting max-height/min-height
>+        3. Recompute width if aspect-ratio is not preserved.
>+        (WebCore::RenderBlock::layoutBlockChildren):
>+        * rendering/RenderBox.cpp:
>+        (WebCore::RenderBox::isWidthDeterminedUsing):
>+        (WebCore::RenderBox::isWidthDetermined):
>+        Determines whether width is fully specified or not
>+        (WebCore::RenderBox::isHeightDeterminedUsing):
>+        (WebCore::RenderBox::isHeightDetermined):
>+        Determines whether width is fully specified or not
>+        (WebCore::RenderBox::hasMinOrMaxConstraints):
>+        (WebCore::RenderBox::useAspectRatioForWidth):
>+        (WebCore::RenderBox::useAspectRatioForHeight):
>+        (WebCore::RenderBox::computeLogicalWidthInRegion):
>+        (WebCore::RenderBox::computeLogicalWidthUsing):
>+        (WebCore::RenderBox::computeLogicalHeight):
>+        (WebCore::RenderBox::computeLogicalHeightUsing):
>+        (WebCore::RenderBox::computePositionedLogicalWidth):
>+        (WebCore::RenderBox::computePositionedLogicalWidthUsing):
>+        (WebCore::RenderBox::computePositionedLogicalHeight):
>+        (WebCore::RenderBox::computePositionedLogicalHeightUsing):
>+        * rendering/RenderBox.h:
>+        * rendering/style/RenderStyle.cpp:
>+        (WebCore::RenderStyle::diff):
>+
>+        Relayout if aspect-ratio has changed.
> 2011-11-28  Timothy Hatcher  <timothy@apple.com>
> 
>         Add support for knowing when a TreeElement is added or changed anywhere in a TreeOutline.
>diff --git a/Source/WebCore/rendering/RenderBlock.cpp b/Source/WebCore/rendering/RenderBlock.cpp
>index e213aa73e82f76401285771fb3c4af9a1a7724e1..4004d079c0c9c71f708eb0b3399d723c06bfae63 100755
>--- a/Source/WebCore/rendering/RenderBlock.cpp
>+++ b/Source/WebCore/rendering/RenderBlock.cpp
>@@ -1203,6 +1203,9 @@ void RenderBlock::layoutBlock(bool relayoutChildren, LayoutUnit pageLogicalHeigh
> 
>     LayoutUnit oldWidth = logicalWidth();
>     LayoutUnit oldColumnWidth = desiredColumnWidth();
>+  
>+    LayoutUnit previousHeight = logicalHeight();
>+    setLogicalHeight(0);
> 
>     computeLogicalWidth();
>     calcColumnWidth();
>@@ -1219,8 +1222,6 @@ void RenderBlock::layoutBlock(bool relayoutChildren, LayoutUnit pageLogicalHeigh
>         floatsLayoutPass = PositionedFloatLayoutPass;
>     clearFloats(floatsLayoutPass);
> 
>-    LayoutUnit previousHeight = logicalHeight();
>-    setLogicalHeight(0);
>     bool hasSpecifiedPageLogicalHeight = false;
>     bool pageLogicalHeightChanged = false;
>     ColumnInfo* colInfo = columnInfo();
>@@ -1322,6 +1323,8 @@ void RenderBlock::layoutBlock(bool relayoutChildren, LayoutUnit pageLogicalHeigh
>     LayoutUnit oldClientAfterEdge = clientLogicalBottom();
>     computeLogicalHeight();
>     LayoutUnit newHeight = logicalHeight();
>+      
>+
>     if (oldHeight != newHeight) {
>         if (oldHeight > newHeight && maxFloatLogicalBottom > newHeight && !childrenInline()) {
>             // One of our children's floats may have become an overhanging float for us. We need to look for it.
>@@ -1338,6 +1341,13 @@ void RenderBlock::layoutBlock(bool relayoutChildren, LayoutUnit pageLogicalHeigh
>     if (previousHeight != newHeight)
>         relayoutChildren = true;
> 
>+    // FIXME: Only recompute logical width if aspect ratio is not satisfied
>+    oldWidth = logicalWidth();
>+    if (style()->hasAspectRatio())
>+        computeLogicalWidth();
>+    if (oldWidth != logicalWidth())
>+        relayoutChildren = true;
>+
>     bool needAnotherLayoutPass = layoutPositionedObjects(relayoutChildren || isRoot());
> 
>     if (inRenderFlowThread())
>@@ -1969,7 +1979,6 @@ void RenderBlock::layoutBlockChildren(bool relayoutChildren, LayoutUnit& maxFloa
>             }
>         }
>     }
>-
>     LayoutUnit beforeEdge = borderBefore() + paddingBefore();
>     LayoutUnit afterEdge = borderAfter() + paddingAfter() + scrollbarLogicalHeight();
> 
>@@ -1998,7 +2007,7 @@ void RenderBlock::layoutBlockChildren(bool relayoutChildren, LayoutUnit& maxFloa
>         // Make sure we layout children if they need it.
>         // FIXME: Technically percentage height objects only need a relayout if their percentage isn't going to be turned into
>         // an auto value.  Add a method to determine this, so that we can avoid the relayout.
>-        if (relayoutChildren || ((child->style()->logicalHeight().isPercent() || child->style()->logicalMinHeight().isPercent() || child->style()->logicalMaxHeight().isPercent()) && !isRenderView()))
>+        if (relayoutChildren || ((child->style()->hasAspectRatio() || child->style()->logicalHeight().isPercent() || child->style()->logicalMinHeight().isPercent() || child->style()->logicalMaxHeight().isPercent()) && !isRenderView()))
>             child->setChildNeedsLayout(true, false);
> 
>         // If relayoutChildren is set and the child has percentage padding or an embedded content box, we also need to invalidate the childs pref widths.
>diff --git a/Source/WebCore/rendering/RenderBox.cpp b/Source/WebCore/rendering/RenderBox.cpp
>index 531acbc15a7228f5efa7a96abd5aa2268fc0cda7..7ecc665b5b6f4c253de7b62c979820a7b3043ab7 100644
>--- a/Source/WebCore/rendering/RenderBox.cpp
>+++ b/Source/WebCore/rendering/RenderBox.cpp
>@@ -1658,6 +1658,53 @@ void RenderBox::repaintDuringLayoutIfMoved(const LayoutRect& rect)
>     }
> }
> 
>+bool RenderBox::isWidthDeterminedUsing(const Length& logicalWidth, const Length& logicalLeft, const Length& logicalRight) const
>+{
>+    bool widthIsAuto = logicalWidth.isAuto();
>+    bool logicalMinWidthIsSpecified = !style()->logicalMinWidth().isAuto() && style()->logicalMinWidth().isPositive();
>+    bool leftIsAuto = logicalLeft.isAuto();
>+    bool rightIsAuto = logicalRight.isAuto();
>+    bool hasAspectRatio = style()->hasAspectRatio();
>+    // Width is determined if the width is specified or left and right are specified on a positioned box.
>+    return !widthIsAuto || logicalMinWidthIsSpecified || (!leftIsAuto && widthIsAuto && !rightIsAuto && !hasAspectRatio && isPositioned());
>+}
>+
>+bool RenderBox::isWidthDetermined() const
>+{
>+    return isWidthDeterminedUsing(style()->logicalWidth(), style()->logicalLeft(), style()->logicalRight());
>+}
>+
>+bool RenderBox::isHeightDeterminedUsing(const Length& logicalHeight, const Length& logicalTop, const Length& logicalBottom) const
>+{
>+    bool heightIsAuto = logicalHeight.isAuto();
>+    bool logicalMinHeightIsSpecified = !style()->logicalMinHeight().isAuto() && style()->logicalMinHeight().isPositive();
>+    bool topIsAuto = logicalTop.isAuto();
>+    bool bottomIsAuto = logicalBottom.isAuto();
>+    bool hasAspectRatio = style()->hasAspectRatio();
>+    // Height is determined if height is specificed or top and bottom are specified on a positioned box.
>+    return !heightIsAuto || logicalMinHeightIsSpecified || (!topIsAuto && heightIsAuto && !bottomIsAuto && !hasAspectRatio && isPositioned());
>+}
>+
>+bool RenderBox::isHeightDetermined() const
>+{
>+    return isHeightDeterminedUsing(style()->logicalHeight(), style()->logicalTop(), style()->logicalBottom());
>+}
>+
>+bool RenderBox::hasMinOrMaxConstraints() const
>+{
>+    return !style()->maxHeight().isUndefined() || !style()->minHeight().isZero();
>+}
>+
>+bool RenderBox::useAspectRatioForWidth(const Length& logicalWidth, const Length& logicalLeft, const Length& logicalRight) const
>+{
>+    return !isWidthDeterminedUsing(logicalWidth, logicalLeft, logicalRight) && style()->hasAspectRatio();
>+}
>+
>+bool RenderBox::useAspectRatioForHeight(const Length& logicalHeight, const Length& logicalTop, const Length& logicalBottom) const
>+{
>+    return !isHeightDeterminedUsing(logicalHeight, logicalTop, logicalBottom) && style()->hasAspectRatio();
>+}
>+
> void RenderBox::computeLogicalWidth()
> {
>     computeLogicalWidthInRegion();
>@@ -1740,7 +1787,7 @@ void RenderBox::computeLogicalWidthInRegion(RenderRegion* region, LayoutUnit off
>     }
> 
>     // Margin calculations.
>-    if (logicalWidthLength.isAuto() || hasPerpendicularContainingBlock) {
>+    if ((logicalWidthLength.isAuto() && !style()->hasAspectRatio()) || hasPerpendicularContainingBlock) {
>         setMarginStart(style()->marginStart().calcMinValue(containerLogicalWidth));
>         setMarginEnd(style()->marginEnd().calcMinValue(containerLogicalWidth));
>     } else
>@@ -1754,18 +1801,37 @@ void RenderBox::computeLogicalWidthInRegion(RenderRegion* region, LayoutUnit off
> LayoutUnit RenderBox::computeLogicalWidthUsing(LogicalWidthType widthType, LayoutUnit availableLogicalWidth)
> {
>     LayoutUnit logicalWidthResult = logicalWidth();
>+    const LayoutUnit bordersPlusPadding = borderAndPaddingLogicalWidth();
>     Length logicalWidth;
>-    if (widthType == LogicalWidth)
>+    switch (widthType) {
>+    case LogicalWidth:
>         logicalWidth = style()->logicalWidth();
>-    else if (widthType == MinLogicalWidth)
>+        break;
>+    case MinLogicalWidth:
>         logicalWidth = style()->logicalMinWidth();
>-    else
>+        break;
>+    case MaxLogicalWidth:
>         logicalWidth = style()->logicalMaxWidth();
>+        break;
>+    case MinPreferredLogicalWidth:
>+        ASSERT_NOT_REACHED();
>+        logicalWidth =  Length(minPreferredLogicalWidth() - bordersPlusPadding, Fixed);
>+        break;
>+    }
> 
>     if (logicalWidth.isIntrinsicOrAuto()) {
>         LayoutUnit marginStart = style()->marginStart().calcMinValue(availableLogicalWidth);
>         LayoutUnit marginEnd = style()->marginEnd().calcMinValue(availableLogicalWidth);
>         logicalWidthResult = availableLogicalWidth - marginStart - marginEnd;
>+        bool useAspectRatio = style()->hasAspectRatio();
>+        if (useAspectRatio) {
>+            float requiredRatio = style()->aspectRatio();
>+            if (logicalHeight()) {
>+                int widthForAspectRatio = static_cast<int>(logicalHeight() * requiredRatio);
>+                if (widthType == LogicalWidth)
>+                    logicalWidthResult = min(widthForAspectRatio, logicalWidthResult);
>+            } 
>+        }
> 
>         if (sizesToIntrinsicLogicalWidth(widthType)) {
>             logicalWidthResult = max(logicalWidthResult, minPreferredLogicalWidth());
>@@ -2009,12 +2075,12 @@ void RenderBox::computeLogicalHeight()
> 
>         LayoutUnit heightResult;
>         if (checkMinMaxHeight) {
>-            heightResult = computeLogicalHeightUsing(style()->logicalHeight());
>+            heightResult = computeLogicalHeightUsing(LogicalHeight);
>             // FIXME: Use < 0 or roughlyEquals when we move to float, see https://bugs.webkit.org/show_bug.cgi?id=66148
>             if (heightResult == -1)
>                 heightResult = logicalHeight();
>-            LayoutUnit minH = computeLogicalHeightUsing(style()->logicalMinHeight()); // Leave as -1 if unset.
>-            LayoutUnit maxH = style()->logicalMaxHeight().isUndefined() ? heightResult : computeLogicalHeightUsing(style()->logicalMaxHeight());
>+            LayoutUnit minH = computeLogicalHeightUsing(MinLogicalHeight); // Leave as -1 if unset.
>+            LayoutUnit maxH = style()->logicalMaxHeight().isUndefined() ? heightResult : computeLogicalHeightUsing(MaxLogicalHeight);
>             if (maxH == -1)
>                 maxH = heightResult;
>             heightResult = min(maxH, heightResult);
>@@ -2061,21 +2127,40 @@ void RenderBox::computeLogicalHeight()
>     }
> }
> 
>-LayoutUnit RenderBox::computeLogicalHeightUsing(const Length& h)
>+LayoutUnit RenderBox::computeLogicalHeightUsing(LogicalHeightType heightType)
> {
>-    LayoutUnit logicalHeight = -1;
>+    Length h;
>+    switch (heightType) {
>+    case LogicalHeight:
>+        h = style()->logicalHeight();
>+        break;
>+    case MinLogicalHeight:
>+        h = style()->logicalMinHeight();
>+        break;
>+    case MaxLogicalHeight:
>+        h = style()->logicalMaxHeight();
>+        break;
>+    }
>+
>+    LayoutUnit logicalHeightValue = -1;
>     if (!h.isAuto()) {
>         if (h.isFixed())
>-            logicalHeight = h.value();
>+            logicalHeightValue = h.value();
>         else if (h.isPercent())
>-            logicalHeight = computePercentageLogicalHeight(h);
>+            logicalHeightValue = computePercentageLogicalHeight(h);
>         // FIXME: Use < 0 or roughlyEquals when we move to float, see https://bugs.webkit.org/show_bug.cgi?id=66148
>-        if (logicalHeight != -1) {
>-            logicalHeight = computeBorderBoxLogicalHeight(logicalHeight);
>-            return logicalHeight;
>+        if (logicalHeightValue != -1) {
>+            logicalHeightValue = computeBorderBoxLogicalHeight(logicalHeightValue);
>+            return logicalHeightValue;
>+        }
>+    } else if (style()->hasAspectRatio() && !logicalHeight() && heightType == LogicalHeight) {
>+        if (logicalWidth()) {
>+            float requiredRatio = style()->aspectRatioDenominator() / style()->aspectRatioNumerator();
>+            int heightForAspectRatio = static_cast<int>(logicalWidth() * requiredRatio);
>+            logicalHeightValue = heightForAspectRatio;
>         }
>     }
>-    return logicalHeight;
>+    return logicalHeightValue;
> }
> 
> LayoutUnit RenderBox::computePercentageLogicalHeight(const Length& height)
>@@ -2535,10 +2620,11 @@ void RenderBox::computePositionedLogicalWidth(RenderRegion* region, LayoutUnit o
>     // Calculate constraint equation values for 'width' case.
>     LayoutUnit logicalWidthResult;
>     LayoutUnit logicalLeftResult;
>-    computePositionedLogicalWidthUsing(style()->logicalWidth(), containerBlock, containerDirection,
>+    computePositionedLogicalWidthUsing(LogicalWidth, containerBlock, containerDirection,
>                                        containerLogicalWidth, bordersPlusPadding,
>                                        logicalLeftLength, logicalRightLength, marginLogicalLeft, marginLogicalRight,
>                                        logicalWidthResult, marginLogicalLeftAlias, marginLogicalRightAlias, logicalLeftResult);
>+    
>     setLogicalWidth(logicalWidthResult);
>     setLogicalLeft(logicalLeftResult);
> 
>@@ -2549,11 +2635,12 @@ void RenderBox::computePositionedLogicalWidth(RenderRegion* region, LayoutUnit o
>         LayoutUnit maxMarginLogicalRight;
>         LayoutUnit maxLogicalLeftPos;
> 
>-        computePositionedLogicalWidthUsing(style()->logicalMaxWidth(), containerBlock, containerDirection,
>+        computePositionedLogicalWidthUsing(MaxLogicalWidth, containerBlock, containerDirection,
>                                            containerLogicalWidth, bordersPlusPadding,
>                                            logicalLeftLength, logicalRightLength, marginLogicalLeft, marginLogicalRight,
>                                            maxLogicalWidth, maxMarginLogicalLeft, maxMarginLogicalRight, maxLogicalLeftPos);
> 
>+
>         if (logicalWidth() > maxLogicalWidth) {
>             setLogicalWidth(maxLogicalWidth);
>             marginLogicalLeftAlias = maxMarginLogicalLeft;
>@@ -2569,7 +2656,7 @@ void RenderBox::computePositionedLogicalWidth(RenderRegion* region, LayoutUnit o
>         LayoutUnit minMarginLogicalRight;
>         LayoutUnit minLogicalLeftPos;
> 
>-        computePositionedLogicalWidthUsing(style()->logicalMinWidth(), containerBlock, containerDirection,
>+        computePositionedLogicalWidthUsing(MinLogicalWidth, containerBlock, containerDirection,
>                                            containerLogicalWidth, bordersPlusPadding,
>                                            logicalLeftLength, logicalRightLength, marginLogicalLeft, marginLogicalRight,
>                                            minLogicalWidth, minMarginLogicalLeft, minMarginLogicalRight, minLogicalLeftPos);
>@@ -2583,7 +2670,7 @@ void RenderBox::computePositionedLogicalWidth(RenderRegion* region, LayoutUnit o
>     }
> 
>     if (stretchesToMinIntrinsicLogicalWidth() && logicalWidth() < minPreferredLogicalWidth() - bordersPlusPadding) {
>-        computePositionedLogicalWidthUsing(Length(minPreferredLogicalWidth() - bordersPlusPadding, Fixed), containerBlock, containerDirection,
>+        computePositionedLogicalWidthUsing(MinPreferredLogicalWidth, containerBlock, containerDirection,
>                                            containerLogicalWidth, bordersPlusPadding,
>                                            logicalLeftLength, logicalRightLength, marginLogicalLeft, marginLogicalRight,
>                                            logicalWidthResult, marginLogicalLeftAlias, marginLogicalRightAlias, logicalLeftResult);
>@@ -2620,7 +2707,7 @@ static void computeLogicalLeftPositionedOffset(LayoutUnit& logicalLeftPos, const
>         logicalLeftPos += (child->isHorizontalWritingMode() ? containerBlock->borderLeft() : containerBlock->borderTop());
> }
> 
>-void RenderBox::computePositionedLogicalWidthUsing(Length logicalWidth, const RenderBoxModelObject* containerBlock, TextDirection containerDirection,
>+void RenderBox::computePositionedLogicalWidthUsing(LogicalWidthType widthType, const RenderBoxModelObject* containerBlock, TextDirection containerDirection,
>                                                    LayoutUnit containerLogicalWidth, LayoutUnit bordersPlusPadding,
>                                                    Length logicalLeft, Length logicalRight, Length marginLogicalLeft, Length marginLogicalRight,
>                                                    LayoutUnit& logicalWidthValue, LayoutUnit& marginLogicalLeftValue, LayoutUnit& marginLogicalRightValue, LayoutUnit& logicalLeftPos)
>@@ -2628,14 +2715,31 @@ void RenderBox::computePositionedLogicalWidthUsing(Length logicalWidth, const Re
>     // 'left' and 'right' cannot both be 'auto' because one would of been
>     // converted to the static position already
>     ASSERT(!(logicalLeft.isAuto() && logicalRight.isAuto()));
>+    Length logicalWidth;
>+    switch (widthType) {
>+    case LogicalWidth:
>+        logicalWidth = style()->logicalWidth();
>+        break;
>+    case MinLogicalWidth:
>+        logicalWidth = style()->logicalMinWidth();
>+        break;
>+    case MaxLogicalWidth:
>+        logicalWidth = style()->logicalMaxWidth();
>+        break;
>+    case MinPreferredLogicalWidth:
>+        logicalWidth =  Length(minPreferredLogicalWidth() - bordersPlusPadding, Fixed);
>+        break;
>+    }
> 
>     LayoutUnit logicalLeftValue = 0;
> 
>-    bool logicalWidthIsAuto = logicalWidth.isIntrinsicOrAuto();
>-    bool logicalLeftIsAuto = logicalLeft.isAuto();
>-    bool logicalRightIsAuto = logicalRight.isAuto();
>+    bool useAspectRatio = useAspectRatioForWidth(logicalWidth, logicalLeft, logicalRight);
>+    // If we are using aspect-ratio for width then there is a constraint on width.
>+    bool logicalWidthIsUnconstrained = logicalWidth.isIntrinsicOrAuto() && !useAspectRatio;
>+    bool logicalLeftIsUnconstrained = logicalLeft.isAuto();
>+    bool logicalRightIsUnconstrained = logicalRight.isAuto();
> 
>-    if (!logicalLeftIsAuto && !logicalWidthIsAuto && !logicalRightIsAuto) {
>+    if (!logicalLeftIsUnconstrained && !logicalWidthIsUnconstrained && !logicalRightIsUnconstrained) {
>         /*-----------------------------------------------------------------------*\
>          * If none of the three is 'auto': If both 'margin-left' and 'margin-
>          * right' are 'auto', solve the equation under the extra constraint that
>@@ -2653,6 +2757,23 @@ void RenderBox::computePositionedLogicalWidthUsing(Length logicalWidth, const Re
> 
>         logicalLeftValue = logicalLeft.calcValue(containerLogicalWidth);
>         logicalWidthValue = computeContentBoxLogicalWidth(logicalWidth.calcValue(containerLogicalWidth));
>+        if (useAspectRatio) {
>+            float requiredRatio = style()->aspectRatio();
>+            if (logicalHeight()) {
>+                int widthForAspectRatio = static_cast<int>(logicalHeight() * requiredRatio);
>+                if (widthType == LogicalWidth)
>+                    logicalWidthValue =  widthForAspectRatio;
>+            } else {
>+                // Height is not determined so LogicalWidth is the container's content width.
>+                // widthType will be LogicalMinWidth or LogicalMaxWidth only if they are specified in which
>+                // case they have to be respected.
>+                if (widthType == LogicalWidth) {
>+                    LayoutUnit availableContainerWidth = containerLogicalWidth - (logicalLeftValue + bordersPlusPadding);
>+                    logicalWidthValue = availableContainerWidth;
>+                }
>+                
>+            }
>+        }
> 
>         const LayoutUnit availableSpace = containerLogicalWidth - (logicalLeftValue + logicalWidthValue + logicalRight.calcValue(containerLogicalWidth) + bordersPlusPadding);
> 
>@@ -2741,7 +2862,7 @@ void RenderBox::computePositionedLogicalWidthUsing(Length logicalWidth, const Re
> 
>         // FIXME: Is there a faster way to find the correct case?
>         // Use rule/case that applies.
>-        if (logicalLeftIsAuto && logicalWidthIsAuto && !logicalRightIsAuto) {
>+        if (logicalLeftIsUnconstrained && logicalWidthIsUnconstrained && !logicalRightIsUnconstrained) {
>             // RULE 1: (use shrink-to-fit for width, and solve of left)
>             LayoutUnit logicalRightValue = logicalRight.calcValue(containerLogicalWidth);
> 
>@@ -2751,7 +2872,7 @@ void RenderBox::computePositionedLogicalWidthUsing(Length logicalWidth, const Re
>             LayoutUnit availableWidth = availableSpace - logicalRightValue;
>             logicalWidthValue = min(max(preferredMinWidth, availableWidth), preferredWidth);
>             logicalLeftValue = availableSpace - (logicalWidthValue + logicalRightValue);
>-        } else if (!logicalLeftIsAuto && logicalWidthIsAuto && logicalRightIsAuto) {
>+        } else if (!logicalLeftIsUnconstrained && logicalWidthIsUnconstrained && logicalRightIsUnconstrained) {
>             // RULE 3: (use shrink-to-fit for width, and no need solve of right)
>             logicalLeftValue = logicalLeft.calcValue(containerLogicalWidth);
> 
>@@ -2760,18 +2881,53 @@ void RenderBox::computePositionedLogicalWidthUsing(Length logicalWidth, const Re
>             LayoutUnit preferredMinWidth = minPreferredLogicalWidth() - bordersPlusPadding;
>             LayoutUnit availableWidth = availableSpace - logicalLeftValue;
>             logicalWidthValue = min(max(preferredMinWidth, availableWidth), preferredWidth);
>-        } else if (logicalLeftIsAuto && !logicalWidthIsAuto && !logicalRightIsAuto) {
>+        } else if (logicalLeftIsUnconstrained && !logicalWidthIsUnconstrained && !logicalRightIsUnconstrained) {
>             // RULE 4: (solve for left)
>             logicalWidthValue = computeContentBoxLogicalWidth(logicalWidth.calcValue(containerLogicalWidth));
>+            if (useAspectRatio) {
>+                float requiredRatio = style()->aspectRatio();
>+                // FIXME: Refactor this.
>+                if (logicalHeight()) {
>+                    int widthForAspectRatio = static_cast<int>(logicalHeight() * requiredRatio);
>+                    if (widthType == LogicalWidth)
>+                        logicalWidthValue =  widthForAspectRatio;
>+                } else {
>+                    // Height is not determined so LogicalWidth is the container's content width.
>+                    // widthType will be LogicalMinWidth or LogicalMaxWidth only if they are specified in which
>+                    // case they have to be respected.
>+                    if (widthType == LogicalWidth) {
>+                        LayoutUnit availableContainerWidth = containerLogicalWidth - (logicalRight.calcMinValue(containerLogicalWidth) + bordersPlusPadding);
>+                        logicalWidthValue = availableContainerWidth;
>+                    }
>+                    
>+                }
>+            }
>             logicalLeftValue = availableSpace - (logicalWidthValue + logicalRight.calcValue(containerLogicalWidth));
>-        } else if (!logicalLeftIsAuto && logicalWidthIsAuto && !logicalRightIsAuto) {
>+        } else if (!logicalLeftIsUnconstrained && logicalWidthIsUnconstrained && !logicalRightIsUnconstrained) {
>             // RULE 5: (solve for width)
>             logicalLeftValue = logicalLeft.calcValue(containerLogicalWidth);
>             logicalWidthValue = availableSpace - (logicalLeftValue + logicalRight.calcValue(containerLogicalWidth));
>-        } else if (!logicalLeftIsAuto && !logicalWidthIsAuto && logicalRightIsAuto) {
>+        } else if (!logicalLeftIsUnconstrained && !logicalWidthIsUnconstrained && logicalRightIsUnconstrained) {
>             // RULE 6: (no need solve for right)
>             logicalLeftValue = logicalLeft.calcValue(containerLogicalWidth);
>             logicalWidthValue = computeContentBoxLogicalWidth(logicalWidth.calcValue(containerLogicalWidth));
>+            if (useAspectRatio) {
>+                float requiredRatio = style()->aspectRatio();
>+                if (logicalHeight()) {
>+                    int widthForAspectRatio = static_cast<int>(logicalHeight() * requiredRatio);
>+                    if (widthType == LogicalWidth)
>+                        logicalWidthValue =  widthForAspectRatio;
>+                } else {
>+                    // Height is not determined so LogicalWidth is the container's content width.
>+                    // widthType will be LogicalMinWidth or LogicalMaxWidth only if they are specified in which
>+                    // case they have to be respected.
>+                    if (widthType == LogicalWidth) {
>+                        LayoutUnit availableContainerWidth = containerLogicalWidth - (logicalLeftValue + bordersPlusPadding);
>+                        logicalWidthValue = availableContainerWidth;
>+                    }
>+                    
>+                }
>+            }
>         }
>     }
> 
>@@ -2864,7 +3020,7 @@ void RenderBox::computePositionedLogicalHeight()
>     LayoutUnit logicalTopPos;
> 
>     // Calculate constraint equation values for 'height' case.
>-    computePositionedLogicalHeightUsing(style()->logicalHeight(), containerBlock, containerLogicalHeight, bordersPlusPadding,
>+    computePositionedLogicalHeightUsing(LogicalHeight, containerBlock, containerLogicalHeight, bordersPlusPadding,
>                                         logicalTopLength, logicalBottomLength, marginBefore, marginAfter,
>                                         logicalHeightResult, marginBeforeAlias, marginAfterAlias, logicalTopPos);
>     setLogicalTop(logicalTopPos);
>@@ -2879,7 +3035,7 @@ void RenderBox::computePositionedLogicalHeight()
>         LayoutUnit maxMarginAfter;
>         LayoutUnit maxLogicalTopPos;
> 
>-        computePositionedLogicalHeightUsing(style()->logicalMaxHeight(), containerBlock, containerLogicalHeight, bordersPlusPadding,
>+        computePositionedLogicalHeightUsing(MaxLogicalHeight, containerBlock, containerLogicalHeight, bordersPlusPadding,
>                                             logicalTopLength, logicalBottomLength, marginBefore, marginAfter,
>                                             maxLogicalHeight, maxMarginBefore, maxMarginAfter, maxLogicalTopPos);
> 
>@@ -2898,7 +3054,7 @@ void RenderBox::computePositionedLogicalHeight()
>         LayoutUnit minMarginAfter;
>         LayoutUnit minLogicalTopPos;
> 
>-        computePositionedLogicalHeightUsing(style()->logicalMinHeight(), containerBlock, containerLogicalHeight, bordersPlusPadding,
>+        computePositionedLogicalHeightUsing(MinLogicalHeight, containerBlock, containerLogicalHeight, bordersPlusPadding,
>                                             logicalTopLength, logicalBottomLength, marginBefore, marginAfter,
>                                             minLogicalHeight, minMarginBefore, minMarginAfter, minLogicalTopPos);
> 
>@@ -2950,7 +3106,7 @@ static void computeLogicalTopPositionedOffset(LayoutUnit& logicalTopPos, const R
>     }
> }
> 
>-void RenderBox::computePositionedLogicalHeightUsing(Length logicalHeightLength, const RenderBoxModelObject* containerBlock,
>+void RenderBox::computePositionedLogicalHeightUsing(LogicalHeightType heightType, const RenderBoxModelObject* containerBlock,
>                                                     LayoutUnit containerLogicalHeight, LayoutUnit bordersPlusPadding,
>                                                     Length logicalTop, Length logicalBottom, Length marginBefore, Length marginAfter,
>                                                     LayoutUnit& logicalHeightValue, LayoutUnit& marginBeforeValue, LayoutUnit& marginAfterValue, LayoutUnit& logicalTopPos)
>@@ -2958,22 +3114,35 @@ void RenderBox::computePositionedLogicalHeightUsing(Length logicalHeightLength,
>     // 'top' and 'bottom' cannot both be 'auto' because 'top would of been
>     // converted to the static position in computePositionedLogicalHeight()
>     ASSERT(!(logicalTop.isAuto() && logicalBottom.isAuto()));
>+    Length logicalHeightLength;
>+    switch (heightType) {
>+    case LogicalHeight:
>+        logicalHeightLength = style()->logicalHeight();
>+        break;
>+    case MinLogicalHeight:
>+        logicalHeightLength = style()->logicalMinHeight();
>+        break;
>+    case MaxLogicalHeight:
>+        logicalHeightLength = style()->logicalMaxHeight();
>+        break;
>+    }
> 
>     LayoutUnit contentLogicalHeight = logicalHeight() - bordersPlusPadding;
> 
>     LayoutUnit logicalTopValue = 0;
> 
>-    bool logicalHeightIsAuto = logicalHeightLength.isAuto();
>-    bool logicalTopIsAuto = logicalTop.isAuto();
>-    bool logicalBottomIsAuto = logicalBottom.isAuto();
>+    bool useAspectRatio = useAspectRatioForHeight(logicalHeightLength, logicalTop, logicalBottom);
>+    bool logicalHeightIsUnconstrained = logicalHeightLength.isAuto() && !useAspectRatio;
>+    bool logicalTopIsUnconstrained = logicalTop.isAuto();
>+    bool logicalBottomIsUnconstrained = logicalBottom.isAuto();
> 
>     // Height is never unsolved for tables.
>     if (isTable()) {
>         logicalHeightLength.setValue(Fixed, contentLogicalHeight);
>-        logicalHeightIsAuto = false;
>+        logicalHeightIsUnconstrained = false;
>     }
> 
>-    if (!logicalTopIsAuto && !logicalHeightIsAuto && !logicalBottomIsAuto) {
>+    if (!logicalTopIsUnconstrained && !logicalHeightIsUnconstrained && !logicalBottomIsUnconstrained) {
>         /*-----------------------------------------------------------------------*\
>          * If none of the three are 'auto': If both 'margin-top' and 'margin-
>          * bottom' are 'auto', solve the equation under the extra constraint that
>@@ -2985,9 +3154,21 @@ void RenderBox::computePositionedLogicalHeightUsing(Length logicalHeightLength,
>         // NOTE:  It is not necessary to solve for 'bottom' in the over constrained
>         // case because the value is not used for any further calculations.
> 
>-        logicalHeightValue = computeContentBoxLogicalHeight(logicalHeightLength.calcValue(containerLogicalHeight));
>         logicalTopValue = logicalTop.calcValue(containerLogicalHeight);
>-
>+        logicalHeightValue = computeContentBoxLogicalHeight(logicalHeightLength.calcValue(containerLogicalHeight));
>+        if (useAspectRatio) {
>+            float requiredRatio = style()->aspectRatioDenominator() / style()->aspectRatioNumerator();
>+            if (logicalWidth()) {
>+                int heightForAspectRatio = static_cast<int>(logicalWidth() * requiredRatio);
>+                if (heightType == LogicalHeight)
>+                    logicalHeightValue = heightForAspectRatio;
>+            } else {
>+                if (heightType == LogicalHeight) {
>+                    LayoutUnit availableContainerHeight = containerLogicalHeight - (logicalTopValue + logicalBottom.calcValue(containerLogicalHeight) + bordersPlusPadding);
>+                    logicalHeightValue = availableContainerHeight;
>+                }
>+            }
>+        }
>         const LayoutUnit availableSpace = containerLogicalHeight - (logicalTopValue + logicalHeightValue + logicalBottom.calcValue(containerLogicalHeight) + bordersPlusPadding);
> 
>         // Margins are now the only unknown
>@@ -3042,26 +3223,52 @@ void RenderBox::computePositionedLogicalHeightUsing(Length logicalHeightLength,
>         const LayoutUnit availableSpace = containerLogicalHeight - (marginBeforeValue + marginAfterValue + bordersPlusPadding);
> 
>         // Use rule/case that applies.
>-        if (logicalTopIsAuto && logicalHeightIsAuto && !logicalBottomIsAuto) {
>+        if (logicalTopIsUnconstrained && logicalHeightIsUnconstrained && !logicalBottomIsUnconstrained) {
>             // RULE 1: (height is content based, solve of top)
>             logicalHeightValue = contentLogicalHeight;
>             logicalTopValue = availableSpace - (logicalHeightValue + logicalBottom.calcValue(containerLogicalHeight));
>-        } else if (!logicalTopIsAuto && logicalHeightIsAuto && logicalBottomIsAuto) {
>+        } else if (!logicalTopIsUnconstrained && logicalHeightIsUnconstrained && logicalBottomIsUnconstrained) {
>             // RULE 3: (height is content based, no need solve of bottom)
>             logicalTopValue = logicalTop.calcValue(containerLogicalHeight);
>             logicalHeightValue = contentLogicalHeight;
>-        } else if (logicalTopIsAuto && !logicalHeightIsAuto && !logicalBottomIsAuto) {
>+        } else if (logicalTopIsUnconstrained && !logicalHeightIsUnconstrained && !logicalBottomIsUnconstrained) {
>             // RULE 4: (solve of top)
>             logicalHeightValue = computeContentBoxLogicalHeight(logicalHeightLength.calcValue(containerLogicalHeight));
>             logicalTopValue = availableSpace - (logicalHeightValue + logicalBottom.calcValue(containerLogicalHeight));
>-        } else if (!logicalTopIsAuto && logicalHeightIsAuto && !logicalBottomIsAuto) {
>+            if (useAspectRatio) {
>+                float requiredRatio = style()->aspectRatioDenominator() / style()->aspectRatioNumerator();
>+                if (logicalWidth()) {
>+                    int heightForAspectRatio = static_cast<int>(logicalWidth() * requiredRatio);
>+                    if (heightType == LogicalHeight)
>+                        logicalHeightValue = heightForAspectRatio;
>+                } else {
>+                    if (heightType == LogicalHeight) {
>+                        LayoutUnit availableContainerHeight = containerLogicalHeight - (logicalTopValue + logicalBottom.calcValue(containerLogicalHeight) + bordersPlusPadding);
>+                        logicalHeightValue = availableContainerHeight;
>+                    }
>+                }
>+            }
>+        } else if (!logicalTopIsUnconstrained && logicalHeightIsUnconstrained && !logicalBottomIsUnconstrained) {
>             // RULE 5: (solve of height)
>             logicalTopValue = logicalTop.calcValue(containerLogicalHeight);
>             logicalHeightValue = max<LayoutUnit>(0, availableSpace - (logicalTopValue + logicalBottom.calcValue(containerLogicalHeight)));
>-        } else if (!logicalTopIsAuto && !logicalHeightIsAuto && logicalBottomIsAuto) {
>+        } else if (!logicalTopIsUnconstrained && !logicalHeightIsUnconstrained && logicalBottomIsUnconstrained) {
>             // RULE 6: (no need solve of bottom)
>             logicalHeightValue = computeContentBoxLogicalHeight(logicalHeightLength.calcValue(containerLogicalHeight));
>             logicalTopValue = logicalTop.calcValue(containerLogicalHeight);
>+            if (useAspectRatio) {
>+                float requiredRatio = style()->aspectRatioDenominator() / style()->aspectRatioNumerator();
>+                if (logicalWidth()) {
>+                    int heightForAspectRatio = static_cast<int>(logicalWidth() * requiredRatio);
>+                    if (heightType == LogicalHeight)
>+                        logicalHeightValue = heightForAspectRatio;
>+                } else {
>+                    if (heightType == LogicalHeight) {
>+                        LayoutUnit availableContainerHeight = containerLogicalHeight - (logicalTopValue + logicalBottom.calcValue(containerLogicalHeight) + bordersPlusPadding);
>+                        logicalHeightValue = availableContainerHeight;
>+                    }
>+                }
>+            }
>         }
>     }
> 
>diff --git a/Source/WebCore/rendering/RenderBox.h b/Source/WebCore/rendering/RenderBox.h
>index bc1ffd9834cb79b47f70e7a2cdedfa4eda7412f0..a3069196adaa4ad5453bfc0800a84ba5a6888c01 100644
>--- a/Source/WebCore/rendering/RenderBox.h
>+++ b/Source/WebCore/rendering/RenderBox.h
>@@ -33,7 +33,8 @@ class RenderBoxRegionInfo;
> class RenderRegion;
> struct PaintInfo;
> 
>-enum LogicalWidthType { LogicalWidth, MinLogicalWidth, MaxLogicalWidth };
>+enum LogicalWidthType { LogicalWidth, MinLogicalWidth, MaxLogicalWidth, MinPreferredLogicalWidth };
>+enum LogicalHeightType { LogicalHeight, MinLogicalHeight, MaxLogicalHeight };
> 
> enum OverlayScrollbarSizeRelevancy { IgnoreOverlayScrollbarSize, IncludeOverlayScrollbarSize };
> 
>@@ -298,6 +299,15 @@ public:
>     LayoutUnit containingBlockLogicalWidthForContentInRegion(RenderRegion*, LayoutUnit offsetFromLogicalTopOfFirstPage) const;
>     LayoutUnit perpendicularContainingBlockLogicalHeight() const;
>     
>+    virtual bool isWidthDeterminedUsing(const Length& logicalWidth, const Length& logicalLeft, const Length& logicalRight) const;
>+    bool isWidthDetermined() const;
>+    virtual bool isHeightDeterminedUsing(const Length& logicalHeight, const Length& logicalTop, const Length& logicalBottom) const;
>+    bool isHeightDetermined() const;
>+    virtual bool hasMinOrMaxConstraints() const;
>+
>+    bool useAspectRatioForWidth(const Length& logicalWidth, const Length& logicalLeft, const Length& logicalRight) const;
>+    bool useAspectRatioForHeight(const Length& logicalHeight, const Length& logicalTop, const Length& logicalBottom) const;
>+    
>     virtual void computeLogicalWidth();
>     virtual void computeLogicalHeight();
> 
>@@ -319,7 +329,7 @@ public:
>     virtual bool stretchesToMinIntrinsicLogicalWidth() const { return false; }
> 
>     LayoutUnit computeLogicalWidthUsing(LogicalWidthType, LayoutUnit availableLogicalWidth);
>-    LayoutUnit computeLogicalHeightUsing(const Length& height);
>+    LayoutUnit computeLogicalHeightUsing(LogicalHeightType);
>     LayoutUnit computeReplacedLogicalWidthUsing(Length width) const;
>     LayoutUnit computeReplacedLogicalWidthRespectingMinMaxWidth(LayoutUnit logicalWidth, bool includeMaxWidth = true) const;
>     LayoutUnit computeReplacedLogicalHeightUsing(Length height) const;
>@@ -473,11 +483,11 @@ private:
>     LayoutUnit containingBlockLogicalHeightForPositioned(const RenderBoxModelObject* containingBlock, bool checkForPerpendicularWritingMode = true) const;
> 
>     void computePositionedLogicalHeight();
>-    void computePositionedLogicalWidthUsing(Length logicalWidth, const RenderBoxModelObject* containerBlock, TextDirection containerDirection,
>+    void computePositionedLogicalWidthUsing(LogicalWidthType, const RenderBoxModelObject* containerBlock, TextDirection containerDirection,
>                                             LayoutUnit containerLogicalWidth, LayoutUnit bordersPlusPadding,
>                                             Length logicalLeft, Length logicalRight, Length marginLogicalLeft, Length marginLogicalRight,
>                                             LayoutUnit& logicalWidthValue, LayoutUnit& marginLogicalLeftValue, LayoutUnit& marginLogicalRightValue, LayoutUnit& logicalLeftPos);
>-    void computePositionedLogicalHeightUsing(Length logicalHeight, const RenderBoxModelObject* containerBlock,
>+    void computePositionedLogicalHeightUsing(LogicalHeightType, const RenderBoxModelObject* containerBlock,
>                                              LayoutUnit containerLogicalHeight, LayoutUnit bordersPlusPadding,
>                                              Length logicalTop, Length logicalBottom, Length marginLogicalTop, Length marginLogicalBottom,
>                                              LayoutUnit& logicalHeightValue, LayoutUnit& marginLogicalTopValue, LayoutUnit& marginLogicalBottomValue, LayoutUnit& logicalTopPos);
>diff --git a/Source/WebCore/rendering/style/RenderStyle.cpp b/Source/WebCore/rendering/style/RenderStyle.cpp
>index 15354c584fd3fbcf4a379f6419bf1faa8a97dff4..bcbdd4725f300db55ae921b655d402c583e48d34 100644
>--- a/Source/WebCore/rendering/style/RenderStyle.cpp
>+++ b/Source/WebCore/rendering/style/RenderStyle.cpp
>@@ -385,6 +385,16 @@ StyleDifference RenderStyle::diff(const RenderStyle* other, unsigned& changedCon
>             || rareNonInheritedData->textOverflow != other->rareNonInheritedData->textOverflow)
>             return StyleDifferenceLayout;
> 
>+        if (rareNonInheritedData->m_hasAspectRatio != other->rareNonInheritedData->m_hasAspectRatio)
>+            return StyleDifferenceLayout;
>+
>+        if (rareNonInheritedData->m_hasAspectRatio) {
>+            float aspectRatio = rareNonInheritedData->m_aspectRatioNumerator / rareNonInheritedData->m_aspectRatioDenominator;
>+            float otherAspectRatio = other->rareNonInheritedData->m_aspectRatioNumerator / other->rareNonInheritedData->m_aspectRatioDenominator;
>+            if (aspectRatio != otherAspectRatio)
>+                return StyleDifferenceLayout;
>+        }
>+
>         if (rareNonInheritedData->m_regionOverflow != other->rareNonInheritedData->m_regionOverflow)
>             return StyleDifferenceLayout;
> 
>diff --git a/LayoutTests/ChangeLog b/LayoutTests/ChangeLog
>index 85278184ae36d95bad4e711e59975ac7c3e2a66d..5c0ccd862d994600627533f2a9ab9bf0c6c5065c 100755
>--- a/LayoutTests/ChangeLog
>+++ b/LayoutTests/ChangeLog
>@@ -1,3 +1,18 @@
>+2011-11-28  Fady Samuel  <fsamuel@chromium.org>
>+
>+        -webkit-aspect-ratio Layout Implementation
>+        https://bugs.webkit.org/show_bug.cgi?id=73277
>+
>+        Reviewed by NOBODY (OOPS!).
>+
>+        * css3/aspect-ratio/absolute-ratio-absolute-left-right.html: Added.
>+        * css3/aspect-ratio/aspect-ratio-absolute-height.html: Added.
>+        * css3/aspect-ratio/aspect-ratio-absolute-width.html: Added.
>+        * css3/aspect-ratio/aspect-ratio-auto-height.html: Added.
>+        * css3/aspect-ratio/aspect-ratio-float.html: Added.
>+        * css3/aspect-ratio/aspect-ratio-inherit.html: Added.
>+        * css3/aspect-ratio/aspect-ratio-stretch-to-fill.html: Added.
>+
> 2011-11-28  Jeff Timanus  <twiz@chromium.org>
> 
>         Suppressing a failing webgl conformance test on Mac.
>diff --git a/LayoutTests/css3/aspect-ratio/absolute-ratio-absolute-left-right.html b/LayoutTests/css3/aspect-ratio/absolute-ratio-absolute-left-right.html
>new file mode 100644
>index 0000000000000000000000000000000000000000..7d788732ea1f27aa4c4e51915585d6653b494d62
>--- /dev/null
>+++ b/LayoutTests/css3/aspect-ratio/absolute-ratio-absolute-left-right.html
>@@ -0,0 +1,7 @@
>+<html>
>+  <head>
>+  </head>
>+  <body>
>+    <div style="position: absolute; top: 10px; left: 10px; right: 10px; -webkit-aspect-ratio: 16 / 9; background-color: green;"></div>
>+  </body>
>+</html>
>diff --git a/LayoutTests/css3/aspect-ratio/aspect-ratio-absolute-height.html b/LayoutTests/css3/aspect-ratio/aspect-ratio-absolute-height.html
>new file mode 100644
>index 0000000000000000000000000000000000000000..932cb3d115c200f34e096081d92a7c401ad8bbf2
>--- /dev/null
>+++ b/LayoutTests/css3/aspect-ratio/aspect-ratio-absolute-height.html
>@@ -0,0 +1,7 @@
>+<html>
>+  <head>
>+  </head>
>+  <body>
>+    <div style="position: absolute; height: 50px; top: 10px; left:10px; -webkit-aspect-ratio: 9/16; background-color: green;"></div>
>+  </body>
>+</html>
>diff --git a/LayoutTests/css3/aspect-ratio/aspect-ratio-absolute-width.html b/LayoutTests/css3/aspect-ratio/aspect-ratio-absolute-width.html
>new file mode 100644
>index 0000000000000000000000000000000000000000..fceb58a81650c1c060233bb309399d6683358e94
>--- /dev/null
>+++ b/LayoutTests/css3/aspect-ratio/aspect-ratio-absolute-width.html
>@@ -0,0 +1,7 @@
>+<html>
>+  <head>
>+  </head>
>+  <body>
>+    <div style="position: absolute; width: 50px; top: 10px; left:10px; -webkit-aspect-ratio: 9/16; background-color: green;"></div>
>+  </body>
>+</html>
>diff --git a/LayoutTests/css3/aspect-ratio/aspect-ratio-auto-height.html b/LayoutTests/css3/aspect-ratio/aspect-ratio-auto-height.html
>new file mode 100644
>index 0000000000000000000000000000000000000000..a5c59c5019ff8bd3962d023e2490089c37c5e1c6
>--- /dev/null
>+++ b/LayoutTests/css3/aspect-ratio/aspect-ratio-auto-height.html
>@@ -0,0 +1,7 @@
>+<html>
>+  <head>
>+  </head>
>+  <body>
>+    <div style="position: absolute; left: 10px; width: 200px; -webkit-aspect-ratio: 16 / 9; background-color: green;"></div>
>+  </body>
>+</html>
>diff --git a/LayoutTests/css3/aspect-ratio/aspect-ratio-float.html b/LayoutTests/css3/aspect-ratio/aspect-ratio-float.html
>new file mode 100644
>index 0000000000000000000000000000000000000000..3c023faf1176e3a718a657d779e9be9ba6df639d
>--- /dev/null
>+++ b/LayoutTests/css3/aspect-ratio/aspect-ratio-float.html
>@@ -0,0 +1,3 @@
>+<div style="width: 600px; height: 200px; background-color: red;">
>+  <div style="float: right; width: 50px; -webkit-aspect-ratio: 1/4; background-color: green;"></div>
>+</div>
>diff --git a/LayoutTests/css3/aspect-ratio/aspect-ratio-inherit.html b/LayoutTests/css3/aspect-ratio/aspect-ratio-inherit.html
>new file mode 100644
>index 0000000000000000000000000000000000000000..cd3f7596e30212e4fd566dfefa5acab360dc9b4a
>--- /dev/null
>+++ b/LayoutTests/css3/aspect-ratio/aspect-ratio-inherit.html
>@@ -0,0 +1,9 @@
>+<html>
>+  <head>
>+  </head>
>+  <body>
>+    <div style="position: fixed; top: 10px; bottom: 10px; left: 10px; right: 10px; -webkit-aspect-ratio: 20 / 9; background-color: red;">
>+      <div style="position: relative; left: 50px; top: 50px; width: 300px; background-color: green; -webkit-aspect-ratio: inherit;"></div>
>+    </div>
>+  </body>
>+</html>
>diff --git a/LayoutTests/css3/aspect-ratio/aspect-ratio-stretch-to-fill.html b/LayoutTests/css3/aspect-ratio/aspect-ratio-stretch-to-fill.html
>new file mode 100644
>index 0000000000000000000000000000000000000000..360384e27127bf77db6666496210e356b904f371
>--- /dev/null
>+++ b/LayoutTests/css3/aspect-ratio/aspect-ratio-stretch-to-fill.html
>@@ -0,0 +1,7 @@
>+<html>
>+  <head>
>+  </head>
>+  <body>
>+    <div style="position:absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; -webkit-aspect-ratio: 16 / 9; margin: auto; background-color: green; max-height: 640px;"></div>
>+  </body>
>+</html>

Actions: View | Formatted Diff | Diff

Attachments on bug 73277: 116873 | 117021 | 117037 | 117111