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

Source/core/rendering/RenderBoxModelObject.cpp

 /*
  * Copyright (C) 1999 Lars Knoll (knoll@kde.org)
  *           (C) 1999 Antti Koivisto (koivisto@kde.org)
  *           (C) 2005 Allan Sandfeld Jensen (kde@carewolf.com)
  *           (C) 2005, 2006 Samuel Weinig (sam.weinig@gmail.com)
  * Copyright (C) 2005, 2006, 2007, 2008, 2009 Apple Inc. All rights reserved.
  * Copyright (C) 2010 Google Inc. All rights reserved.
  *
  * This library is free software; you can redistribute it and/or
  * modify it under the terms of the GNU Library General Public
@@ skipping 292 matching lines @@
 int RenderBoxModelObject::pixelSnappedOffsetWidth() const
 {
     return snapSizeToPixel(offsetWidth(), offsetLeft());
 }
 
 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() && (type == TopPadding || type == BottomPadding || type == BeforePadding || type == AfterPadding))

[ojan, 2014/07/15 20:33:25]

This isn't correct for vertical writing mode. TopPadding/BottomPadding are not
computed with respect to the logical height in vertical writing mode. Please add
some vertical writing mode tests.

[harpreet.sk, 2014/07/16 15:43:02]

Done.

+            w = containingBlockLogicalHeightForContent();
+        else
+            w = containingBlockLogicalWidthForContent();
+    }
     return minimumValueForLength(padding, w);
 }
 
 RoundedRect RenderBoxModelObject::getBackgroundRoundedRect(const LayoutRect& borderRect, InlineFlowBox* box, LayoutUnit inlineBoxWidth, LayoutUnit inlineBoxHeight,
     bool includeLogicalLeftEdge, bool includeLogicalRightEdge) const
 {
     RoundedRect border = style()->getRoundedBorderFor(borderRect, includeLogicalLeftEdge, includeLogicalRightEdge);
     if (box && (box->nextLineBox() || box->prevLineBox())) {
         RoundedRect segmentBorder = style()->getRoundedBorderFor(LayoutRect(0, 0, inlineBoxWidth, inlineBoxHeight), includeLogicalLeftEdge, includeLogicalRightEdge);
         border.setRadii(segmentBorder.radii());
@@ skipping 2172 matching lines @@
             context->drawInnerShadow(border, shadowColor, flooredIntSize(shadowOffset), shadowBlur, shadowSpread, clippedEdges);
         }
     }
 }
 
 LayoutUnit RenderBoxModelObject::containingBlockLogicalWidthForContent() const
 {
     return containingBlock()->availableLogicalWidth();
 }
 
+LayoutUnit RenderBoxModelObject::containingBlockLogicalHeightForContent() const

[leviw_travelin_and_unemployed, 2014/07/15 20:08:29]

This is different than RenderBox::containingBlockLogicalHeightForContent... It
should either be unified or renamed to make its different functionality
apparent.

[harpreet.sk, 2014/07/16 15:43:01]

Renamed.

+{
+    if (containingBlock()->style()->logicalHeight().isIntrinsicOrAuto())
+        return 0;
+
+    if (containingBlock()->style()->logicalHeight().isPercent())
+        return containingBlock()->computePercentLogicalHeight();
+
+    return containingBlock()->style()->logicalHeight().value();

[ojan, 2014/07/15 20:33:25]

Please ASSERT(containingBlock()->style()->logicalHeight().type() == Fixed). Even
better, just make this a switch statement over the type. That way you save a
branch and the compiler will yell at you if you miss any cases.

[harpreet.sk, 2014/07/16 15:43:01]

Replaced if's with switch

+}
+
+LayoutUnit RenderBoxModelObject::computePercentLogicalHeight() const

[ojan, 2014/07/15 20:33:25]

This also is duplicating a method on RenderBox but doing something different. I
don't think this is right for a bunch of cases. Why can't you use
RenderBox::computePercentageLogicalHeight?

[harpreet.sk, 2014/07/16 15:43:01]

Renamed the function. The reason why i am not using
RenderBox::computePercentageLogicalHeight because say for example

<div style="height:fit-content;">
    <div class= "flexbox" "style="height=10%">
        <div style="padding: 10%">
        </div>
    </div>
</div>

If suppose i use RenderBox::computePercentageLogicalHeight to get percent height
of flexbox for computation of padding in that case at that time of computation
of padding since the layout has not been done and outer div has layout dependent
height so say it will return 0 for height of flexbox and padding-top and bottom
becomes 0. Once layout has been done with padding-top/bottom as 0 and say we now
query for the values of padding-top and padding-bottom using getCOmputedStyles
it will again call this api RenderBox::computePercentageLogicalHeight and since
this time layout has been done so we will have some finite height for outer div
so this time height of flexbox will be coming different and hence padding values
coming will be different.

+{
+    float percentHeightFactor = style()->logicalHeight().value() / 100;

[ojan, 2014/07/15 20:33:25]

ASSERT(style()->logicalHeight().isPercent());

[harpreet.sk, 2014/07/16 15:43:01]

Done.

+    RenderBlock* cb = containingBlock();
+    while (cb) {
+        if (cb->style()->logicalHeight().isIntrinsicOrAuto())
+            return 0;
+        if (cb->style()->logicalHeight().isFixed() || cb->style()->logicalHeight().isCalculated())

[ojan, 2014/07/15 20:33:25]

This should use skipContainingBlockForPercentHeightCalculation.

[harpreet.sk, 2014/07/16 15:43:01]

Done.

+            break;
+        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)
         return 0;
     return continuationMap->get(this);
 }
 
 void RenderBoxModelObject::setContinuation(RenderBoxModelObject* continuation)
 {
     if (continuation) {
@@ skipping 210 matching lines @@
     ASSERT(!beforeChild || toBoxModelObject == beforeChild->parent());
     for (RenderObject* child = startChild; child && child != endChild; ) {
         // Save our next sibling as moveChildTo will clear it.
         RenderObject* nextSibling = child->nextSibling();
         moveChildTo(toBoxModelObject, child, beforeChild, fullRemoveInsert);
         child = nextSibling;
     }
 }
 
 } // namespace WebCore