12 changed files with 3207 additions and 145 deletions
--- a/gentest/fixtures/YGBoxSizingTest.html
+++ b/gentest/fixtures/YGBoxSizingTest.html
@@ -1,36 +1,89 @@
-<div data-disabled="true" id="box_sizing_content_box"
+<div id="box_sizing_content_box_simple"
  style="width: 100px; height: 100px; padding: 5px; border-width: 10px; box-sizing: content-box">
 </div>

-<div id="box_sizing_border_box"
+<div id="box_sizing_border_box_simple"
  style="width: 100px; height: 100px; padding: 5px; border-width: 10px; box-sizing: border-box">
 </div>

-<div data-disabled="true" id="box_sizing_content_box_padding_only"
+<div id="box_sizing_content_box_percent" style="width: 100px; height: 100px;">
+  <div style="width: 50%; height: 25%; padding: 4px; border-width: 16px; box-sizing: content-box">
+  </div>
+</div>
+
+<div id="box_sizing_border_box_percent" style="width: 100px; height: 100px;">
+  <div style="width: 50%; height: 25%; padding: 4px; border-width: 16px; box-sizing: border-box">
+  </div>
+</div>
+
+<div id="box_sizing_content_box_absolute" style="width: 100px; height: 100px;">
+  <div style="width: 50; height: 25%; padding: 12px; border-width: 8px; box-sizing: content-box; position: absolute;">
+  </div>
+</div>
+
+<div id="box_sizing_border_box_absolute" style="width: 100px; height: 100px;">
+  <div style="width: 50; height: 25%; padding: 12px; border-width: 8px; box-sizing: border-box; position: absolute;">
+  </div>
+</div>
+
+<div id="box_sizing_content_box_comtaining_block"
+  style="width: 100px; height: 100px; padding: 12px; border-width: 8px; box-sizing: content-box; ">
+  <div style="width: 75; height: 75; position: static;">
+    <div style="width: 50px; height: 25%; position: absolute;">
+    </div>
+  </div>
+</div>
+
+<div id="box_sizing_border_box_comtaining_block"
+  style="width: 100px; height: 100px;  padding: 12px; border-width: 8px; box-sizing: border-box; ">
+  <div style="width: 75; height: 75; position: static;">
+    <div style="width: 50px; height: 25%; position: absolute;">
+    </div>
+  </div>
+</div>
+
+<div id="box_sizing_content_box_padding_only"
  style="width: 100px; height: 100px; padding: 5px; box-sizing: content-box">
 </div>

-<div id="box_sizing_border_box_padding_only"
-  style="width: 100px; height: 100px; padding: 5px; box-sizing: border-box">
+<div id="box_sizing_content_box_padding_only_percent" style="width: 100px; height: 100px;">
+  <div style="width: 50%; height: 75; padding: 10%; box-sizing: content-box">
+  </div>
 </div>

-<div data-disabled="true" id="box_sizing_content_box_border_only"
+<div id="box_sizing_border_box_padding_only" style="width: 100px; height: 100px; padding: 5px; box-sizing: border-box">
+</div>
+
+<div id="box_sizing_border_box_padding_only_percent" style="width: 100px; height: 100px;">
+  <div style="width: 50%; height: 75; padding: 10%; box-sizing: border-box">
+  </div>
+</div>
+
+<div id="box_sizing_content_box_border_only"
  style="width: 100px; height: 100px; border-width: 10px; box-sizing: content-box">
 </div>

+<div id="box_sizing_content_box_border_only_percent" style="width: 100px; height: 100px;">
+  <div style="width: 50%; height: 75; border-width: 10%; box-sizing: content-box">
+  </div>
+</div>
+
 <div id="box_sizing_border_box_border_only"
  style="width: 100px; height: 100px; border-width: 10px; box-sizing: border-box">
 </div>

-<div data-disabled="true" id="box_sizing_content_box_no_padding_no_border"
-  style="width: 100px; height: 100px; box-sizing: content-box">
+<div id="box_sizing_border_box_border_only_percent" style="width: 100px; height: 100px;">
+  <div style="width: 50%; height: 75; border-width: 10%; box-sizing: border-box">
+  </div>
 </div>

-<div id="box_sizing_border_box_no_padding_no_border"
-  style="width: 100px; height: 100px; box-sizing: border-box">
+<div id="box_sizing_content_box_no_padding_no_border" style="width: 100px; height: 100px; box-sizing: content-box">
 </div>

-<div data-disabled="true" id="box_sizing_content_box_children"
+<div id="box_sizing_border_box_no_padding_no_border" style="width: 100px; height: 100px; box-sizing: border-box">
+</div>
+
+<div id="box_sizing_content_box_children"
  style="width: 100px; height: 100px; padding: 5px; border-width: 10px; box-sizing: content-box">
  <div style="width: 25px; height: 25px"></div>
  <div style="width: 25px; height: 25px"></div>
@@ -46,7 +99,7 @@
  <div style="width: 25px; height: 25px"></div>
 </div>

-<div data-disabled="true" id="box_sizing_content_box_siblings" style="width: 100px; height: 100px;">
+<div id="box_sizing_content_box_siblings" style="width: 100px; height: 100px;">
  <div style="width: 25px; height: 25px"></div>
  <div style="width: 25px; height: 25px; box-sizing: content-box; padding: 10px; border-width: 10px"></div>
  <div style="width: 25px; height: 25px"></div>
@@ -60,7 +113,7 @@
  <div style="width: 25px; height: 25px"></div>
 </div>

-<div data-disabled="true" id="box_sizing_content_box_max_width" style="width: 100px; height: 100px;">
+<div id="box_sizing_content_box_max_width" style="width: 100px; height: 100px;">
  <div style="max-width: 50px; height: 25px; box-sizing: content-box; padding: 5px; border-width: 15px"></div>
  <div style="width: 25px; height: 25px"></div>
 </div>
@@ -70,7 +123,7 @@
  <div style="width: 25px; height: 25px"></div>
 </div>

-<div data-disabled="true" id="box_sizing_content_box_max_height" style="width: 100px; height: 100px;">
+<div id="box_sizing_content_box_max_height" style="width: 100px; height: 100px;">
  <div style="width: 50px; max-height: 50px; box-sizing: content-box; padding: 5px; border-width: 15px"></div>
  <div style="width: 25px; height: 25px"></div>
 </div>
@@ -80,7 +133,7 @@
  <div style="width: 25px; height: 25px"></div>
 </div>

-<div data-disabled="true" id="box_sizing_content_box_min_width" style="width: 100px; height: 100px;">
+<div id="box_sizing_content_box_min_width" style="width: 100px; height: 100px;">
  <div style="min-width: 50px; height: 25px; box-sizing: content-box; padding: 5px; border-width: 15px"></div>
  <div style="width: 25px; height: 25px"></div>
 </div>
@@ -90,7 +143,7 @@
  <div style="width: 25px; height: 25px"></div>
 </div>

-<div data-disabled="true" id="box_sizing_content_box_min_height" style="width: 100px; height: 100px;">
+<div id="box_sizing_content_box_min_height" style="width: 100px; height: 100px;">
  <div style="width: 50px; min-height: 50px; box-sizing: content-box; padding: 5px; border-width: 15px"></div>
  <div style="width: 25px; height: 25px"></div>
 </div>
@@ -100,7 +153,7 @@
  <div style="width: 25px; height: 25px"></div>
 </div>

-<div data-disabled="true" id="box_sizing_content_box_no_height_no_width" style="width: 100px; height: 100px;">
+<div id="box_sizing_content_box_no_height_no_width" style="width: 100px; height: 100px;">
  <div style="box-sizing: content-box; padding: 2px; border-width: 7px">
  </div>
 </div>
@@ -110,7 +163,7 @@
  </div>
 </div>

-<div data-disabled="true" id="box_sizing_content_box_nested"
+<div id="box_sizing_content_box_nested"
  style="width: 100px; height: 100px; box-sizing: content-box; padding: 15px; border-width: 3px;">
  <div style="width: 20px; height: 20px; box-sizing: content-box; padding: 2px; border-width: 7px">
    <div style="width: 10px; height: 5px; box-sizing: content-box; padding: 1px; border-width: 2px"></div>
@@ -124,7 +177,7 @@
  </div>
 </div>

-<div data-disabled="true" id="box_sizing_content_box_nested_alternating"
+<div id="box_sizing_content_box_nested_alternating"
  style="width: 100px; height: 100px; box-sizing: content-box; padding: 3px; border-width: 2px;">
  <div style="width: 40px; height: 40px; box-sizing: border-box; padding: 8px; border-width: 2px">
    <div style="width: 20px; height: 25px; box-sizing: content-box; padding: 3px; border-width: 6px">
@@ -134,7 +187,7 @@
  </div>
 </div>

-<div data-disabled="true" id="box_sizing_border_box_nested_alternating"
+<div id="box_sizing_border_box_nested_alternating"
  style="width: 100px; height: 100px; box-sizing: border-box; padding: 3px; border-width: 2px;">
  <div style="width: 40px; height: 40px; box-sizing: content-box; padding: 8px; border-width: 2px">
    <div style="width: 20px; height: 25px; box-sizing: border-box; padding: 3px; border-width: 6px">
@@ -143,3 +196,55 @@
    </div>
  </div>
 </div>
+
+<div data-disabled="true" id="box_sizing_content_box_flex_basis_row" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="flex-basis: 50px; height: 25px; padding: 5px; border-width: 10px; box-sizing: content-box">
+  </div>
+</div>
+
+<div id="box_sizing_border_box_flex_basis_row" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="flex-basis: 50px; height: 25px; padding: 5px; border-width: 10px; box-sizing: border-box">
+  </div>
+</div>
+
+<div data-disabled="true" id="box_sizing_content_box_flex_basis_column" style="width: 100px; height: 100px; flex-direction: column;">
+  <div style="flex-basis: 50px; height: 25px; padding: 5px; border-width: 10px; box-sizing: content-box">
+  </div>
+</div>
+
+<div id="box_sizing_border_box_flex_basis_column" style="width: 100px; height: 100px; flex-direction: column;">
+  <div style="flex-basis: 50px; height: 25px; padding: 5px; border-width: 10px; box-sizing: border-box">
+  </div>
+</div>
+
+<div id="box_sizing_content_box_padding_start"
+  style="width: 100px; height: 100px; padding-start: 5px; box-sizing: content-box">
+</div>
+
+<div id="box_sizing_border_box_padding_start"
+  style="width: 100px; height: 100px; padding-start: 5px; box-sizing: border-box">
+</div>
+
+<div id="box_sizing_content_box_padding_end"
+  style="width: 100px; height: 100px; padding-end: 5px; box-sizing: content-box">
+</div>
+
+<div id="box_sizing_border_box_padding_end"
+  style="width: 100px; height: 100px; padding-end: 5px; box-sizing: border-box">
+</div>
+
+<div id="box_sizing_content_box_border_start"
+  style="width: 100px; height: 100px; border-start-width: 5px; box-sizing: content-box">
+</div>
+
+<div id="box_sizing_border_box_border_start"
+  style="width: 100px; height: 100px; border-start-width: 5px; box-sizing: border-box">
+</div>
+
+<div id="box_sizing_content_box_border_end"
+  style="width: 100px; height: 100px; border-end-width: 5px; box-sizing: content-box">
+</div>
+
+<div id="box_sizing_border_box_border_end"
+  style="width: 100px; height: 100px; border-end-width: 5px; box-sizing: border-box">
+</div>
--- a/java/tests/generated/com/facebook/yoga/YGBoxSizingTest.java
+++ b/java/tests/generated/com/facebook/yoga/YGBoxSizingTest.java
--- a/javascript/tests/generated/YGBoxSizingTest.test.ts
+++ b/javascript/tests/generated/YGBoxSizingTest.test.ts
--- a/tests/YGMeasureTest.cpp
+++ b/tests/YGMeasureTest.cpp
@@ -899,3 +899,81 @@ TEST(YogaTest, percent_padding_and_percent_margin_with_measure_func) {

  YGConfigFree(config);
 }
+
+static YGSize _measure_half_width_height(
+    YGNodeConstRef node,
+    float width,
+    YGMeasureMode /*widthMode*/,
+    float height,
+    YGMeasureMode /*heightMode*/) {
+  int* measureCount = (int*)YGNodeGetContext(node);
+  if (measureCount != nullptr) {
+    (*measureCount)++;
+  }
+
+  return YGSize{0.5f * width, 0.5f * height};
+}
+
+TEST(YogaTest, measure_content_box) {
+  YGNodeRef root = YGNodeNew();
+  YGNodeStyleSetWidth(root, 100);
+  YGNodeStyleSetHeight(root, 200);
+  YGNodeStyleSetBoxSizing(root, YGBoxSizingContentBox);
+  YGNodeStyleSetPadding(root, YGEdgeAll, 5);
+  YGNodeStyleSetBorder(root, YGEdgeAll, 10);
+
+  int measureCount = 0;
+
+  YGNodeRef root_child0 = YGNodeNew();
+  YGNodeSetContext(root_child0, &measureCount);
+  YGNodeSetMeasureFunc(root_child0, _measure_half_width_height);
+  YGNodeInsertChild(root, root_child0, 0);
+
+  YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);
+
+  ASSERT_EQ(1, measureCount);
+
+  ASSERT_EQ(0, YGNodeLayoutGetLeft(root));
+  ASSERT_EQ(0, YGNodeLayoutGetTop(root));
+  ASSERT_EQ(130, YGNodeLayoutGetWidth(root));
+  ASSERT_EQ(230, YGNodeLayoutGetHeight(root));
+
+  ASSERT_EQ(15, YGNodeLayoutGetLeft(root_child0));
+  ASSERT_EQ(15, YGNodeLayoutGetTop(root_child0));
+  ASSERT_EQ(100, YGNodeLayoutGetWidth(root_child0));
+  ASSERT_EQ(100, YGNodeLayoutGetHeight(root_child0));
+
+  YGNodeFreeRecursive(root);
+}
+
+TEST(YogaTest, measure_border_box) {
+  YGNodeRef root = YGNodeNew();
+  YGNodeStyleSetWidth(root, 100);
+  YGNodeStyleSetHeight(root, 200);
+  YGNodeStyleSetBoxSizing(root, YGBoxSizingBorderBox);
+  YGNodeStyleSetPadding(root, YGEdgeAll, 5);
+  YGNodeStyleSetBorder(root, YGEdgeAll, 10);
+
+  int measureCount = 0;
+
+  YGNodeRef root_child0 = YGNodeNew();
+  YGNodeSetContext(root_child0, &measureCount);
+  YGNodeSetMeasureFunc(root_child0, _measure_half_width_height);
+  YGNodeInsertChild(root, root_child0, 0);
+
+  YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);
+
+  ASSERT_EQ(1, measureCount);
+
+  ASSERT_EQ(0, YGNodeLayoutGetLeft(root));
+  ASSERT_EQ(0, YGNodeLayoutGetTop(root));
+  ASSERT_EQ(100, YGNodeLayoutGetWidth(root));
+  ASSERT_EQ(200, YGNodeLayoutGetHeight(root));
+
+  ASSERT_EQ(15, YGNodeLayoutGetLeft(root_child0));
+  ASSERT_EQ(15, YGNodeLayoutGetTop(root_child0));
+  ASSERT_EQ(70, YGNodeLayoutGetWidth(root_child0));
+  ASSERT_EQ(85, YGNodeLayoutGetHeight(root_child0));
+
+  YGNodeFreeRecursive(root);
+}
--- a/tests/generated/YGBoxSizingTest.cpp
+++ b/tests/generated/YGBoxSizingTest.cpp
--- a/yoga/algorithm/AbsoluteLayout.cpp
+++ b/yoga/algorithm/AbsoluteLayout.cpp
@@ -324,8 +324,9 @@ void layoutAbsoluteChild(
      FlexDirection::Column, containingBlockWidth);

  if (child->hasDefiniteLength(Dimension::Width, containingBlockWidth)) {
-    childWidth = child->getResolvedDimension(Dimension::Width)
-                     .resolve(containingBlockWidth)
+    childWidth = child
+                     ->getResolvedDimension(
+                         direction, Dimension::Width, containingBlockWidth)
                     .unwrap() +
        marginRow;
  } else {
@@ -359,8 +360,9 @@ void layoutAbsoluteChild(
  }

  if (child->hasDefiniteLength(Dimension::Height, containingBlockHeight)) {
-    childHeight = child->getResolvedDimension(Dimension::Height)
-                      .resolve(containingBlockHeight)
+    childHeight = child
+                      ->getResolvedDimension(
+                          direction, Dimension::Height, containingBlockHeight)
                      .unwrap() +
        marginColumn;
  } else {
--- a/yoga/algorithm/BoundAxis.h
+++ b/yoga/algorithm/BoundAxis.h
@@ -29,6 +29,7 @@ inline float paddingAndBorderForAxis(

 inline FloatOptional boundAxisWithinMinAndMax(
    const yoga::Node* const node,
+    const Direction direction,
    const FlexDirection axis,
    const FloatOptional value,
    const float axisSize) {
@@ -36,11 +37,15 @@ inline FloatOptional boundAxisWithinMinAndMax(
  FloatOptional max;

  if (isColumn(axis)) {
-    min = node->style().minDimension(Dimension::Height).resolve(axisSize);
-    max = node->style().maxDimension(Dimension::Height).resolve(axisSize);
+    min = node->style().resolvedMinDimension(
+        direction, Dimension::Height, axisSize);
+    max = node->style().resolvedMaxDimension(
+        direction, Dimension::Height, axisSize);
  } else if (isRow(axis)) {
-    min = node->style().minDimension(Dimension::Width).resolve(axisSize);
-    max = node->style().maxDimension(Dimension::Width).resolve(axisSize);
+    min = node->style().resolvedMinDimension(
+        direction, Dimension::Width, axisSize);
+    max = node->style().resolvedMaxDimension(
+        direction, Dimension::Width, axisSize);
  }

  if (max >= FloatOptional{0} && value > max) {
@@ -64,7 +69,8 @@ inline float boundAxis(
    const float axisSize,
    const float widthSize) {
  return yoga::maxOrDefined(
-      boundAxisWithinMinAndMax(node, axis, FloatOptional{value}, axisSize)
+      boundAxisWithinMinAndMax(
+          node, direction, axis, FloatOptional{value}, axisSize)
          .unwrap(),
      paddingAndBorderForAxis(node, axis, direction, widthSize));
 }
--- a/yoga/algorithm/CalculateLayout.cpp
+++ b/yoga/algorithm/CalculateLayout.cpp
@@ -38,13 +38,14 @@ std::atomic<uint32_t> gCurrentGenerationCount(0);

 static void constrainMaxSizeForMode(
    const yoga::Node* node,
+    Direction direction,
    FlexDirection axis,
    float ownerAxisSize,
    float ownerWidth,
    /*in_out*/ SizingMode* mode,
    /*in_out*/ float* size) {
-  const FloatOptional maxSize =
-      node->style().maxDimension(dimension(axis)).resolve(ownerAxisSize) +
+  const FloatOptional maxSize = node->style().resolvedMaxDimension(
+                                    direction, dimension(axis), ownerAxisSize) +
      FloatOptional(node->style().computeMarginForAxis(axis, ownerWidth));
  switch (*mode) {
    case SizingMode::StretchFit:
@@ -110,7 +111,7 @@ static void computeFlexBasisForChild(
            child, FlexDirection::Row, direction, ownerWidth));

    child->setLayoutComputedFlexBasis(yoga::maxOrDefined(
-        child->getResolvedDimension(Dimension::Width).resolve(ownerWidth),
+        child->getResolvedDimension(direction, Dimension::Width, ownerWidth),
        paddingAndBorder));
  } else if (!isMainAxisRow && isColumnStyleDimDefined) {
    // The height is definite, so use that as the flex basis.
@@ -118,7 +119,7 @@ static void computeFlexBasisForChild(
        FloatOptional(paddingAndBorderForAxis(
            child, FlexDirection::Column, direction, ownerWidth));
    child->setLayoutComputedFlexBasis(yoga::maxOrDefined(
-        child->getResolvedDimension(Dimension::Height).resolve(ownerHeight),
+        child->getResolvedDimension(direction, Dimension::Height, ownerHeight),
        paddingAndBorder));
  } else {
    // Compute the flex basis and hypothetical main size (i.e. the clamped flex
@@ -132,16 +133,16 @@ static void computeFlexBasisForChild(
        child->style().computeMarginForAxis(FlexDirection::Column, ownerWidth);

    if (isRowStyleDimDefined) {
-      childWidth = child->getResolvedDimension(Dimension::Width)
-                       .resolve(ownerWidth)
-                       .unwrap() +
+      childWidth =
+          child->getResolvedDimension(direction, Dimension::Width, ownerWidth)
+              .unwrap() +
          marginRow;
      childWidthSizingMode = SizingMode::StretchFit;
    }
    if (isColumnStyleDimDefined) {
-      childHeight = child->getResolvedDimension(Dimension::Height)
-                        .resolve(ownerHeight)
-                        .unwrap() +
+      childHeight =
+          child->getResolvedDimension(direction, Dimension::Height, ownerHeight)
+              .unwrap() +
          marginColumn;
      childHeightSizingMode = SizingMode::StretchFit;
    }
@@ -216,6 +217,7 @@ static void computeFlexBasisForChild(

    constrainMaxSizeForMode(
        child,
+        direction,
        FlexDirection::Row,
        ownerWidth,
        ownerWidth,
@@ -223,6 +225,7 @@ static void computeFlexBasisForChild(
        &childWidth);
    constrainMaxSizeForMode(
        child,
+        direction,
        FlexDirection::Column,
        ownerHeight,
        ownerWidth,
@@ -469,6 +472,7 @@ static void zeroOutLayoutRecursively(yoga::Node* const node) {

 static float calculateAvailableInnerDimension(
    const yoga::Node* const node,
+    const Direction direction,
    const Dimension dimension,
    const float availableDim,
    const float paddingAndBorder,
@@ -480,13 +484,13 @@ static float calculateAvailableInnerDimension(
    // We want to make sure our available height does not violate min and max
    // constraints
    const FloatOptional minDimensionOptional =
-        node->style().minDimension(dimension).resolve(ownerDim);
+        node->style().resolvedMinDimension(direction, dimension, ownerDim);
    const float minInnerDim = minDimensionOptional.isUndefined()
        ? 0.0f
        : minDimensionOptional.unwrap() - paddingAndBorder;

    const FloatOptional maxDimensionOptional =
-        node->style().maxDimension(dimension).resolve(ownerDim);
+        node->style().resolvedMaxDimension(direction, dimension, ownerDim);

    const float maxInnerDim = maxDimensionOptional.isUndefined()
        ? FLT_MAX
@@ -536,7 +540,7 @@ static float computeFlexBasisForChildren(
  }

  for (auto child : children) {
-    child->resolveDimension();
+    child->processDimensions();
    if (child->style().display() == Display::None) {
      zeroOutLayoutRecursively(child);
      child->setHasNewLayout(true);
@@ -611,6 +615,7 @@ static float distributeFreeSpaceSecondPass(
  for (auto currentLineChild : flexLine.itemsInFlow) {
    childFlexBasis = boundAxisWithinMinAndMax(
                         currentLineChild,
+                         direction,
                         mainAxis,
                         currentLineChild->getLayout().computedFlexBasis,
                         mainAxisownerSize)
@@ -709,13 +714,14 @@ static float distributeFreeSpaceSecondPass(
          : SizingMode::FitContent;
    } else {
      childCrossSize =
-          currentLineChild->getResolvedDimension(dimension(crossAxis))
-              .resolve(availableInnerCrossDim)
+          currentLineChild
+              ->getResolvedDimension(
+                  direction, dimension(crossAxis), availableInnerCrossDim)
              .unwrap() +
          marginCross;
      const bool isLoosePercentageMeasurement =
-          currentLineChild->getResolvedDimension(dimension(crossAxis)).unit() ==
-              Unit::Percent &&
+          currentLineChild->getProcessedDimension(dimension(crossAxis))
+                  .unit() == Unit::Percent &&
          sizingModeCrossDim != SizingMode::StretchFit;
      childCrossSizingMode =
          yoga::isUndefined(childCrossSize) || isLoosePercentageMeasurement
@@ -725,6 +731,7 @@ static float distributeFreeSpaceSecondPass(

    constrainMaxSizeForMode(
        currentLineChild,
+        direction,
        mainAxis,
        availableInnerMainDim,
        availableInnerWidth,
@@ -732,6 +739,7 @@ static float distributeFreeSpaceSecondPass(
        &childMainSize);
    constrainMaxSizeForMode(
        currentLineChild,
+        direction,
        crossAxis,
        availableInnerCrossDim,
        availableInnerWidth,
@@ -812,6 +820,7 @@ static void distributeFreeSpaceFirstPass(
  for (auto currentLineChild : flexLine.itemsInFlow) {
    float childFlexBasis = boundAxisWithinMinAndMax(
                               currentLineChild,
+                               direction,
                               mainAxis,
                               currentLineChild->getLayout().computedFlexBasis,
                               mainAxisownerSize)
@@ -982,8 +991,9 @@ static void justifyMainAxis(
  if (sizingModeMainDim == SizingMode::FitContent &&
      flexLine.layout.remainingFreeSpace > 0) {
    if (style.minDimension(dimension(mainAxis)).isDefined() &&
-        style.minDimension(dimension(mainAxis))
-            .resolve(mainAxisownerSize)
+        style
+            .resolvedMinDimension(
+                direction, dimension(mainAxis), mainAxisownerSize)
            .isDefined()) {
      // This condition makes sure that if the size of main dimension(after
      // considering child nodes main dim, leading and trailing padding etc)
@@ -992,9 +1002,11 @@ static void justifyMainAxis(

      // `minAvailableMainDim` denotes minimum available space in which child
      // can be laid out, it will exclude space consumed by padding and border.
-      const float minAvailableMainDim = style.minDimension(dimension(mainAxis))
-                                            .resolve(mainAxisownerSize)
-                                            .unwrap() -
+      const float minAvailableMainDim =
+          style
+              .resolvedMinDimension(
+                  direction, dimension(mainAxis), mainAxisownerSize)
+              .unwrap() -
          leadingPaddingAndBorderMain - trailingPaddingAndBorderMain;
      const float occupiedSpaceByChildNodes =
          availableInnerMainDim - flexLine.layout.remainingFreeSpace;
@@ -1387,12 +1399,14 @@ static void calculateLayoutImpl(

  float availableInnerWidth = calculateAvailableInnerDimension(
      node,
+      direction,
      Dimension::Width,
      availableWidth - marginAxisRow,
      paddingAndBorderAxisRow,
      ownerWidth);
  float availableInnerHeight = calculateAvailableInnerDimension(
      node,
+      direction,
      Dimension::Height,
      availableHeight - marginAxisColumn,
      paddingAndBorderAxisColumn,
@@ -1480,16 +1494,20 @@ static void calculateLayoutImpl(
    if (sizingModeMainDim != SizingMode::StretchFit) {
      const auto& style = node->style();
      const float minInnerWidth =
-          style.minDimension(Dimension::Width).resolve(ownerWidth).unwrap() -
+          style.resolvedMinDimension(direction, Dimension::Width, ownerWidth)
+              .unwrap() -
          paddingAndBorderAxisRow;
      const float maxInnerWidth =
-          style.maxDimension(Dimension::Width).resolve(ownerWidth).unwrap() -
+          style.resolvedMaxDimension(direction, Dimension::Width, ownerWidth)
+              .unwrap() -
          paddingAndBorderAxisRow;
      const float minInnerHeight =
-          style.minDimension(Dimension::Height).resolve(ownerHeight).unwrap() -
+          style.resolvedMinDimension(direction, Dimension::Height, ownerHeight)
+              .unwrap() -
          paddingAndBorderAxisColumn;
      const float maxInnerHeight =
-          style.maxDimension(Dimension::Height).resolve(ownerHeight).unwrap() -
+          style.resolvedMaxDimension(direction, Dimension::Height, ownerHeight)
+              .unwrap() -
          paddingAndBorderAxisColumn;

      const float minInnerMainDim =
@@ -1688,6 +1706,7 @@ static void calculateLayoutImpl(
              SizingMode childCrossSizingMode = SizingMode::StretchFit;
              constrainMaxSizeForMode(
                  child,
+                  direction,
                  mainAxis,
                  availableInnerMainDim,
                  availableInnerWidth,
@@ -1695,6 +1714,7 @@ static void calculateLayoutImpl(
                  &childMainSize);
              constrainMaxSizeForMode(
                  child,
+                  direction,
                  crossAxis,
                  availableInnerCrossDim,
                  availableInnerWidth,
@@ -1781,8 +1801,8 @@ static void calculateLayoutImpl(
    const float unclampedCrossDim = sizingModeCrossDim == SizingMode::StretchFit
        ? availableInnerCrossDim + paddingAndBorderAxisCross
        : node->hasDefiniteLength(dimension(crossAxis), crossAxisownerSize)
-        ? node->getResolvedDimension(dimension(crossAxis))
-              .resolve(crossAxisownerSize)
+        ? node->getResolvedDimension(
+                  direction, dimension(crossAxis), crossAxisownerSize)
              .unwrap()
        : totalLineCrossDim + paddingAndBorderAxisCross;

@@ -2035,6 +2055,7 @@ static void calculateLayoutImpl(
                availableInnerMainDim + paddingAndBorderAxisMain,
                boundAxisWithinMinAndMax(
                    node,
+                    direction,
                    mainAxis,
                    FloatOptional{maxLineMainDim},
                    mainAxisownerSize)
@@ -2067,6 +2088,7 @@ static void calculateLayoutImpl(
                availableInnerCrossDim + paddingAndBorderAxisCross,
                boundAxisWithinMinAndMax(
                    node,
+                    direction,
                    crossAxis,
                    FloatOptional{
                        totalLineCrossDim + paddingAndBorderAxisCross},
@@ -2354,21 +2376,22 @@ void calculateLayout(
  // visit all dirty nodes at least once. Subsequent visits will be skipped if
  // the input parameters don't change.
  gCurrentGenerationCount.fetch_add(1, std::memory_order_relaxed);
-  node->resolveDimension();
+  node->processDimensions();
+  const Direction direction = node->resolveDirection(ownerDirection);
  float width = YGUndefined;
  SizingMode widthSizingMode = SizingMode::MaxContent;
  const auto& style = node->style();
  if (node->hasDefiniteLength(Dimension::Width, ownerWidth)) {
    width =
-        (node->getResolvedDimension(dimension(FlexDirection::Row))
-             .resolve(ownerWidth)
+        (node->getResolvedDimension(
+                 direction, dimension(FlexDirection::Row), ownerWidth)
             .unwrap() +
         node->style().computeMarginForAxis(FlexDirection::Row, ownerWidth));
    widthSizingMode = SizingMode::StretchFit;
-  } else if (style.maxDimension(Dimension::Width)
-                 .resolve(ownerWidth)
+  } else if (style.resolvedMaxDimension(direction, Dimension::Width, ownerWidth)
                 .isDefined()) {
-    width = style.maxDimension(Dimension::Width).resolve(ownerWidth).unwrap();
+    width = style.resolvedMaxDimension(direction, Dimension::Width, ownerWidth)
+                .unwrap();
    widthSizingMode = SizingMode::FitContent;
  } else {
    width = ownerWidth;
@@ -2380,16 +2403,18 @@ void calculateLayout(
  SizingMode heightSizingMode = SizingMode::MaxContent;
  if (node->hasDefiniteLength(Dimension::Height, ownerHeight)) {
    height =
-        (node->getResolvedDimension(dimension(FlexDirection::Column))
-             .resolve(ownerHeight)
+        (node->getResolvedDimension(
+                 direction, dimension(FlexDirection::Column), ownerHeight)
             .unwrap() +
         node->style().computeMarginForAxis(FlexDirection::Column, ownerWidth));
    heightSizingMode = SizingMode::StretchFit;
-  } else if (style.maxDimension(Dimension::Height)
-                 .resolve(ownerHeight)
+  } else if (style
+                 .resolvedMaxDimension(
+                     direction, Dimension::Height, ownerHeight)
                 .isDefined()) {
    height =
-        style.maxDimension(Dimension::Height).resolve(ownerHeight).unwrap();
+        style.resolvedMaxDimension(direction, Dimension::Height, ownerHeight)
+            .unwrap();
    heightSizingMode = SizingMode::FitContent;
  } else {
    height = ownerHeight;
--- a/yoga/algorithm/FlexLine.cpp
+++ b/yoga/algorithm/FlexLine.cpp
@@ -32,8 +32,9 @@ FlexLine calculateFlexLine(
  size_t firstElementInLineIndex = startOfLineIndex;

  float sizeConsumedIncludingMinConstraint = 0;
-  const FlexDirection mainAxis = resolveDirection(
-      node->style().flexDirection(), node->resolveDirection(ownerDirection));
+  const Direction direction = node->resolveDirection(ownerDirection);
+  const FlexDirection mainAxis =
+      resolveDirection(node->style().flexDirection(), direction);
  const bool isNodeFlexWrap = node->style().flexWrap() != Wrap::NoWrap;
  const float gap =
      node->style().computeGapForAxis(mainAxis, availableInnerMainDim);
@@ -67,6 +68,7 @@ FlexLine calculateFlexLine(
    const float flexBasisWithMinAndMaxConstraints =
        boundAxisWithinMinAndMax(
            child,
+            direction,
            mainAxis,
            child->getLayout().computedFlexBasis,
            mainAxisownerSize)
--- a/yoga/node/Node.cpp
+++ b/yoga/node/Node.cpp
@@ -43,7 +43,7 @@ Node::Node(Node&& node) noexcept
      owner_(node.owner_),
      children_(std::move(node.children_)),
      config_(node.config_),
-      resolvedDimensions_(node.resolvedDimensions_) {
+      processedDimensions_(node.processedDimensions_) {
  for (auto c : children_) {
    c->setOwner(this);
  }
@@ -292,14 +292,14 @@ Style::Length Node::resolveFlexBasisPtr() const {
  return value::ofAuto();
 }

-void Node::resolveDimension() {
+void Node::processDimensions() {
  for (auto dim : {Dimension::Width, Dimension::Height}) {
    if (style_.maxDimension(dim).isDefined() &&
        yoga::inexactEquals(
            style_.maxDimension(dim), style_.minDimension(dim))) {
-      resolvedDimensions_[yoga::to_underlying(dim)] = style_.maxDimension(dim);
+      processedDimensions_[yoga::to_underlying(dim)] = style_.maxDimension(dim);
    } else {
-      resolvedDimensions_[yoga::to_underlying(dim)] = style_.dimension(dim);
+      processedDimensions_[yoga::to_underlying(dim)] = style_.dimension(dim);
    }
  }
 }
--- a/yoga/node/Node.h
+++ b/yoga/node/Node.h
@@ -86,7 +86,7 @@ class YG_EXPORT Node : public ::YGNode {
   * https://www.w3.org/TR/css-sizing-3/#definite
   */
  inline bool hasDefiniteLength(Dimension dimension, float ownerSize) {
-    auto usedValue = getResolvedDimension(dimension).resolve(ownerSize);
+    auto usedValue = getProcessedDimension(dimension).resolve(ownerSize);
    return usedValue.isDefined() && usedValue.unwrap() >= 0.0f;
  }

@@ -152,12 +152,27 @@ class YG_EXPORT Node : public ::YGNode {
    return isDirty_;
  }

-  std::array<Style::Length, 2> getResolvedDimensions() const {
-    return resolvedDimensions_;
+  Style::Length getProcessedDimension(Dimension dimension) const {
+    return processedDimensions_[static_cast<size_t>(dimension)];
  }

-  Style::Length getResolvedDimension(Dimension dimension) const {
-    return resolvedDimensions_[static_cast<size_t>(dimension)];
+  FloatOptional getResolvedDimension(
+      Direction direction,
+      Dimension dimension,
+      float referenceLength) const {
+    FloatOptional value =
+        getProcessedDimension(dimension).resolve(referenceLength);
+    if (style_.boxSizing() == BoxSizing::BorderBox) {
+      return value;
+    }
+
+    FloatOptional dimensionPaddingAndBorder =
+        FloatOptional{style_.computePaddingAndBorderForDimension(
+            direction, dimension, referenceLength)};
+
+    return value +
+        (dimensionPaddingAndBorder.isDefined() ? dimensionPaddingAndBorder
+                                               : FloatOptional{0.0});
  }

  // Setters
@@ -233,7 +248,7 @@ class YG_EXPORT Node : public ::YGNode {

  // Other methods
  Style::Length resolveFlexBasisPtr() const;
-  void resolveDimension();
+  void processDimensions();
  Direction resolveDirection(Direction ownerDirection);
  void clearChildren();
  /// Replaces the occurrences of oldChild with newChild
@@ -280,7 +295,7 @@ class YG_EXPORT Node : public ::YGNode {
  Node* owner_ = nullptr;
  std::vector<Node*> children_;
  const Config* config_;
-  std::array<Style::Length, 2> resolvedDimensions_{
+  std::array<Style::Length, 2> processedDimensions_{
      {value::undefined(), value::undefined()}};
 };

--- a/yoga/style/Style.h
+++ b/yoga/style/Style.h
@@ -189,6 +189,23 @@ class YG_EXPORT Style {
    pool_.store(minDimensions_[yoga::to_underlying(axis)], value);
  }

+  FloatOptional resolvedMinDimension(
+      Direction direction,
+      Dimension axis,
+      float referenceLength) const {
+    FloatOptional value = minDimension(axis).resolve(referenceLength);
+    if (boxSizing() == BoxSizing::BorderBox) {
+      return value;
+    }
+
+    FloatOptional dimensionPaddingAndBorder = FloatOptional{
+        computePaddingAndBorderForDimension(direction, axis, referenceLength)};
+
+    return value +
+        (dimensionPaddingAndBorder.isDefined() ? dimensionPaddingAndBorder
+                                               : FloatOptional{0.0});
+  }
+
  Style::Length maxDimension(Dimension axis) const {
    return pool_.getLength(maxDimensions_[yoga::to_underlying(axis)]);
  }
@@ -196,6 +213,23 @@ class YG_EXPORT Style {
    pool_.store(maxDimensions_[yoga::to_underlying(axis)], value);
  }

+  FloatOptional resolvedMaxDimension(
+      Direction direction,
+      Dimension axis,
+      float referenceLength) const {
+    FloatOptional value = maxDimension(axis).resolve(referenceLength);
+    if (boxSizing() == BoxSizing::BorderBox) {
+      return value;
+    }
+
+    FloatOptional dimensionPaddingAndBorder = FloatOptional{
+        computePaddingAndBorderForDimension(direction, axis, referenceLength)};
+
+    return value +
+        (dimensionPaddingAndBorder.isDefined() ? dimensionPaddingAndBorder
+                                               : FloatOptional{0.0});
+  }
+
  FloatOptional aspectRatio() const {
    return pool_.getNumber(aspectRatio_);
  }
@@ -446,6 +480,20 @@ class YG_EXPORT Style {
        computeFlexEndBorder(axis, direction);
  }

+  float computePaddingAndBorderForDimension(
+      Direction direction,
+      Dimension dimension,
+      float widthSize) const {
+    FlexDirection flexDirectionForDimension = dimension == Dimension::Width
+        ? FlexDirection::Row
+        : FlexDirection::Column;
+
+    return computeFlexStartPaddingAndBorder(
+               flexDirectionForDimension, direction, widthSize) +
+        computeFlexEndPaddingAndBorder(
+               flexDirectionForDimension, direction, widthSize);
+  }
+
  float computeBorderForAxis(FlexDirection axis) const {
    return computeInlineStartBorder(axis, Direction::LTR) +
        computeInlineEndBorder(axis, Direction::LTR);