For flex items, percent paddings should resolve against their respective dimension

Source/core/rendering/RenderBoxModelObject.cpp

Index: Source/core/rendering/RenderBoxModelObject.cpp
diff --git a/Source/core/rendering/RenderBoxModelObject.cpp b/Source/core/rendering/RenderBoxModelObject.cpp
index 52e24c03bb01037583c82081dd5eea85cb4f9bb0..a702ae99aef40f3636421fcfd90c521a45f74186 100644
--- a/Source/core/rendering/RenderBoxModelObject.cpp
+++ b/Source/core/rendering/RenderBoxModelObject.cpp
@@ -310,11 +310,19 @@ int RenderBoxModelObject::pixelSnappedOffsetHeight() const
     return snapSizeToPixel(offsetHeight(), offsetTop());
 }
 
-LayoutUnit RenderBoxModelObject::computedCSSPadding(const Length& padding) const
+LayoutUnit RenderBoxModelObject::computedCSSPadding(const Length& padding, PaddingType type) const
 {
     LayoutUnit w = 0;
-    if (padding.isPercent())
-        w = containingBlockLogicalWidthForContent();
+    if (padding.isPercent()) {
+        if (containingBlock()->isFlexibleBox() && RuntimeEnabledFeatures::verticalPaddingEnabled()) {
+            if (type == TopPadding || type == BottomPadding || type == BeforePadding || type == AfterPadding)
+                w = isHorizontalWritingMode() ? containingBlockLogicalHeightForPadding() : containingBlockLogicalWidthForContent();
+            else
+                w = isHorizontalWritingMode() ? containingBlockLogicalWidthForContent() : containingBlockLogicalHeightForPadding();
+        } else {
+            w = containingBlockLogicalWidthForContent();
+        }
+    }
     return minimumValueForLength(padding, w);
 }
 
@@ -2507,6 +2515,47 @@ LayoutUnit RenderBoxModelObject::containingBlockLogicalWidthForContent() const
     return containingBlock()->availableLogicalWidth();
 }
 
+LayoutUnit RenderBoxModelObject::containingBlockLogicalHeightForPadding() const
+{
+    switch (containingBlock()->style()->logicalHeight().type()) {
+    case Auto:
+    case MinContent:
+    case MaxContent:
+    case FitContent:
+    case FillAvailable:
+        return 0;
+    case Fixed:
+    case Calculated:
+        return containingBlock()->style()->logicalHeight().value();
+    case Percent:
+        return computePercentLogicalHeightForPadding(containingBlock());
+    default:

[tony, 2014/07/16 16:57:23]

One of the reasons to use a switch statement is so you can enumerate all the
values and get a compiler error if someone adds a new type.  Please replace the
|default| label with the other values and add an ASSERT_NOT_REACHED() if
appropriate-- you'll need to see if the other LengthTypes can be set to a height
or width.

[harpreet.sk, 2014/07/17 14:36:53]

Done.

+        return 0;
+    }
+}
+
+LayoutUnit RenderBoxModelObject::computePercentLogicalHeightForPadding(RenderBlock* block) const
+{
+    ASSERT(block->style()->logicalHeight().isPercent());
+
+    float percentHeightFactor = block->style()->logicalHeight().value() / 100;
+    RenderBlock* cb = block->containingBlock();
+    while (cb) {
+        if (cb->style()->logicalHeight().isIntrinsicOrAuto())
+            return 0;
+        if (!block->skipContainingBlockForPercentHeightCalculation(cb) && (cb->style()->logicalHeight().isFixed() || cb->style()->logicalHeight().isCalculated()))
+            break;
+        if (cb->style()->logicalHeight().isPercent())
+            percentHeightFactor *= cb->style()->logicalHeight().value() / 100;
+        cb = cb->containingBlock();
+    }
+
+    if (cb)
+        return percentHeightFactor * cb->style()->logicalHeight().value();
+
+    return 0;
+}
+
 RenderBoxModelObject* RenderBoxModelObject::continuation() const
 {
     if (!continuationMap)