tawasuyu/taffy

diff --git a/scripts/gentest/src/main.rs b/scripts/gentest/src/main.rs
index f2a5f76c3..a6ee2978d 100644
--- a/scripts/gentest/src/main.rs
+++ b/scripts/gentest/src/main.rs
@@ -43,11 +43,13 @@ fn main() {
     let fixtures = fs::read_dir(fixtures_root).unwrap();
     for fixture in fixtures {
         let fixture_path = fixture.unwrap().path();
-        let name = fixture_path.file_stem().unwrap().to_str().unwrap();
+        if fixture_path.is_file() {
+            let name = fixture_path.file_stem().unwrap().to_str().unwrap();
 
-        driver.navigate(&format!("file://{}", fixture_path.display()));
-        let root_element = driver.query_element(Selector::CSS, "#test-root").unwrap();
-        src.push_str(&format!("{}\n", generate_test(&name, root_element)));
+            driver.navigate(&format!("file://{}", fixture_path.display()));
+            let root_element = driver.query_element(Selector::CSS, "#test-root").unwrap();
+            src.push_str(&format!("{}\n", generate_test(&name, root_element)));
+        }
     }
     
     src.push_str("}\n");
@@ -107,7 +109,7 @@ fn generate_node(node: &json::JsonValue) -> String {
     let style = &node["style"];
 
     match style["position"] {
-        json::JsonValue::String(ref value) => {
+        json::JsonValue::Short(ref value) => {
             match value.as_ref() {
                 "absolute" => src.push_str("position: stretch::style::Position::Absolute,\n"),
                 _ => (),
@@ -117,7 +119,7 @@ fn generate_node(node: &json::JsonValue) -> String {
     };
 
     match style["direction"] {
-        json::JsonValue::String(ref value) => {
+        json::JsonValue::Short(ref value) => {
             match value.as_ref() {
                 "rtl" => src.push_str("direction: stretch::style::Direction::RTL,\n"),
                 "ltr" => src.push_str("direction: stretch::style::Direction::LTR,\n"),
@@ -128,7 +130,7 @@ fn generate_node(node: &json::JsonValue) -> String {
     };
 
     match style["flexDirection"] {
-        json::JsonValue::String(ref value) => {
+        json::JsonValue::Short(ref value) => {
             match value.as_ref() {
                 "row-reverse" => src.push_str("flex_direction: stretch::style::FlexDirection::RowReverse,\n"),
                 "column" => src.push_str("flex_direction: stretch::style::FlexDirection::Column,\n"),
@@ -140,7 +142,7 @@ fn generate_node(node: &json::JsonValue) -> String {
     };
 
     match style["wrap"] {
-        json::JsonValue::String(ref value) => {
+        json::JsonValue::Short(ref value) => {
             match value.as_ref() {
                 "wrap" => src.push_str("wrap: stretch::style::Wrap::Wrap,\n"),
                 "wrap-reverse" => src.push_str("wrap: stretch::style::Wrap::WrapReverse,\n"),
@@ -151,7 +153,7 @@ fn generate_node(node: &json::JsonValue) -> String {
     };
 
     match style["overflow"] {
-        json::JsonValue::String(ref value) => {
+        json::JsonValue::Short(ref value) => {
             match value.as_ref() {
                 "hidden" => src.push_str("overflow: stretch::style::Overflow::Hidden,\n"),
                 "scroll" => src.push_str("overflow: stretch::style::Overflow::Scroll,\n"),
@@ -162,7 +164,7 @@ fn generate_node(node: &json::JsonValue) -> String {
     };
 
     match style["alignItems"] {
-        json::JsonValue::String(ref value) => {
+        json::JsonValue::Short(ref value) => {
             match value.as_ref() {
                 "flex-start" => src.push_str("align_items: stretch::style::AlignItems::FlexStart,\n"),
                 "flex-end" => src.push_str("align_items: stretch::style::AlignItems::FlexEnd,\n"),
@@ -175,7 +177,7 @@ fn generate_node(node: &json::JsonValue) -> String {
     };
 
     match style["alignSelf"] {
-        json::JsonValue::String(ref value) => {
+        json::JsonValue::Short(ref value) => {
             match value.as_ref() {
                 "flex-start" => src.push_str("align_self: stretch::style::AlignSelf::FlexStart,\n"),
                 "flex-end" => src.push_str("align_self: stretch::style::AlignSelf::FlexEnd,\n"),
@@ -189,7 +191,7 @@ fn generate_node(node: &json::JsonValue) -> String {
     };
 
     match style["alignContent"] {
-        json::JsonValue::String(ref value) => {
+        json::JsonValue::Short(ref value) => {
             match value.as_ref() {
                 "flex-start" => src.push_str("align_content: stretch::style::AlignContent::FlexStart,\n"),
                 "flex-end" => src.push_str("align_content: stretch::style::AlignContent::FlexEnd,\n"),
@@ -203,7 +205,7 @@ fn generate_node(node: &json::JsonValue) -> String {
     };
 
     match style["justifyContent"] {
-        json::JsonValue::String(ref value) => {
+        json::JsonValue::Short(ref value) => {
             match value.as_ref() {
                 "flex-end" => src.push_str("justify_content: stretch::style::JustifyContent::FlexEnd,\n"),
                 "center" => src.push_str("justify_content: stretch::style::JustifyContent::Center,\n"),
@@ -217,12 +219,18 @@ fn generate_node(node: &json::JsonValue) -> String {
     };
 
     match style["flexGrow"] {
-        json::JsonValue::Number(value) => src.push_str(&format!("flex_grow: {:.1},\n", value)),
+        json::JsonValue::Number(value) => {
+            let value: f32 = value.into();
+            src.push_str(&format!("flex_grow: {:.1},\n", value))
+        },
         _ => (),
     };
 
     match style["flexShrink"] {
-        json::JsonValue::Number(value) => src.push_str(&format!("flex_shrink: {:.1},\n", value)),
+        json::JsonValue::Number(value) => {
+            let value: f32 = value.into();
+            src.push_str(&format!("flex_shrink: {:.1},\n", value))
+        },
         _ => (),
     };
 
@@ -298,11 +306,13 @@ fn generate_node(node: &json::JsonValue) -> String {
 
     match node["children"] {
         json::JsonValue::Array(ref value) => {
-            src.push_str("children: vec![\n");
-            value.iter().for_each(|child| {
-                src.push_str(&format!("{},\n", generate_node(child)));
-            });
-            src.push_str("],\n");
+            if value.len() > 0 {
+                src.push_str("children: vec![\n");
+                value.iter().for_each(|child| {
+                    src.push_str(&format!("{},\n", generate_node(child)));
+                });
+                src.push_str("],\n");
+            }
         },
         _ => (),
     };
@@ -316,10 +326,17 @@ fn generate_dimension(dimen: &json::object::Object) -> String {
     let unit = dimen.get("unit").unwrap();
     let value = || dimen.get("value").unwrap().as_f32().unwrap();
 
-    if unit == "auto" { format!("stretch::style::Dimension::Auto") }
-    else if unit == "points" { format!("stretch::style::Dimension::Points({:.1})", value()) }
-    else if unit == "percent" { format!("stretch::style::Dimension::Percent({:.1})", value()) }
-    else { panic!() }
+    match unit {
+        json::JsonValue::Short(ref unit) => {
+            match unit.as_ref() {
+                "auto" => format!("stretch::style::Dimension::Auto"),
+                "points" => format!("stretch::style::Dimension::Points({:.1})", value()),
+                "percent" => format!("stretch::style::Dimension::Percent({:.1})", value()),
+                _ => panic!(),
+            }
+        },
+        _ => panic!(),
+    }
 }
 
 fn generate_edges(dimen: &json::object::Object) -> String {
diff --git a/scripts/gentest/test_helper.js b/scripts/gentest/test_helper.js
index 270c9e3f7..b92ac0a73 100644
--- a/scripts/gentest/test_helper.js
+++ b/scripts/gentest/test_helper.js
@@ -105,10 +105,10 @@ function describeElement(e) {
       }),
 
       border: parseEdges({
-        start: e.style.borderLeft,
-        end: e.style.borderRight,
-        top: e.style.borderTop,
-        bottom: e.style.borderBottom,
+        start: e.style.borderLeftWidth,
+        end: e.style.borderRightWidth,
+        top: e.style.borderTopWidth,
+        bottom: e.style.borderBottomWidth,
       }),
 
       start: parseDimension(e.style.left),
@@ -120,8 +120,8 @@ function describeElement(e) {
     layout: {
       width: e.offsetWidth,
       height: e.offsetHeight,
-      x: e.offsetLeft,
-      y: e.offsetTop,
+      x: e.offsetLeft + e.parentNode.clientLeft,
+      y: e.offsetTop + e.parentNode.clientTop,
     },
 
     children: Array.from(e.children).map(c => describeElement(c)),
diff --git a/src/algo.rs b/src/algo.rs
index e66a70ae9..3cfb8e92d 100644
--- a/src/algo.rs
+++ b/src/algo.rs
@@ -5,8 +5,24 @@ use style;
 
 #[derive(Debug, Copy, Clone)]
 struct FlexSize {
-    main: f32,
-    cross: f32,
+    width: f32,
+    height: f32,
+}
+
+impl FlexSize {
+    fn main(&self, direction: style::FlexDirection) -> f32 {
+        match direction {
+            style::FlexDirection::Row | style::FlexDirection::RowReverse => self.width,
+            style::FlexDirection::Column | style::FlexDirection::ColumnReverse => self.height,
+        }
+    }
+
+    fn cross(&self, direction: style::FlexDirection) -> f32 {
+        match direction {
+            style::FlexDirection::Row | style::FlexDirection::RowReverse => self.height,
+            style::FlexDirection::Column | style::FlexDirection::ColumnReverse => self.width,
+        }
+    }
 }
 
 #[derive(Debug, Copy, Clone)]
@@ -25,21 +41,21 @@ impl SizeConstraint {
 
     fn undefined() -> SizeConstraint {
         SizeConstraint {
-            min: f32::NEG_INFINITY,
-            max: f32::INFINITY,
+            min: f32::NAN,
+            max: f32::NAN,
         }
     }
 
     fn at_least(size: f32) -> SizeConstraint {
         SizeConstraint {
             min: size,
-            max: f32::NEG_INFINITY,
+            max: f32::NAN,
         }
     }
 
     fn at_most(size: f32) -> SizeConstraint {
         SizeConstraint {
-            min: f32::NEG_INFINITY,
+            min: f32::NAN,
             max: size,
         }
     }
@@ -54,6 +70,7 @@ struct FlexItem<'a> {
 
     // temporary values for main size determination
     flex_basis: f32,
+    inner_flex_basis: f32,
     hypothetical_inner_main_size: f32,
     hypothetical_outer_main_size: f32,
     target_main_size: f32,
@@ -96,16 +113,8 @@ pub fn compute(root: &style::Node) -> layout::Node {
     );
 
     layout::Node {
-        width: if root.flex_direction.is_row() {
-            result.size.main
-        } else {
-            result.size.cross
-        },
-        height: if root.flex_direction.is_column() {
-            result.size.main
-        } else {
-            result.size.cross
-        },
+        width: result.size.width,
+        height: result.size.height,
         x: 0.0,
         y: 0.0,
         children: result.children,
@@ -114,9 +123,87 @@ pub fn compute(root: &style::Node) -> layout::Node {
 
 fn compute_internal(
     node: &style::Node,
-    main: SizeConstraint,
-    cross: SizeConstraint,
+    width_constraint: SizeConstraint,
+    height_constraint: SizeConstraint,
 ) -> ComputeResult {
+    // Define some general constants we will need for the remainder
+    // of the algorithm.
+
+    let (main_constraint, cross_constraint) = if node.flex_direction.is_row() {
+        (width_constraint, height_constraint)
+    } else {
+        (height_constraint, width_constraint)
+    };
+
+    let (intrinsic_main_size, intrinsic_cross_size) = (
+        node.main_size(node.flex_direction)
+            .resolve(main_constraint.max, f32::NAN),
+        node.cross_size(node.flex_direction)
+            .resolve(cross_constraint.max, f32::NAN),
+    );
+
+    let (margin_main_start, margin_cross_start) = (
+        node.main_margin_start(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+        node.cross_margin_start(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+    );
+
+    let (margin_main_end, margin_cross_end) = (
+        node.main_margin_end(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+        node.cross_margin_end(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+    );
+
+    let (margin_main, margin_cross) = (
+        margin_main_start + margin_main_end,
+        margin_cross_start + margin_cross_end,
+    );
+
+    let (padding_main_start, padding_cross_start) = (
+        node.main_padding_start(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+        node.cross_padding_start(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+    );
+
+    let (padding_main_end, padding_cross_end) = (
+        node.main_padding_end(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+        node.cross_padding_end(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+    );
+
+    let (padding_main, padding_cross) = (
+        padding_main_start + padding_main_end,
+        padding_cross_start + padding_cross_end,
+    );
+
+    let (border_main_start, border_cross_start) = (
+        node.main_border_start(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+        node.cross_border_start(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+    );
+
+    let (border_main_end, border_cross_end) = (
+        node.main_border_end(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+        node.cross_border_end(node.flex_direction)
+            .resolve(main_constraint.max, 0.0),
+    );
+
+    let (border_main, border_cross) = (
+        border_main_start + border_main_end,
+        border_cross_start + border_cross_end,
+    );
+
+    let (inner_intrinsic_main_size, inner_intrinsic_cross_size) = (
+        intrinsic_main_size - padding_main - border_main,
+        intrinsic_cross_size - padding_cross - border_cross,
+    );
+
     // 9.2. Line Length Determination
 
     // 1. Generate anonymous flex items as described in §4 Flex Items.
@@ -128,6 +215,7 @@ fn compute_internal(
             node: child,
 
             flex_basis: 0.0,
+            inner_flex_basis: 0.0,
             hypothetical_inner_main_size: 0.0,
             hypothetical_outer_main_size: 0.0,
             target_main_size: 0.0,
@@ -155,29 +243,23 @@ fn compute_internal(
     //    margin, border, and padding from the space available to the flex container
     //    in that dimension and use that value. This might result in an infinite value.
 
-    let avaliable_main = node.main_size().resolve(main.max, {
-        main.max
-            - node.main_margin_start().resolve(main.max, 0.0)
-            - node.main_margin_end().resolve(main.max, 0.0)
-    }) - node.main_padding_start().resolve(main.max, 0.0)
-        - node.main_padding_end().resolve(main.max, 0.0)
-        - node.main_border_start().resolve(main.max, 0.0)
-        - node.main_border_end().resolve(main.max, 0.0);
-
-    let avaliable_cross = node.cross_size().resolve(cross.max, {
-        cross.max
-            - node.cross_margin_start().resolve(cross.max, 0.0)
-            - node.cross_margin_end().resolve(cross.max, 0.0)
-    }) - node.cross_padding_start().resolve(cross.max, 0.0)
-        - node.cross_padding_end().resolve(cross.max, 0.0)
-        - node.cross_border_start().resolve(cross.max, 0.0)
-        - node.cross_border_end().resolve(cross.max, 0.0);
+    let avaliable_main = node
+        .main_size(node.flex_direction)
+        .resolve(main_constraint.max, main_constraint.max - margin_main)
+        - padding_main
+        - border_main;
+
+    let avaliable_cross = node
+        .cross_size(node.flex_direction)
+        .resolve(cross_constraint.max, cross_constraint.max - margin_cross)
+        - padding_cross
+        - border_cross;
 
     // 3. Determine the flex base size and hypothetical main size of each item:
     for child in &mut flex_items {
         // A. If the item has a definite used flex basis, that’s the flex base size.
 
-        let flex_basis = child.node.flex_basis.resolve(avaliable_main, f32::INFINITY);
+        let flex_basis = child.node.flex_basis.resolve(avaliable_main, f32::NAN);
         if flex_basis.is_finite() {
             child.flex_basis = flex_basis;
             continue;
@@ -189,9 +271,12 @@ fn compute_internal(
         //    cross size and the flex item’s intrinsic aspect ratio.
 
         if let Some(ratio) = child.node.aspect_ratio {
-            let cross_size = node.cross_size().resolve(avaliable_cross, f32::INFINITY);
+            let cross_size = child
+                .node
+                .cross_size(node.flex_direction)
+                .resolve(avaliable_cross, f32::NAN);
 
-            if cross_size.is_finite() && child.node.flex_basis == style::Dimension::Auto {
+            if intrinsic_cross_size.is_finite() && child.node.flex_basis == style::Dimension::Auto {
                 child.flex_basis = ratio * cross_size;
                 continue;
             }
@@ -203,9 +288,21 @@ fn compute_internal(
         //    size the item under that constraint. The flex base size is the item’s
         //    resulting main size.
 
-        if main.min.is_finite() || main.max.is_finite() {
-            let size = compute_internal(child.node, main, cross).size;
-            child.flex_basis = size.main;
+        if main_constraint.min.is_finite() || main_constraint.max.is_finite() {
+            let size = compute_internal(
+                child.node,
+                if node.flex_direction.is_row() {
+                    main_constraint
+                } else {
+                    SizeConstraint::undefined()
+                },
+                if node.flex_direction.is_column() {
+                    main_constraint
+                } else {
+                    SizeConstraint::undefined()
+                },
+            ).size;
+            child.flex_basis = size.main(node.flex_direction);
             continue;
         }
 
@@ -215,13 +312,13 @@ fn compute_internal(
         //    for a box in an orthogonal flow [CSS3-WRITING-MODES]. The flex base size
         //    is the item’s max-content main size.
 
-        if avaliable_main.is_infinite() {
+        if avaliable_main.is_nan() {
             let size = compute_internal(
                 child.node,
                 SizeConstraint::undefined(),
                 SizeConstraint::undefined(),
             ).size;
-            child.flex_basis = size.main;
+            child.flex_basis = size.main(node.flex_direction);
             continue;
         }
 
@@ -234,25 +331,66 @@ fn compute_internal(
 
         let size = compute_internal(
             child.node,
-            SizeConstraint::at_most(avaliable_main),
-            SizeConstraint::at_most(avaliable_cross),
+            if node.flex_direction.is_row() {
+                SizeConstraint::at_most(avaliable_main)
+            } else {
+                SizeConstraint::at_most(avaliable_cross)
+            },
+            if node.flex_direction.is_column() {
+                SizeConstraint::at_most(avaliable_main)
+            } else {
+                SizeConstraint::at_most(avaliable_cross)
+            },
         ).size;
-        child.flex_basis = size.main;
+        child.flex_basis = size.main(node.flex_direction);
     }
 
     // The hypothetical main size is the item’s flex base size clamped according to its
     // used min and max main sizes (and flooring the content box size at zero).
 
     for child in &mut flex_items {
+        let padding_start = child
+            .node
+            .main_padding_start(node.flex_direction)
+            .resolve(avaliable_main, 0.0);
+        let padding_end = child
+            .node
+            .main_padding_end(node.flex_direction)
+            .resolve(avaliable_main, 0.0);
+        let border_start = child
+            .node
+            .main_border_start(node.flex_direction)
+            .resolve(avaliable_main, 0.0);
+        let border_end = child
+            .node
+            .main_border_end(node.flex_direction)
+            .resolve(avaliable_main, 0.0);
+        child.inner_flex_basis =
+            child.flex_basis - (padding_start + padding_end + border_start + border_end);
+
         child.hypothetical_inner_main_size = child
             .flex_basis
-            .max(child.node.min_main_size().resolve(avaliable_main, f32::MIN))
-            .min(child.node.max_main_size().resolve(avaliable_main, f32::MAX))
-            .max(0.0);
+            .max(
+                child
+                    .node
+                    .min_main_size(node.flex_direction)
+                    .resolve(avaliable_main, f32::MIN),
+            ).min(
+                child
+                    .node
+                    .max_main_size(node.flex_direction)
+                    .resolve(avaliable_main, f32::MAX),
+            ).max(0.0);
 
         child.hypothetical_outer_main_size = child.hypothetical_inner_main_size
-            + child.node.main_margin_start().resolve(avaliable_main, 0.0)
-            + child.node.main_margin_end().resolve(avaliable_main, 0.0);
+            + child
+                .node
+                .main_margin_start(node.flex_direction)
+                .resolve(avaliable_main, 0.0)
+            + child
+                .node
+                .main_margin_end(node.flex_direction)
+                .resolve(avaliable_main, 0.0);
     }
 
     // 9.3. Main Size Determination
@@ -356,8 +494,14 @@ fn compute_internal(
             .items
             .iter()
             .map(|child| {
-                child.node.main_margin_start().resolve(avaliable_main, 0.0)
-                    + child.node.main_margin_end().resolve(avaliable_main, 0.0)
+                child
+                    .node
+                    .main_margin_start(node.flex_direction)
+                    .resolve(avaliable_main, 0.0)
+                    + child
+                        .node
+                        .main_margin_end(node.flex_direction)
+                        .resolve(avaliable_main, 0.0)
                     + if child.frozen {
                         child.target_main_size
                     } else {
@@ -396,8 +540,14 @@ fn compute_internal(
 
             let used_space: f32 = Iterator::chain(frozen.iter(), unfrozen.iter())
                 .map(|child| {
-                    child.node.main_margin_start().resolve(avaliable_main, 0.0)
-                        + child.node.main_margin_end().resolve(avaliable_main, 0.0)
+                    child
+                        .node
+                        .main_margin_start(node.flex_direction)
+                        .resolve(avaliable_main, 0.0)
+                        + child
+                            .node
+                            .main_margin_end(node.flex_direction)
+                            .resolve(avaliable_main, 0.0)
                         + if child.frozen {
                             child.target_main_size
                         } else {
@@ -435,15 +585,23 @@ fn compute_internal(
             //    - Otherwise
             //        Do Nothing
 
-            if free_space > 0.0 && growing {
+            if free_space > 0.0 && growing && sum_flex_grow > 0.0 {
                 for child in &mut unfrozen {
                     child.target_main_size =
                         child.flex_basis + free_space * (child.node.flex_grow / sum_flex_grow);
                 }
-            } else if free_space < 0.0 && shrinking {
+            } else if free_space < 0.0 && shrinking && sum_flex_shrink > 0.0 {
+                let sum_scaled_shrink_factor: f32 = unfrozen
+                    .iter()
+                    .map(|child| child.inner_flex_basis * child.node.flex_shrink)
+                    .sum();
+
                 for child in &mut unfrozen {
-                    child.target_main_size =
-                        child.flex_basis + free_space * (child.node.flex_shrink / sum_flex_shrink);
+                    let scaled_shrink_factor = child.inner_flex_basis * child.node.flex_shrink;
+                    child.target_main_size = child.flex_basis
+                        + free_space * (scaled_shrink_factor / sum_scaled_shrink_factor);
+
+                    println!("child.flex_basis: {}, scaled_shrink_factor: {}, sum_scaled_shrink_factor: {}, child.inner_flex_basis: {}", child.flex_basis, scaled_shrink_factor, sum_scaled_shrink_factor, child.inner_flex_basis);
                 }
             }
 
@@ -454,10 +612,13 @@ fn compute_internal(
 
             let mut total_violation = 0.0;
             for child in &mut unfrozen {
-                let max = child.node.max_main_size().resolve(avaliable_main, f32::MAX);
+                let max = child
+                    .node
+                    .max_main_size(node.flex_direction)
+                    .resolve(avaliable_main, f32::MAX);
                 let min = child
                     .node
-                    .min_main_size()
+                    .min_main_size(node.flex_direction)
                     .resolve(avaliable_main, f32::MIN)
                     .max(0.0);
 
@@ -485,11 +646,11 @@ fn compute_internal(
 
             if total_violation > 0.0 {
                 for child in &mut unfrozen {
-                    child.frozen = child.violation < 0.0;
+                    child.frozen = child.violation > 0.0;
                 }
             } else if total_violation < 0.0 {
                 for child in &mut unfrozen {
-                    child.frozen = child.violation > 0.0;
+                    child.frozen = child.violation < 0.0;
                 }
             } else {
                 for child in &mut unfrozen {
@@ -502,8 +663,10 @@ fn compute_internal(
     }
 
     // Not part of the spec from what i can see but seems correct
-    let container_main_size = if avaliable_main.is_finite() {
-        avaliable_main
+    let container_main_size = if intrinsic_main_size.is_finite() {
+        intrinsic_main_size
+            .min(main_constraint.max)
+            .max(main_constraint.min)
     } else {
         let mut longest_line = f32::MIN;
 
@@ -517,10 +680,10 @@ fn compute_internal(
             };
         }
 
-        longest_line
-    }.min(main.max)
-    .max(main.min)
-    .max(0.0);
+        (longest_line + padding_main + border_main)
+            .min(main_constraint.max)
+            .max(main_constraint.min)
+    };
 
     // 9.4. Cross Size Determination
 
@@ -531,27 +694,41 @@ fn compute_internal(
         for child in &mut line.items {
             let size = compute_internal(
                 child.node,
-                SizeConstraint::exactly(child.target_main_size),
-                SizeConstraint::between(cross.min, avaliable_cross),
+                if node.flex_direction.is_row() {
+                    SizeConstraint::exactly(child.target_main_size)
+                } else {
+                    SizeConstraint::between(cross_constraint.min, avaliable_cross)
+                },
+                if node.flex_direction.is_column() {
+                    SizeConstraint::exactly(child.target_main_size)
+                } else {
+                    SizeConstraint::between(cross_constraint.min, avaliable_cross)
+                },
             ).size;
 
             child.hypothetical_inner_cross_size = size
-                .cross
+                .cross(node.flex_direction)
                 .max(
                     child
                         .node
-                        .min_cross_size()
+                        .min_cross_size(node.flex_direction)
                         .resolve(avaliable_cross, f32::MIN),
                 ).min(
                     child
                         .node
-                        .max_cross_size()
+                        .max_cross_size(node.flex_direction)
                         .resolve(avaliable_cross, f32::MAX),
                 ).max(0.0);
 
             child.hypothetical_outer_cross_size = child.hypothetical_inner_cross_size
-                + node.cross_margin_start().resolve(avaliable_cross, 0.0)
-                + node.cross_margin_end().resolve(avaliable_cross, 0.0);
+                + child
+                    .node
+                    .cross_margin_start(node.flex_direction)
+                    .resolve(avaliable_cross, 0.0)
+                + child
+                    .node
+                    .cross_margin_end(node.flex_direction)
+                    .resolve(avaliable_cross, 0.0);
         }
     }
 
@@ -573,8 +750,10 @@ fn compute_internal(
     //    the container’s computed min and max cross sizes. Note that if CSS 2.1’s definition
     //    of min/max-width/height applied more generally, this behavior would fall out automatically.
 
-    if flex_lines.len() == 1 && avaliable_cross.is_finite() {
-        flex_lines[0].cross_size = avaliable_cross.min(cross.max).max(cross.min);
+    if flex_lines.len() == 1 && intrinsic_cross_size.is_finite() {
+        flex_lines[0].cross_size = inner_intrinsic_cross_size
+            .min(cross_constraint.max)
+            .max(cross_constraint.min);
     } else {
         for line in &mut flex_lines {
             // TODO handle baseline (1)
@@ -593,11 +772,11 @@ fn compute_internal(
     //    by equal amounts such that the sum of their cross sizes exactly equals the
     //    flex container’s inner cross size.
 
-    if node.align_content == style::AlignContent::Stretch && avaliable_cross.is_finite() {
+    if node.align_content == style::AlignContent::Stretch && intrinsic_cross_size.is_finite() {
         let total_cross: f32 = flex_lines.iter().map(|line| line.cross_size).sum();
 
-        if total_cross < avaliable_cross {
-            let remaining = avaliable_cross - total_cross;
+        if total_cross < inner_intrinsic_cross_size {
+            let remaining = inner_intrinsic_cross_size - total_cross;
             let addition = remaining / flex_lines.len() as f32;
 
             for line in &mut flex_lines {
@@ -638,21 +817,21 @@ fn compute_internal(
             let is_stretch = child.node.align_self(node) == style::AlignSelf::Stretch;
 
             if is_stretch
-                && child.node.cross_margin_start() != style::Dimension::Auto
-                && child.node.cross_margin_end() != style::Dimension::Auto
-                && child.node.cross_size() == style::Dimension::Auto
+                && child.node.cross_margin_start(node.flex_direction) != style::Dimension::Auto
+                && child.node.cross_margin_end(node.flex_direction) != style::Dimension::Auto
+                && child.node.cross_size(node.flex_direction) == style::Dimension::Auto
             {
                 child.target_cross_size = line
                     .cross_size
                     .min(
                         child
                             .node
-                            .max_cross_size()
+                            .max_cross_size(node.flex_direction)
                             .resolve(avaliable_cross, f32::MAX),
                     ).max(
                         child
                             .node
-                            .min_cross_size()
+                            .min_cross_size(node.flex_direction)
                             .resolve(avaliable_cross, f32::MIN),
                     );
             } else {
@@ -663,8 +842,16 @@ fn compute_internal(
                 // TODO use result somehow
                 compute_internal(
                     child.node,
-                    SizeConstraint::exactly(child.target_main_size),
-                    SizeConstraint::exactly(child.target_cross_size),
+                    if node.flex_direction.is_row() {
+                        SizeConstraint::exactly(child.target_main_size)
+                    } else {
+                        SizeConstraint::exactly(child.target_cross_size)
+                    },
+                    if node.flex_direction.is_column() {
+                        SizeConstraint::exactly(child.target_main_size)
+                    } else {
+                        SizeConstraint::exactly(child.target_cross_size)
+                    },
                 );
             }
         }
@@ -686,10 +873,10 @@ fn compute_internal(
             let mut num_auto_margins = 0;
 
             for child in &mut line.items {
-                if child.node.main_margin_start() == style::Dimension::Auto {
+                if child.node.main_margin_start(node.flex_direction) == style::Dimension::Auto {
                     num_auto_margins += 1;
                 }
-                if child.node.main_margin_end() == style::Dimension::Auto {
+                if child.node.main_margin_end(node.flex_direction) == style::Dimension::Auto {
                     num_auto_margins += 1;
                 }
             }
@@ -698,10 +885,10 @@ fn compute_internal(
                 let margin = free_space / num_auto_margins as f32;
 
                 for child in &mut line.items {
-                    if child.node.main_margin_start() == style::Dimension::Auto {
+                    if child.node.main_margin_start(node.flex_direction) == style::Dimension::Auto {
                         child.main_margin_start = margin;
                     }
-                    if child.node.main_margin_end() == style::Dimension::Auto {
+                    if child.node.main_margin_end(node.flex_direction) == style::Dimension::Auto {
                         child.main_margin_end = margin;
                     }
                 }
@@ -712,11 +899,11 @@ fn compute_internal(
                 for child in &mut line.items {
                     child.main_margin_start = child
                         .node
-                        .main_margin_start()
+                        .main_margin_start(node.flex_direction)
                         .resolve(container_main_size, 0.0);
                     child.main_margin_end = child
                         .node
-                        .main_margin_end()
+                        .main_margin_end(node.flex_direction)
                         .resolve(container_main_size, 0.0);
 
                     child.offset_main = match node.justify_content {
@@ -765,22 +952,27 @@ fn compute_internal(
             if child.target_cross_size < line.cross_size {
                 let free_space = line.cross_size - child.target_cross_size;
 
-                if child.node.cross_margin_start() == style::Dimension::Auto
-                    && child.node.cross_margin_end() == style::Dimension::Auto
+                if child.node.cross_margin_start(node.flex_direction) == style::Dimension::Auto
+                    && child.node.cross_margin_end(node.flex_direction) == style::Dimension::Auto
                 {
                     child.cross_margin_start = free_space / 2.0;
                     child.cross_margin_end = free_space / 2.0;
-                } else if child.node.cross_margin_start() == style::Dimension::Auto {
+                } else if child.node.cross_margin_start(node.flex_direction)
+                    == style::Dimension::Auto
+                {
                     child.cross_margin_start = free_space;
-                } else if child.node.cross_margin_end() == style::Dimension::Auto {
+                } else if child.node.cross_margin_end(node.flex_direction) == style::Dimension::Auto
+                {
                     child.cross_margin_end = free_space;
                 } else {
                     child.cross_margin_start = child
                         .node
-                        .cross_margin_start()
+                        .cross_margin_start(node.flex_direction)
+                        .resolve(line.cross_size, 0.0);
+                    child.cross_margin_end = child
+                        .node
+                        .cross_margin_end(node.flex_direction)
                         .resolve(line.cross_size, 0.0);
-                    child.cross_margin_end =
-                        child.node.cross_margin_end().resolve(line.cross_size, 0.0);
 
                     // 14. Align all flex items along the cross-axis per align-self, if neither of the item’s
                     //     cross-axis margins are auto.
@@ -804,13 +996,16 @@ fn compute_internal(
     //     - Otherwise, use the sum of the flex lines' cross sizes, clamped by the used
     //       min and max cross sizes of the flex container.
 
-    let total_cross_size = flex_lines.iter().map(|line| line.cross_size).sum();
-    let container_cross_size = if avaliable_cross.is_finite() {
-        avaliable_cross
+    let total_cross_size: f32 = flex_lines.iter().map(|line| line.cross_size).sum();
+    let container_cross_size = if intrinsic_cross_size.is_finite() {
+        intrinsic_cross_size
+            .min(cross_constraint.max)
+            .max(cross_constraint.min)
     } else {
-        total_cross_size
-    }.min(cross.max)
-    .max(cross.min);;
+        (total_cross_size + padding_cross + border_cross)
+            .min(cross_constraint.max)
+            .max(cross_constraint.min)
+    };
 
     // 16. Align all flex lines per align-content.
 
@@ -848,28 +1043,38 @@ fn compute_internal(
 
     let mut children: Vec<layout::Node> = vec![];
 
-    let mut total_offset_cross = node
-        .cross_padding_start()
-        .resolve(container_cross_size, 0.0)
-        + node.cross_border_start().resolve(container_cross_size, 0.0);
+    let mut total_offset_cross = padding_cross_start + border_cross_start;
 
     for line in &mut flex_lines {
-        let mut total_offset_main = node.main_padding_start().resolve(container_main_size, 0.0)
-            + node.main_border_start().resolve(container_main_size, 0.0);
+        let mut total_offset_main = padding_main_start + border_main_start;
 
         for child in &mut line.items {
             let result = compute_internal(
                 child.node,
-                SizeConstraint::exactly(child.target_main_size),
-                SizeConstraint::exactly(child.target_cross_size),
+                if node.flex_direction.is_row() {
+                    SizeConstraint::exactly(child.target_main_size)
+                } else {
+                    SizeConstraint::exactly(child.target_cross_size)
+                },
+                if node.flex_direction.is_column() {
+                    SizeConstraint::exactly(child.target_main_size)
+                } else {
+                    SizeConstraint::exactly(child.target_cross_size)
+                },
             );
 
             let offset_main = {
                 total_offset_main
                     + child.offset_main
                     + child.main_margin_start
-                    + (child.node.main_start().resolve(container_main_size, 0.0)
-                        - child.node.main_end().resolve(container_main_size, 0.0))
+                    + (child
+                        .node
+                        .main_start(node.flex_direction)
+                        .resolve(container_main_size, 0.0)
+                        - child
+                            .node
+                            .main_end(node.flex_direction)
+                            .resolve(container_main_size, 0.0))
             };
 
             let offset_cross = {
@@ -877,27 +1082,25 @@ fn compute_internal(
                     + child.offset_cross
                     + line.offset_cross
                     + child.cross_margin_start
-                    + (child.node.cross_start().resolve(container_main_size, 0.0)
-                        - child.node.cross_end().resolve(container_main_size, 0.0))
+                    + (child
+                        .node
+                        .cross_start(node.flex_direction)
+                        .resolve(container_main_size, 0.0)
+                        - child
+                            .node
+                            .cross_end(node.flex_direction)
+                            .resolve(container_main_size, 0.0))
             };
 
             children.push(layout::Node {
-                width: if child.node.flex_direction.is_row() {
-                    result.size.main
-                } else {
-                    result.size.cross
-                },
-                height: if child.node.flex_direction.is_column() {
-                    result.size.main
-                } else {
-                    result.size.cross
-                },
-                x: if child.node.flex_direction.is_row() {
+                width: result.size.width,
+                height: result.size.height,
+                x: if node.flex_direction.is_row() {
                     offset_main
                 } else {
                     offset_cross
                 },
-                y: if child.node.flex_direction.is_column() {
+                y: if node.flex_direction.is_column() {
                     offset_main
                 } else {
                     offset_cross
@@ -905,7 +1108,8 @@ fn compute_internal(
                 children: result.children,
             });
 
-            total_offset_main = offset_main + result.size.main + child.main_margin_end;
+            total_offset_main =
+                offset_main + result.size.main(node.flex_direction) + child.main_margin_end;
         }
 
         total_offset_cross += line.offset_cross + line.cross_size;
@@ -913,8 +1117,16 @@ fn compute_internal(
 
     ComputeResult {
         size: FlexSize {
-            main: container_main_size,
-            cross: container_cross_size,
+            width: if node.flex_direction.is_row() {
+                container_main_size
+            } else {
+                container_cross_size
+            },
+            height: if node.flex_direction.is_column() {
+                container_main_size
+            } else {
+                container_cross_size
+            },
         },
         children: children,
     }
diff --git a/src/style.rs b/src/style.rs
index 22f9bc2e3..0b11b270f 100644
--- a/src/style.rs
+++ b/src/style.rs
@@ -276,155 +276,155 @@ impl Default for Node {
 }
 
 impl Node {
-    pub(crate) fn main_size(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn main_size(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.width,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.height,
         }
     }
 
-    pub(crate) fn min_main_size(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn min_main_size(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.min_width,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.min_height,
         }
     }
 
-    pub(crate) fn max_main_size(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn max_main_size(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.max_width,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.max_height,
         }
     }
 
-    pub(crate) fn main_margin_start(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn main_margin_start(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.margin.start,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.margin.top,
         }
     }
 
-    pub(crate) fn main_margin_end(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn main_margin_end(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.margin.end,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.margin.bottom,
         }
     }
 
-    pub(crate) fn main_padding_start(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn main_padding_start(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.padding.start,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.padding.top,
         }
     }
 
-    pub(crate) fn main_padding_end(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn main_padding_end(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.padding.end,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.padding.bottom,
         }
     }
 
-    pub(crate) fn main_border_start(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn main_border_start(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.border.start,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.border.top,
         }
     }
 
-    pub(crate) fn main_border_end(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn main_border_end(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.border.end,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.border.bottom,
         }
     }
 
-    pub(crate) fn cross_size(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn cross_size(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.height,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.width,
         }
     }
 
-    pub(crate) fn min_cross_size(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn min_cross_size(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.min_height,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.min_width,
         }
     }
 
-    pub(crate) fn max_cross_size(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn max_cross_size(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.max_height,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.max_width,
         }
     }
 
-    pub(crate) fn cross_margin_start(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn cross_margin_start(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.margin.top,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.margin.start,
         }
     }
 
-    pub(crate) fn cross_margin_end(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn cross_margin_end(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.margin.bottom,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.margin.end,
         }
     }
 
-    pub(crate) fn cross_padding_start(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn cross_padding_start(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.padding.top,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.padding.start,
         }
     }
 
-    pub(crate) fn cross_padding_end(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn cross_padding_end(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.padding.bottom,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.padding.end,
         }
     }
 
-    pub(crate) fn cross_border_start(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn cross_border_start(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.border.top,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.border.start,
         }
     }
 
-    pub(crate) fn cross_border_end(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn cross_border_end(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.border.bottom,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.border.end,
         }
     }
 
-    pub(crate) fn main_start(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn main_start(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.start,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.top,
         }
     }
 
-    pub(crate) fn main_end(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn main_end(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.end,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.bottom,
         }
     }
 
-    pub(crate) fn cross_start(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn cross_start(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.top,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.start,
         }
     }
 
-    pub(crate) fn cross_end(&self) -> Dimension {
-        match self.flex_direction {
+    pub(crate) fn cross_end(&self, direction: FlexDirection) -> Dimension {
+        match direction {
             FlexDirection::Row | FlexDirection::RowReverse => self.bottom,
             FlexDirection::Column | FlexDirection::ColumnReverse => self.end,
         }
diff --git a/test_fixtures/absolute_layout_align_items_and_justify_content_center.html b/test_fixtures/absolute_layout_align_items_and_justify_content_center.html
new file mode 100644
index 000000000..b93fb9f5b
--- /dev/null
+++ b/test_fixtures/absolute_layout_align_items_and_justify_content_center.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 110px; align-items: center; justify-content: center;">
+  <div style="position: absolute; width: 60px; height: 40px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_bottom_position.html b/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_bottom_position.html
new file mode 100644
index 000000000..e295605f5
--- /dev/null
+++ b/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_bottom_position.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 110px; align-items: center; justify-content: center;">
+  <div style="position: absolute; width: 60px; height: 40px;bottom:10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_left_position.html b/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_left_position.html
new file mode 100644
index 000000000..bad6a11ae
--- /dev/null
+++ b/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_left_position.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 110px; align-items: center; justify-content: center;">
+  <div style="position: absolute; width: 60px; height: 40px;left:5px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_right_position.html b/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_right_position.html
new file mode 100644
index 000000000..ec52877ed
--- /dev/null
+++ b/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_right_position.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 110px; align-items: center; justify-content: center;">
+  <div style="position: absolute; width: 60px; height: 40px;right:5px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_top_position.html b/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_top_position.html
new file mode 100644
index 000000000..85208b879
--- /dev/null
+++ b/test_fixtures/absolute_layout_align_items_and_justify_content_center_and_top_position.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 110px; align-items: center; justify-content: center;">
+  <div style="position: absolute; width: 60px; height: 40px;top:10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_align_items_and_justify_content_flex_end.html b/test_fixtures/absolute_layout_align_items_and_justify_content_flex_end.html
new file mode 100644
index 000000000..94574adbf
--- /dev/null
+++ b/test_fixtures/absolute_layout_align_items_and_justify_content_flex_end.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 110px; align-items: flex-end; justify-content: flex-end;">
+  <div style="position: absolute; width: 60px; height: 40px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_align_items_center.html b/test_fixtures/absolute_layout_align_items_center.html
new file mode 100644
index 000000000..eac2bf66e
--- /dev/null
+++ b/test_fixtures/absolute_layout_align_items_center.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 110px; align-items: center;">
+  <div style="position: absolute; width: 60px; height: 40px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_align_items_center_on_child_only.html b/test_fixtures/absolute_layout_align_items_center_on_child_only.html
new file mode 100644
index 000000000..1693318bf
--- /dev/null
+++ b/test_fixtures/absolute_layout_align_items_center_on_child_only.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 110px;">
+  <div style="position: absolute; width: 60px; height: 40px;align-self: center;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_in_wrap_reverse_column_container.html b/test_fixtures/absolute_layout_in_wrap_reverse_column_container.html
new file mode 100644
index 000000000..57678d2fd
--- /dev/null
+++ b/test_fixtures/absolute_layout_in_wrap_reverse_column_container.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="flex-direction: column; width: 100px; height: 100px; flex-wrap: wrap-reverse;">
+  <div style="width:20px; height:20px; position: absolute;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_in_wrap_reverse_column_container_flex_end.html b/test_fixtures/absolute_layout_in_wrap_reverse_column_container_flex_end.html
new file mode 100644
index 000000000..aac24c8f7
--- /dev/null
+++ b/test_fixtures/absolute_layout_in_wrap_reverse_column_container_flex_end.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="flex-direction: column; width: 100px; height: 100px; flex-wrap: wrap-reverse;">
+  <div style="width:20px; height:20px; position: absolute; align-self: flex-end;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_in_wrap_reverse_row_container.html b/test_fixtures/absolute_layout_in_wrap_reverse_row_container.html
new file mode 100644
index 000000000..94ec3b9e0
--- /dev/null
+++ b/test_fixtures/absolute_layout_in_wrap_reverse_row_container.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="flex-direction: row; width:100px; height: 100px; flex-wrap: wrap-reverse;">
+  <div style="width:20px; height:20px; position: absolute;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_in_wrap_reverse_row_container_flex_end.html b/test_fixtures/absolute_layout_in_wrap_reverse_row_container_flex_end.html
new file mode 100644
index 000000000..8337400d9
--- /dev/null
+++ b/test_fixtures/absolute_layout_in_wrap_reverse_row_container_flex_end.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="flex-direction: row; width: 100px; height: 100px; flex-wrap: wrap-reverse;">
+  <div style="width:20px; height:20px; position: absolute; align-self: flex-end;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_justify_content_center.html b/test_fixtures/absolute_layout_justify_content_center.html
new file mode 100644
index 000000000..7870779d7
--- /dev/null
+++ b/test_fixtures/absolute_layout_justify_content_center.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 110px; justify-content: center;">
+  <div style="position: absolute; width: 60px; height: 40px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_percentage_bottom_based_on_parent_height.html b/test_fixtures/absolute_layout_percentage_bottom_based_on_parent_height.html
new file mode 100644
index 000000000..b00b10636
--- /dev/null
+++ b/test_fixtures/absolute_layout_percentage_bottom_based_on_parent_height.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 200px;">
+  <div style="position: absolute; top: 50%; width: 10px; height: 10px;"></div>
+  <div style="position: absolute; bottom: 50%; width: 10px; height: 10px;"></div>
+  <div style="position: absolute; top: 10%; width: 10px; bottom: 10%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_start_top_end_bottom.html b/test_fixtures/absolute_layout_start_top_end_bottom.html
new file mode 100644
index 000000000..79e1cd526
--- /dev/null
+++ b/test_fixtures/absolute_layout_start_top_end_bottom.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px;">
+  <div style="position: absolute; left: 10px; top: 10px; right: 10px; bottom: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_width_height_end_bottom.html b/test_fixtures/absolute_layout_width_height_end_bottom.html
new file mode 100644
index 000000000..7784dff9e
--- /dev/null
+++ b/test_fixtures/absolute_layout_width_height_end_bottom.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px;">
+  <div style="width: 10px; height: 10px; position: absolute; right: 10px; bottom: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_width_height_start_top.html b/test_fixtures/absolute_layout_width_height_start_top.html
new file mode 100644
index 000000000..996dbdd07
--- /dev/null
+++ b/test_fixtures/absolute_layout_width_height_start_top.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px;">
+  <div style="width: 10px; height: 10px; position: absolute; left: 10px; top: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_width_height_start_top_end_bottom.html b/test_fixtures/absolute_layout_width_height_start_top_end_bottom.html
new file mode 100644
index 000000000..5853c1231
--- /dev/null
+++ b/test_fixtures/absolute_layout_width_height_start_top_end_bottom.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px;">
+  <div style="width: 10px; height: 10px; position: absolute; left: 10px; top: 10px; right: 10px; bottom: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/absolute_layout_within_border.html b/test_fixtures/absolute_layout_within_border.html
new file mode 100644
index 000000000..f53e70716
--- /dev/null
+++ b/test_fixtures/absolute_layout_within_border.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 100px; border-width: 10px; padding: 10px;">
+  <div style="position: absolute; width: 50px; height: 50px; left: 0px; top: 0px;"></div>
+  <div style="position: absolute; width: 50px; height: 50px; right: 0px; bottom: 0px;"></div>
+  <div style="position: absolute; width: 50px; height: 50px; left: 0px; top: 0px; margin: 10px;"></div>
+  <div style="position: absolute; width: 50px; height: 50px; right: 0px; bottom: 0px; margin: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_baseline.html b/test_fixtures/align_baseline.html
new file mode 100644
index 000000000..3308b8a5a
--- /dev/null
+++ b/test_fixtures/align_baseline.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; align-items: baseline;">
+  <div style="width: 50px; height: 50px;"></div>
+  <div style="width: 50px; height: 20px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_baseline_child_multiline.html b/test_fixtures/align_baseline_child_multiline.html
new file mode 100644
index 000000000..b20c34077
--- /dev/null
+++ b/test_fixtures/align_baseline_child_multiline.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; align-items: baseline;">
+  <div style="width: 50px; height: 60px;"></div>
+  <div style="width: 50px; flex-wrap: wrap;">
+    <div style="width: 25px; height: 20px;"></div>
+    <div style="width: 25px; height: 10px;"></div>
+    <div style="width: 25px; height: 20px;"></div>
+    <div style="width: 25px; height: 10px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_baseline_nested_child.html b/test_fixtures/align_baseline_nested_child.html
new file mode 100644
index 000000000..33a7d8bad
--- /dev/null
+++ b/test_fixtures/align_baseline_nested_child.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; align-items: baseline;">
+  <div style="width: 50px; height: 50px;"></div>
+  <div style="width: 50px; height: 20px; flex-direction: column;">
+    <div style="width: 50px; height: 10px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_center_should_size_based_on_content.html b/test_fixtures/align_center_should_size_based_on_content.html
new file mode 100644
index 000000000..525943abc
--- /dev/null
+++ b/test_fixtures/align_center_should_size_based_on_content.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; align-items: center; margin-top: 20px;">
+  <div style="flex-grow: 0; flex-shrink: 1; justify-content: center;">
+    <div style="flex-grow: 1; flex-shrink: 1;">
+      <div style="width: 20px; height: 20px;"></div>
+    </div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_flex_start_with_shrinking_children.html b/test_fixtures/align_flex_start_with_shrinking_children.html
new file mode 100644
index 000000000..3588ea310
--- /dev/null
+++ b/test_fixtures/align_flex_start_with_shrinking_children.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 500px; width: 500px;">
+  <div style="align-items: flex-start;">
+    <div style="flex-grow: 1; flex-shrink: 1;">
+      <div style="flex-grow: 1; flex-shrink: 1;"></div>
+    </div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_flex_start_with_shrinking_children_with_stretch.html b/test_fixtures/align_flex_start_with_shrinking_children_with_stretch.html
new file mode 100644
index 000000000..e7d34bec4
--- /dev/null
+++ b/test_fixtures/align_flex_start_with_shrinking_children_with_stretch.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 500px; width: 500px">
+  <div style="align-items: flex-start;">
+    <div style="flex-grow: 1; flex-shrink: 1; align-items: stretch;">
+      <div style="flex-grow: 1; flex-shrink: 1;"></div>
+    </div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_flex_start_with_stretching_children.html b/test_fixtures/align_flex_start_with_stretching_children.html
new file mode 100644
index 000000000..d6b8a05c7
--- /dev/null
+++ b/test_fixtures/align_flex_start_with_stretching_children.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 500px; width: 500px">
+  <div style="align-items: strech;">
+    <div style="flex-grow: 1; flex-shrink: 1;">
+      <div style="flex-grow: 1; flex-shrink: 1;"></div>
+    </div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_items_center.html b/test_fixtures/align_items_center.html
new file mode 100644
index 000000000..b1a95dfde
--- /dev/null
+++ b/test_fixtures/align_items_center.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; align-items: center;">
+  <div style="height: 10px; width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_items_center_child_with_margin_bigger_than_parent.html b/test_fixtures/align_items_center_child_with_margin_bigger_than_parent.html
new file mode 100644
index 000000000..e93ec83d4
--- /dev/null
+++ b/test_fixtures/align_items_center_child_with_margin_bigger_than_parent.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 52px; width: 52px; align-items: center; justify-content: center;">
+  <div style="align-items: center;">
+    <div style="width: 52px; height: 52px; margin-left: 10px; margin-right: 10px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_items_center_child_without_margin_bigger_than_parent.html b/test_fixtures/align_items_center_child_without_margin_bigger_than_parent.html
new file mode 100644
index 000000000..e6ff72279
--- /dev/null
+++ b/test_fixtures/align_items_center_child_without_margin_bigger_than_parent.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 52px; width: 52px; align-items: center; justify-content: center;">
+  <div style="align-items: center;">
+    <div style="width: 72px; height: 72px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_items_center_with_child_margin.html b/test_fixtures/align_items_center_with_child_margin.html
new file mode 100644
index 000000000..165ea9940
--- /dev/null
+++ b/test_fixtures/align_items_center_with_child_margin.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; align-items: center;">
+  <div style="height: 10px; width: 10px; margin-top: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_items_center_with_child_top.html b/test_fixtures/align_items_center_with_child_top.html
new file mode 100644
index 000000000..03b049276
--- /dev/null
+++ b/test_fixtures/align_items_center_with_child_top.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; align-items: center;">
+  <div style="height: 10px; width: 10px; top: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_items_flex_end.html b/test_fixtures/align_items_flex_end.html
new file mode 100644
index 000000000..fd5405b5c
--- /dev/null
+++ b/test_fixtures/align_items_flex_end.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; align-items: flex-end;">
+  <div style="height: 10px; width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_items_flex_end_child_with_margin_bigger_than_parent.html b/test_fixtures/align_items_flex_end_child_with_margin_bigger_than_parent.html
new file mode 100644
index 000000000..1a92aef71
--- /dev/null
+++ b/test_fixtures/align_items_flex_end_child_with_margin_bigger_than_parent.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 52px; width: 52px; align-items: center; justify-content: center;">
+  <div style="align-items: flex-end;">
+    <div style="width: 52px; height: 52px; margin-left: 10px; margin-right: 10px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_items_flex_end_child_without_margin_bigger_than_parent.html b/test_fixtures/align_items_flex_end_child_without_margin_bigger_than_parent.html
new file mode 100644
index 000000000..bfe7dff5b
--- /dev/null
+++ b/test_fixtures/align_items_flex_end_child_without_margin_bigger_than_parent.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 52px; width: 52px; align-items: center; justify-content: center;">
+  <div style="align-items: flex-end;">
+    <div style="width: 72px; height: 72px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_items_flex_start.html b/test_fixtures/align_items_flex_start.html
new file mode 100644
index 000000000..2b9075bad
--- /dev/null
+++ b/test_fixtures/align_items_flex_start.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; align-items: flex-start;">
+  <div style="height: 10px; width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_items_min_max.html b/test_fixtures/align_items_min_max.html
new file mode 100644
index 000000000..d0b840b4c
--- /dev/null
+++ b/test_fixtures/align_items_min_max.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="max-width: 200px; min-width: 100px; height: 100px; align-items: center; flex-direction: column;">
+  <div style="width: 60px; height: 60px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/sample.html b/test_fixtures/align_items_stretch.html
similarity index 90%
rename from test_fixtures/sample.html
rename to test_fixtures/align_items_stretch.html
index 618f23c19..04b2c3e9f 100644
--- a/test_fixtures/sample.html
+++ b/test_fixtures/align_items_stretch.html
@@ -10,7 +10,7 @@
 <body>
 
 <div id="test-root" style="width: 100px; height: 100px;">
-  <div style="width: 50px;"></div>
+  <div style="width: 10px;"></div>
 </div>
 
 </body>
diff --git a/test_fixtures/align_self_baseline.html b/test_fixtures/align_self_baseline.html
new file mode 100644
index 000000000..6b1df161c
--- /dev/null
+++ b/test_fixtures/align_self_baseline.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px;">
+  <div style="width: 50px; height: 50px; align-self: baseline;"></div>
+  <div style="width: 50px; height: 20px; align-self: baseline;">
+    <div style="width: 50px; height: 10px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_self_center.html b/test_fixtures/align_self_center.html
new file mode 100644
index 000000000..c3b62cc81
--- /dev/null
+++ b/test_fixtures/align_self_center.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width:100px; height: 100px;">
+  <div style="height: 10px; width: 10px; align-self: center;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_self_flex_end.html b/test_fixtures/align_self_flex_end.html
new file mode 100644
index 000000000..c0ec10027
--- /dev/null
+++ b/test_fixtures/align_self_flex_end.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width:100px; height: 100px;">
+  <div style="height: 10px; width: 10px; align-self: flex-end;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_self_flex_end_override_flex_start.html b/test_fixtures/align_self_flex_end_override_flex_start.html
new file mode 100644
index 000000000..9b40eb318
--- /dev/null
+++ b/test_fixtures/align_self_flex_end_override_flex_start.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width:100px; height: 100px; align-items: flex-start;">
+  <div style="height: 10px; width: 10px; align-self: flex-end;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_self_flex_start.html b/test_fixtures/align_self_flex_start.html
new file mode 100644
index 000000000..4b33499a9
--- /dev/null
+++ b/test_fixtures/align_self_flex_start.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width:100px; height: 100px;">
+  <div style="height: 10px; width: 10px; align-self: flex-start;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/align_strech_should_size_based_on_parent.html b/test_fixtures/align_strech_should_size_based_on_parent.html
new file mode 100644
index 000000000..7d0a4819b
--- /dev/null
+++ b/test_fixtures/align_strech_should_size_based_on_parent.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px;">
+  <div style="flex-grow: 0; flex-shrink: 1; justify-content: center;">
+    <div style="flex-grow: 1; flex-shrink: 1;">
+      <div style="width: 20px; height: 20px;"></div>
+    </div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/border_center_child.html b/test_fixtures/border_center_child.html
new file mode 100644
index 000000000..fd269d7c2
--- /dev/null
+++ b/test_fixtures/border_center_child.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; border-start-width: 10px; border-top-width: 10px; border-end-width: 20px; border-bottom-width: 20px; align-items: center; justify-content: center;">
+  <div style="height: 10px; width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/border_flex_child.html b/test_fixtures/border_flex_child.html
new file mode 100644
index 000000000..aee79db6f
--- /dev/null
+++ b/test_fixtures/border_flex_child.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; border-width: 10px;">
+  <div style="width: 10px; flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/border_no_child.html b/test_fixtures/border_no_child.html
new file mode 100644
index 000000000..23e481766
--- /dev/null
+++ b/test_fixtures/border_no_child.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="border-width: 10px;">
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/border_stretch_child.html b/test_fixtures/border_stretch_child.html
new file mode 100644
index 000000000..b36434cd5
--- /dev/null
+++ b/test_fixtures/border_stretch_child.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; border-width: 10px;">
+  <div style="width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/child_min_max_width_flexing.html b/test_fixtures/child_min_max_width_flexing.html
new file mode 100644
index 000000000..d7dea0591
--- /dev/null
+++ b/test_fixtures/child_min_max_width_flexing.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 120px; height: 50px; flex-direction: row; align-items:stretch">
+  <div style="min-width: 60px; flex-grow:1; flex-shrink:0; flex-basis: 0px"></div>
+  <div style="max-width: 20px; flex-grow:1; flex-shrink:0; flex-basis: 50%"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/container_with_unsized_child.html b/test_fixtures/container_with_unsized_child.html
new file mode 100644
index 000000000..f2a493586
--- /dev/null
+++ b/test_fixtures/container_with_unsized_child.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px;">
+  <div></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_basis_flex_grow_column.html b/test_fixtures/flex_basis_flex_grow_column.html
new file mode 100644
index 000000000..e9ba7daae
--- /dev/null
+++ b/test_fixtures/flex_basis_flex_grow_column.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: column;">
+  <div style="flex-basis: 50px; flex-grow: 1;"></div>
+  <div style="flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_basis_flex_grow_row.html b/test_fixtures/flex_basis_flex_grow_row.html
new file mode 100644
index 000000000..402be1961
--- /dev/null
+++ b/test_fixtures/flex_basis_flex_grow_row.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="flex-basis: 50px; flex-grow: 1;"></div>
+  <div style="flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_basis_flex_shrink_column.html b/test_fixtures/flex_basis_flex_shrink_column.html
new file mode 100644
index 000000000..d93e3a877
--- /dev/null
+++ b/test_fixtures/flex_basis_flex_shrink_column.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: column;">
+  <div style="flex-basis: 100px;"></div>
+  <div style="flex-basis: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_basis_flex_shrink_row.html b/test_fixtures/flex_basis_flex_shrink_row.html
new file mode 100644
index 000000000..12b2efc0a
--- /dev/null
+++ b/test_fixtures/flex_basis_flex_shrink_row.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="flex-basis: 100px;"></div>
+  <div style="flex-basis: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_basis_overrides_main_size.html b/test_fixtures/flex_basis_overrides_main_size.html
new file mode 100644
index 000000000..3cfe2cb80
--- /dev/null
+++ b/test_fixtures/flex_basis_overrides_main_size.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 100px;">
+  <div style="width: 20px; flex-grow:1; flex-basis:50px;"></div>
+  <div style="width: 10px; flex-grow:1;"></div>
+  <div style="width: 10px; flex-grow:1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_direction_column.html b/test_fixtures/flex_direction_column.html
new file mode 100644
index 000000000..08ecce88d
--- /dev/null
+++ b/test_fixtures/flex_direction_column.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 100px; flex-direction: column;">
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_direction_column_no_height.html b/test_fixtures/flex_direction_column_no_height.html
new file mode 100644
index 000000000..c66bcdeab
--- /dev/null
+++ b/test_fixtures/flex_direction_column_no_height.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; flex-direction: column;">
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_direction_column_reverse.html b/test_fixtures/flex_direction_column_reverse.html
new file mode 100644
index 000000000..e632d5e45
--- /dev/null
+++ b/test_fixtures/flex_direction_column_reverse.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 100px; flex-direction: column-reverse;">
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_direction_row.html b/test_fixtures/flex_direction_row.html
new file mode 100644
index 000000000..dd146bc6b
--- /dev/null
+++ b/test_fixtures/flex_direction_row.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 100px;">
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_direction_row_no_width.html b/test_fixtures/flex_direction_row_no_width.html
new file mode 100644
index 000000000..5fd1ec9bd
--- /dev/null
+++ b/test_fixtures/flex_direction_row_no_width.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px;">
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_direction_row_reverse.html b/test_fixtures/flex_direction_row_reverse.html
new file mode 100644
index 000000000..65736b7c9
--- /dev/null
+++ b/test_fixtures/flex_direction_row_reverse.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 100px; flex-direction: row-reverse;">
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_child.html b/test_fixtures/flex_grow_child.html
new file mode 100644
index 000000000..b13992e67
--- /dev/null
+++ b/test_fixtures/flex_grow_child.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="flex-direction: row;">
+  <div style="height: 100px; flex-grow: 1; flex-basis: 0px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_height_maximized.html b/test_fixtures/flex_grow_height_maximized.html
new file mode 100644
index 000000000..fd9252743
--- /dev/null
+++ b/test_fixtures/flex_grow_height_maximized.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height:500px; flex-direction: column;">
+  <div style="min-height: 100px; max-height: 500px; flex-grow: 1; flex-direction: column;">
+    <div style="flex-basis: 200px; flex-grow: 1;"></div>
+    <div style="height: 100px; "></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_in_at_most_container.html b/test_fixtures/flex_grow_in_at_most_container.html
new file mode 100644
index 000000000..b89a29651
--- /dev/null
+++ b/test_fixtures/flex_grow_in_at_most_container.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; background-color: white; flex-direction: row; align-items: flex-start;">
+  <div style="flex-direction: row;">
+    <div style="flex-grow: 1; flex-basis: 0px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_less_than_factor_one.html b/test_fixtures/flex_grow_less_than_factor_one.html
new file mode 100644
index 000000000..4c14871d1
--- /dev/null
+++ b/test_fixtures/flex_grow_less_than_factor_one.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 500px; height: 200px;">
+  <div style="flex-grow:0.2; flex-shrink:0; flex-basis: 40px;"></div>
+  <div style="flex-grow:0.2; flex-shrink:0;"></div>
+  <div style="flex-grow:0.4; flex-shrink:0;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_root_minimized.html b/test_fixtures/flex_grow_root_minimized.html
new file mode 100644
index 000000000..35c4c50ab
--- /dev/null
+++ b/test_fixtures/flex_grow_root_minimized.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; min-height: 100px; max-height: 500px; flex-direction: column;">
+  <div style="min-height: 100px; max-height: 500px; flex-grow:1;  flex-direction: column;">
+    <div style="flex-basis: 200px; flex-grow: 1;"></div>
+    <div style="height:100px; "></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_shrink_at_most.html b/test_fixtures/flex_grow_shrink_at_most.html
new file mode 100644
index 000000000..da1ae824f
--- /dev/null
+++ b/test_fixtures/flex_grow_shrink_at_most.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 100px;">
+  <div>
+    <div style="flex-grow:1; flex-shrink:1;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_to_min.html b/test_fixtures/flex_grow_to_min.html
new file mode 100644
index 000000000..97c493ab1
--- /dev/null
+++ b/test_fixtures/flex_grow_to_min.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="min-height: 100px; max-height: 500px; width: 100px; flex-direction: column;">
+  <div style="flex-grow: 1; flex-shrink: 1;"></div>
+  <div style="height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_within_constrained_max_column.html b/test_fixtures/flex_grow_within_constrained_max_column.html
new file mode 100644
index 000000000..33aa9c262
--- /dev/null
+++ b/test_fixtures/flex_grow_within_constrained_max_column.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="max-height: 100px; width: 100px; flex-direction: column;">
+  <div style="flex-shrink: 1; flex-basis:100px"></div>
+  <div style="height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_within_constrained_max_row.html b/test_fixtures/flex_grow_within_constrained_max_row.html
new file mode 100644
index 000000000..30893f7e5
--- /dev/null
+++ b/test_fixtures/flex_grow_within_constrained_max_row.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; flex-direction: column;">
+  <div style="height: 100px; max-width: 100px; flex-direction: row;">
+    <div style="flex-shrink: 1; flex-basis:100px"></div>
+    <div style="width: 50px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_within_constrained_max_width.html b/test_fixtures/flex_grow_within_constrained_max_width.html
new file mode 100644
index 000000000..d18613bcc
--- /dev/null
+++ b/test_fixtures/flex_grow_within_constrained_max_width.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 100px; flex-direction: column;">
+  <div style="flex-direction: row; max-width: 300px;">
+    <div style="height: 20px; flex-grow: 1;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_within_constrained_min_column.html b/test_fixtures/flex_grow_within_constrained_min_column.html
new file mode 100644
index 000000000..4eb4f6372
--- /dev/null
+++ b/test_fixtures/flex_grow_within_constrained_min_column.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="min-height: 100px; flex-direction: column;">
+  <div style="flex-grow: 1;"></div>
+  <div style="height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_within_constrained_min_max_column.html b/test_fixtures/flex_grow_within_constrained_min_max_column.html
new file mode 100644
index 000000000..51c19d853
--- /dev/null
+++ b/test_fixtures/flex_grow_within_constrained_min_max_column.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="min-height: 100px; max-height: 200px flex-direction: column;">
+  <div style="flex-grow:1;"></div>
+  <div style="height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_within_constrained_min_row.html b/test_fixtures/flex_grow_within_constrained_min_row.html
new file mode 100644
index 000000000..e8807a264
--- /dev/null
+++ b/test_fixtures/flex_grow_within_constrained_min_row.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="min-width: 100px; height:100px; flex-direction: row;">
+  <div style="flex-grow: 1;"></div>
+  <div style="width: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_grow_within_max_width.html b/test_fixtures/flex_grow_within_max_width.html
new file mode 100644
index 000000000..7978606b1
--- /dev/null
+++ b/test_fixtures/flex_grow_within_max_width.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 100px; flex-direction: column;">
+  <div style="flex-direction: row; max-width: 100px;">
+    <div style="height: 20px; flex-grow: 1;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_root_ignored.html b/test_fixtures/flex_root_ignored.html
new file mode 100644
index 000000000..369c40679
--- /dev/null
+++ b/test_fixtures/flex_root_ignored.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; min-height: 100px; max-height: 500px; flex-direction: column;">
+  <div style="flex-basis: 200px; flex-grow: 1;"></div>
+  <div style="height: 100px; "></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_shrink_flex_grow_child_flex_shrink_other_child.html b/test_fixtures/flex_shrink_flex_grow_child_flex_shrink_other_child.html
new file mode 100644
index 000000000..c90974f09
--- /dev/null
+++ b/test_fixtures/flex_shrink_flex_grow_child_flex_shrink_other_child.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 500px; height: 500px; flex-direction: row;">
+  <div style="width: 500px; height: 100px; flex-grow: 0; flex-shrink: 1;"></div>
+  <div style="width: 500px; height: 100px; flex-grow: 1; flex-shrink: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_shrink_flex_grow_row.html b/test_fixtures/flex_shrink_flex_grow_row.html
new file mode 100644
index 000000000..1a9efe4db
--- /dev/null
+++ b/test_fixtures/flex_shrink_flex_grow_row.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 500px; height: 500px; flex-direction: row;">
+  <div style="width: 500px; height: 100px; flex-grow: 0; flex-shrink: 1;"></div>
+  <div style="width: 500px; height: 100px; flex-grow: 0; flex-shrink: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_shrink_to_zero.html b/test_fixtures/flex_shrink_to_zero.html
new file mode 100644
index 000000000..e5ca1c683
--- /dev/null
+++ b/test_fixtures/flex_shrink_to_zero.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 75px;">
+  <div style="width: 50px; height: 50px; flex-shrink: 0;"></div>
+  <div style="width: 50px; height: 50px; flex-shrink: 1;"></div>
+  <div style="width: 50px; height: 50px; flex-shrink: 0;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_wrap_align_stretch_fits_one_row.html b/test_fixtures/flex_wrap_align_stretch_fits_one_row.html
new file mode 100644
index 000000000..3e2794637
--- /dev/null
+++ b/test_fixtures/flex_wrap_align_stretch_fits_one_row.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 150px; height: 100px; flex-wrap: wrap; flex-direction: row;">
+  <div style="width: 50px;"></div>
+  <div style="width: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_wrap_children_with_min_main_overriding_flex_basis.html b/test_fixtures/flex_wrap_children_with_min_main_overriding_flex_basis.html
new file mode 100644
index 000000000..3f376a6b3
--- /dev/null
+++ b/test_fixtures/flex_wrap_children_with_min_main_overriding_flex_basis.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; flex-wrap: wrap; flex-direction: row;">
+  <div style="flex-basis: 50px; height: 50px; min-width: 55px;"></div>
+  <div style="flex-basis: 50px; height: 50px; min-width: 55px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/flex_wrap_wrap_to_child_height.html b/test_fixtures/flex_wrap_wrap_to_child_height.html
new file mode 100644
index 000000000..308262e13
--- /dev/null
+++ b/test_fixtures/flex_wrap_wrap_to_child_height.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="flex-direction: column;">
+  <div style="flex-direction: row; align-items: flex-start; flex-wrap: wrap;">
+    <div style="width: 100px; flex-direction: column;">
+      <div style="height: 100px; width: 100px;"></div>
+    </div>
+  </div>
+  <div style="width: 100px; height: 100px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_column_center.html b/test_fixtures/justify_content_column_center.html
new file mode 100644
index 000000000..7e8d697e9
--- /dev/null
+++ b/test_fixtures/justify_content_column_center.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; justify-content: center; flex-direction: column;">
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_column_flex_end.html b/test_fixtures/justify_content_column_flex_end.html
new file mode 100644
index 000000000..a428226e4
--- /dev/null
+++ b/test_fixtures/justify_content_column_flex_end.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; justify-content: flex-end; flex-direction: column;">
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_column_flex_start.html b/test_fixtures/justify_content_column_flex_start.html
new file mode 100644
index 000000000..f4530b7d4
--- /dev/null
+++ b/test_fixtures/justify_content_column_flex_start.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; justify-content: flex-start; flex-direction: column;">
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_column_min_height_and_margin.html b/test_fixtures/justify_content_column_min_height_and_margin.html
new file mode 100644
index 000000000..d1716ad1b
--- /dev/null
+++ b/test_fixtures/justify_content_column_min_height_and_margin.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="min-height: 50px; margin-top: 100px; justify-content: center; flex-direction: column;">
+  <div style="height: 20px; width: 20px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_column_space_around.html b/test_fixtures/justify_content_column_space_around.html
new file mode 100644
index 000000000..c04cb799f
--- /dev/null
+++ b/test_fixtures/justify_content_column_space_around.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; justify-content: space-around; flex-direction: column;">
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_column_space_between.html b/test_fixtures/justify_content_column_space_between.html
new file mode 100644
index 000000000..8249706ca
--- /dev/null
+++ b/test_fixtures/justify_content_column_space_between.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; justify-content: space-between; flex-direction: column;">
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_column_space_evenly.html b/test_fixtures/justify_content_column_space_evenly.html
new file mode 100644
index 000000000..bf7b8896f
--- /dev/null
+++ b/test_fixtures/justify_content_column_space_evenly.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; justify-content: space-evenly; flex-direction: column;">
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_colunn_max_height_and_margin.html b/test_fixtures/justify_content_colunn_max_height_and_margin.html
new file mode 100644
index 000000000..8d1a2d4ea
--- /dev/null
+++ b/test_fixtures/justify_content_colunn_max_height_and_margin.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; max-height: 80px; margin-top: 100px; justify-content: center; flex-direction: column;">
+  <div style="height: 20px; width: 20px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_min_max.html b/test_fixtures/justify_content_min_max.html
new file mode 100644
index 000000000..f51dddf0e
--- /dev/null
+++ b/test_fixtures/justify_content_min_max.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="max-height: 200px; min-height: 100px; width: 100px; justify-content: center; flex-direction: column;">
+  <div style="width: 60px; height: 60px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_min_width_with_padding_child_width_greater_than_parent.html b/test_fixtures/justify_content_min_width_with_padding_child_width_greater_than_parent.html
new file mode 100644
index 000000000..628e1a4a3
--- /dev/null
+++ b/test_fixtures/justify_content_min_width_with_padding_child_width_greater_than_parent.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 1000px; height: 1584px; align-content: stretch; flex-direction: column;">
+    <div style="flex-direction: row; align-content: stretch;">
+        <div style="flex-direction: row; justify-content: center; align-content: stretch; min-width: 400px; padding-left: 100px; padding-right: 100px;">
+            <div style="height: 100px; width: 300px; align-content: stretch; flex-direction: row;"></div>
+        </div>
+    </div>
+</div>>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_min_width_with_padding_child_width_lower_than_parent.html b/test_fixtures/justify_content_min_width_with_padding_child_width_lower_than_parent.html
new file mode 100644
index 000000000..4a3c5f024
--- /dev/null
+++ b/test_fixtures/justify_content_min_width_with_padding_child_width_lower_than_parent.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 1080px; height: 1584px; align-content: stretch; flex-direction: column;">
+    <div style="flex-direction: row; align-content: stretch;">
+        <div style="flex-direction: row; justify-content: center; align-content: stretch; min-width: 400px; padding-left: 100px; padding-right: 100px;">
+            <div style="height: 100px; width: 199px; align-content: stretch; flex-direction: row;"></div>
+        </div>
+    </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_overflow_min_max.html b/test_fixtures/justify_content_overflow_min_max.html
new file mode 100644
index 000000000..41f78c570
--- /dev/null
+++ b/test_fixtures/justify_content_overflow_min_max.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="min-height: 100px; max-height: 110px; justify-content: center; flex-direction: column;">
+  <div style="width: 50px; height: 50px;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_row_center.html b/test_fixtures/justify_content_row_center.html
new file mode 100644
index 000000000..a592b3f59
--- /dev/null
+++ b/test_fixtures/justify_content_row_center.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row; justify-content: center;">
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_row_flex_end.html b/test_fixtures/justify_content_row_flex_end.html
new file mode 100644
index 000000000..9f69ae258
--- /dev/null
+++ b/test_fixtures/justify_content_row_flex_end.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row; justify-content: flex-end;">
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_row_flex_start.html b/test_fixtures/justify_content_row_flex_start.html
new file mode 100644
index 000000000..9a27329dd
--- /dev/null
+++ b/test_fixtures/justify_content_row_flex_start.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row; justify-content: flex-start;">
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_row_max_width_and_margin.html b/test_fixtures/justify_content_row_max_width_and_margin.html
new file mode 100644
index 000000000..db162a7e1
--- /dev/null
+++ b/test_fixtures/justify_content_row_max_width_and_margin.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; max-width: 80px; margin-left: 100px; justify-content: center; flex-direction: row;">
+  <div style="height: 20px; width: 20px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_row_min_width_and_margin.html b/test_fixtures/justify_content_row_min_width_and_margin.html
new file mode 100644
index 000000000..902b528ed
--- /dev/null
+++ b/test_fixtures/justify_content_row_min_width_and_margin.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="min-width: 50px; margin-left: 100px; justify-content: center; flex-direction: row;">
+  <div style="height: 20px; width: 20px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_row_space_around.html b/test_fixtures/justify_content_row_space_around.html
new file mode 100644
index 000000000..96c2a6ff0
--- /dev/null
+++ b/test_fixtures/justify_content_row_space_around.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row; justify-content: space-around;">
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_row_space_between.html b/test_fixtures/justify_content_row_space_between.html
new file mode 100644
index 000000000..020c546d9
--- /dev/null
+++ b/test_fixtures/justify_content_row_space_between.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row; justify-content: space-between;">
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+  <div style="width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/justify_content_row_space_evenly.html b/test_fixtures/justify_content_row_space_evenly.html
new file mode 100644
index 000000000..0b1d53b52
--- /dev/null
+++ b/test_fixtures/justify_content_row_space_evenly.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; justify-content: space-evenly; flex-direction: row; ">
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+  <div style="height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_and_flex_column.html b/test_fixtures/margin_and_flex_column.html
new file mode 100644
index 000000000..f263aa408
--- /dev/null
+++ b/test_fixtures/margin_and_flex_column.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: column;">
+  <div style="margin-top: 10px; margin-bottom: 10px; flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_and_flex_row.html b/test_fixtures/margin_and_flex_row.html
new file mode 100644
index 000000000..2418ce24c
--- /dev/null
+++ b/test_fixtures/margin_and_flex_row.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="margin-left: 10px; margin-right: 10px; flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_and_stretch_column.html b/test_fixtures/margin_and_stretch_column.html
new file mode 100644
index 000000000..cc5658576
--- /dev/null
+++ b/test_fixtures/margin_and_stretch_column.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: column;">
+  <div style="margin-left: 10px; margin-right: 10px; flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_and_stretch_row.html b/test_fixtures/margin_and_stretch_row.html
new file mode 100644
index 000000000..4542d3873
--- /dev/null
+++ b/test_fixtures/margin_and_stretch_row.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="margin-top: 10px; margin-bottom: 10px; flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_bottom.html b/test_fixtures/margin_auto_bottom.html
new file mode 100644
index 000000000..a05e91d31
--- /dev/null
+++ b/test_fixtures/margin_auto_bottom.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: center;">
+  <div style="width: 50px; height: 50px; margin-bottom:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_bottom_and_top.html b/test_fixtures/margin_auto_bottom_and_top.html
new file mode 100644
index 000000000..80795887b
--- /dev/null
+++ b/test_fixtures/margin_auto_bottom_and_top.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: center;">
+  <div style="width: 50px; height: 50px; margin-top:auto; margin-bottom:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_bottom_and_top_justify_center.html b/test_fixtures/margin_auto_bottom_and_top_justify_center.html
new file mode 100644
index 000000000..c1254907e
--- /dev/null
+++ b/test_fixtures/margin_auto_bottom_and_top_justify_center.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; justify-content: center;">
+  <div style="width: 50px; height: 50px; margin-top:auto; margin-bottom:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_left.html b/test_fixtures/margin_auto_left.html
new file mode 100644
index 000000000..7224c254e
--- /dev/null
+++ b/test_fixtures/margin_auto_left.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: center;">
+  <div style="width: 50px; height: 50px; margin-left:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_left_and_right.html b/test_fixtures/margin_auto_left_and_right.html
new file mode 100644
index 000000000..36c70dc02
--- /dev/null
+++ b/test_fixtures/margin_auto_left_and_right.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; ">
+  <div style="width: 50px; height: 50px; margin-left:auto; margin-right:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_left_and_right_column.html b/test_fixtures/margin_auto_left_and_right_column.html
new file mode 100644
index 000000000..d575c7dcb
--- /dev/null
+++ b/test_fixtures/margin_auto_left_and_right_column.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: center; flex-direction: row;">
+  <div style="width: 50px; height: 50px; margin-left: auto; margin-right: auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_left_and_right_column_and_center.html b/test_fixtures/margin_auto_left_and_right_column_and_center.html
new file mode 100644
index 000000000..bf0b34d68
--- /dev/null
+++ b/test_fixtures/margin_auto_left_and_right_column_and_center.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: center;">
+  <div style="width: 50px; height: 50px; margin-left:auto; margin-right:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_left_and_right_strech.html b/test_fixtures/margin_auto_left_and_right_strech.html
new file mode 100644
index 000000000..229b448b1
--- /dev/null
+++ b/test_fixtures/margin_auto_left_and_right_strech.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction:row; align-items: stretch;">
+  <div style="width: 50px; height: 50px; margin-left:auto; margin-right:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_left_child_bigger_than_parent.html b/test_fixtures/margin_auto_left_child_bigger_than_parent.html
new file mode 100644
index 000000000..731f28abc
--- /dev/null
+++ b/test_fixtures/margin_auto_left_child_bigger_than_parent.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 52px; width: 52px; justify-content: center;">
+  <div style="width: 72px; height: 72px; margin-left: auto;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_left_fix_right_child_bigger_than_parent.html b/test_fixtures/margin_auto_left_fix_right_child_bigger_than_parent.html
new file mode 100644
index 000000000..a604fec1c
--- /dev/null
+++ b/test_fixtures/margin_auto_left_fix_right_child_bigger_than_parent.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 52px; width: 52px; justify-content: center;">
+  <div style="width: 72px; height: 72px; margin-left: auto; margin-right: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_left_right_child_bigger_than_parent.html b/test_fixtures/margin_auto_left_right_child_bigger_than_parent.html
new file mode 100644
index 000000000..9945a69f5
--- /dev/null
+++ b/test_fixtures/margin_auto_left_right_child_bigger_than_parent.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 52px; width: 52px; justify-content: center;">
+  <div style="width: 72px; height: 72px; margin-left: auto; margin-right:auto;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_left_stretching_child.html b/test_fixtures/margin_auto_left_stretching_child.html
new file mode 100644
index 000000000..7a7aa2018
--- /dev/null
+++ b/test_fixtures/margin_auto_left_stretching_child.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: center;">
+  <div style="flex: 1; margin-left:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_mutiple_children_column.html b/test_fixtures/margin_auto_mutiple_children_column.html
new file mode 100644
index 000000000..a75288c52
--- /dev/null
+++ b/test_fixtures/margin_auto_mutiple_children_column.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: column; align-items: center;">
+  <div style="width: 50px; height: 50px; margin-top:auto;"></div>
+  <div style="width: 50px; height: 50px; margin-top:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_mutiple_children_row.html b/test_fixtures/margin_auto_mutiple_children_row.html
new file mode 100644
index 000000000..05be0c785
--- /dev/null
+++ b/test_fixtures/margin_auto_mutiple_children_row.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction:row; align-items: center;">
+  <div style="width: 50px; height: 50px; margin-right:auto;"></div>
+  <div style="width: 50px; height: 50px; margin-right:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_right.html b/test_fixtures/margin_auto_right.html
new file mode 100644
index 000000000..c392be1a0
--- /dev/null
+++ b/test_fixtures/margin_auto_right.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: center;">
+  <div style="width: 50px; height: 50px; margin-right:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_top.html b/test_fixtures/margin_auto_top.html
new file mode 100644
index 000000000..35dcb1692
--- /dev/null
+++ b/test_fixtures/margin_auto_top.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: center;">
+  <div style="width: 50px; height: 50px; margin-top:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_top_and_bottom_strech.html b/test_fixtures/margin_auto_top_and_bottom_strech.html
new file mode 100644
index 000000000..ca117b380
--- /dev/null
+++ b/test_fixtures/margin_auto_top_and_bottom_strech.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: column; align-items: stretch;">
+  <div style="width: 50px; height: 50px; margin-top:auto; margin-bottom:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_auto_top_stretching_child.html b/test_fixtures/margin_auto_top_stretching_child.html
new file mode 100644
index 000000000..f99cda48d
--- /dev/null
+++ b/test_fixtures/margin_auto_top_stretching_child.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: center;">
+  <div style="flex: 1; margin-top:auto;"></div>
+  <div style="width: 50px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_bottom.html b/test_fixtures/margin_bottom.html
new file mode 100644
index 000000000..dd5b6a4b6
--- /dev/null
+++ b/test_fixtures/margin_bottom.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; justify-content: flex-end; flex-direction: column;">
+  <div style="height: 10px; margin-bottom: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_fix_left_auto_right_child_bigger_than_parent.html b/test_fixtures/margin_fix_left_auto_right_child_bigger_than_parent.html
new file mode 100644
index 000000000..418b21b7f
--- /dev/null
+++ b/test_fixtures/margin_fix_left_auto_right_child_bigger_than_parent.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 52px; width: 52px; justify-content: center;">
+  <div style="width: 72px; height: 72px; margin-left: 10px; margin-right: auto;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_left.html b/test_fixtures/margin_left.html
new file mode 100644
index 000000000..1dbf09cd0
--- /dev/null
+++ b/test_fixtures/margin_left.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="width: 10px; margin-left: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_right.html b/test_fixtures/margin_right.html
new file mode 100644
index 000000000..63d71b9d4
--- /dev/null
+++ b/test_fixtures/margin_right.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row; justify-content: flex-end;">
+  <div style="width: 10px; margin-right: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_should_not_be_part_of_max_height.html b/test_fixtures/margin_should_not_be_part_of_max_height.html
new file mode 100644
index 000000000..382d789c3
--- /dev/null
+++ b/test_fixtures/margin_should_not_be_part_of_max_height.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 250px; height: 250px;">
+  <div style="width: 100px; height: 100px; max-height: 100px; margin-top: 20px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_should_not_be_part_of_max_width.html b/test_fixtures/margin_should_not_be_part_of_max_width.html
new file mode 100644
index 000000000..015742ea8
--- /dev/null
+++ b/test_fixtures/margin_should_not_be_part_of_max_width.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 250px; height: 250px;">
+  <div style="width: 100px; height: 100px; max-width: 100px; margin-left: 20px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_top.html b/test_fixtures/margin_top.html
new file mode 100644
index 000000000..f0c3780dc
--- /dev/null
+++ b/test_fixtures/margin_top.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: column;">
+  <div style="height: 10px; margin-top: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_with_sibling_column.html b/test_fixtures/margin_with_sibling_column.html
new file mode 100644
index 000000000..a04aaeaae
--- /dev/null
+++ b/test_fixtures/margin_with_sibling_column.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: column;">
+  <div style="margin-bottom: 10px; flex-grow: 1;"></div>
+  <div style="flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/margin_with_sibling_row.html b/test_fixtures/margin_with_sibling_row.html
new file mode 100644
index 000000000..ca55d518f
--- /dev/null
+++ b/test_fixtures/margin_with_sibling_row.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="margin-right: 10px; flex-grow: 1;"></div>
+  <div style="flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/max_height.html b/test_fixtures/max_height.html
new file mode 100644
index 000000000..3a2052c41
--- /dev/null
+++ b/test_fixtures/max_height.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="width: 10px; max-height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/max_height_overrides_height.html b/test_fixtures/max_height_overrides_height.html
new file mode 100644
index 000000000..b4fc03391
--- /dev/null
+++ b/test_fixtures/max_height_overrides_height.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root">
+  <div style="max-height: 100px; height: 200px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/max_height_overrides_height_on_root.html b/test_fixtures/max_height_overrides_height_on_root.html
new file mode 100644
index 000000000..dd41f7a54
--- /dev/null
+++ b/test_fixtures/max_height_overrides_height_on_root.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="max-height: 100px; height: 200px;">
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/max_width.html b/test_fixtures/max_width.html
new file mode 100644
index 000000000..b6d9db15d
--- /dev/null
+++ b/test_fixtures/max_width.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: column;">
+  <div style="height: 10px; max-width: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/max_width_overrides_width.html b/test_fixtures/max_width_overrides_width.html
new file mode 100644
index 000000000..c84960c4c
--- /dev/null
+++ b/test_fixtures/max_width_overrides_width.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root">
+  <div style="max-width: 100px; width: 200px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/max_width_overrides_width_on_root.html b/test_fixtures/max_width_overrides_width_on_root.html
new file mode 100644
index 000000000..7a7d90a9b
--- /dev/null
+++ b/test_fixtures/max_width_overrides_width_on_root.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="max-width: 100px; width: 200px;">
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/min_height.html b/test_fixtures/min_height.html
new file mode 100644
index 000000000..095e17a79
--- /dev/null
+++ b/test_fixtures/min_height.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: column;">
+  <div style="flex-grow: 1; min-height: 60px;"></div>
+  <div style="flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/min_height_overrides_height.html b/test_fixtures/min_height_overrides_height.html
new file mode 100644
index 000000000..ed936504b
--- /dev/null
+++ b/test_fixtures/min_height_overrides_height.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root">
+  <div style="min-height: 100px; height: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/min_height_overrides_height_on_root.html b/test_fixtures/min_height_overrides_height_on_root.html
new file mode 100644
index 000000000..2f3d431b0
--- /dev/null
+++ b/test_fixtures/min_height_overrides_height_on_root.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="min-height: 100px; height: 50px;">
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/min_max_percent_no_width_height.html b/test_fixtures/min_max_percent_no_width_height.html
new file mode 100644
index 000000000..fc49401b8
--- /dev/null
+++ b/test_fixtures/min_max_percent_no_width_height.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; align-items: flex-start; flex-direction: column;">
+  <div style="min-width: 10%; max-width: 10%; min-height: 10%; max-height: 10%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/min_width.html b/test_fixtures/min_width.html
new file mode 100644
index 000000000..b9b21d905
--- /dev/null
+++ b/test_fixtures/min_width.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row">
+  <div style="flex-grow: 1; min-width: 60px;"></div>
+  <div style="flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/min_width_overrides_width.html b/test_fixtures/min_width_overrides_width.html
new file mode 100644
index 000000000..1d05c2527
--- /dev/null
+++ b/test_fixtures/min_width_overrides_width.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root">
+  <div style="min-width: 100px; width: 50px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/min_width_overrides_width_on_root.html b/test_fixtures/min_width_overrides_width_on_root.html
new file mode 100644
index 000000000..d0bf7c2b5
--- /dev/null
+++ b/test_fixtures/min_width_overrides_width_on_root.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="min-width: 100px; width: 50px;">
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/nested_overflowing_child.html b/test_fixtures/nested_overflowing_child.html
new file mode 100644
index 000000000..2400fe479
--- /dev/null
+++ b/test_fixtures/nested_overflowing_child.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 100px;">
+  <div>
+    <div style="height: 200px; width: 200px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/nested_overflowing_child_in_constraint_parent.html b/test_fixtures/nested_overflowing_child_in_constraint_parent.html
new file mode 100644
index 000000000..723aa1a7a
--- /dev/null
+++ b/test_fixtures/nested_overflowing_child_in_constraint_parent.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; width: 100px;">
+  <div style="height: 100px; width: 100px;">
+    <div style="height: 200px; width: 200px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/overflow_cross_axis.html b/test_fixtures/overflow_cross_axis.html
new file mode 100644
index 000000000..1f706337a
--- /dev/null
+++ b/test_fixtures/overflow_cross_axis.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width:100px; height: 100px;">
+  <div style="height: 200px; width: 100px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/overflow_main_axis.html b/test_fixtures/overflow_main_axis.html
new file mode 100644
index 000000000..a800dd679
--- /dev/null
+++ b/test_fixtures/overflow_main_axis.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width:100px; height: 100px;">
+  <div style="width: 200px; flex-shrink: 0;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/padding_align_end_child.html b/test_fixtures/padding_align_end_child.html
new file mode 100644
index 000000000..31b88733c
--- /dev/null
+++ b/test_fixtures/padding_align_end_child.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; justify-content: flex-end; align-items: flex-end;">
+  <div style="width: 100px; height: 100px; padding: 20px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/padding_center_child.html b/test_fixtures/padding_center_child.html
new file mode 100644
index 000000000..547f7334b
--- /dev/null
+++ b/test_fixtures/padding_center_child.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; padding-left: 10px; padding-top: 10px; padding-right: 20px; padding-bottom: 20px; align-items: center; justify-content: center;">
+  <div style="height: 10px; width: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/padding_flex_child.html b/test_fixtures/padding_flex_child.html
new file mode 100644
index 000000000..dfcf1b3b4
--- /dev/null
+++ b/test_fixtures/padding_flex_child.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; padding: 10px;">
+  <div style="width: 10px; flex-grow:1"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/padding_no_child.html b/test_fixtures/padding_no_child.html
new file mode 100644
index 000000000..ed6f22031
--- /dev/null
+++ b/test_fixtures/padding_no_child.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="padding: 10px;">
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/padding_stretch_child.html b/test_fixtures/padding_stretch_child.html
new file mode 100644
index 000000000..d50d05ef5
--- /dev/null
+++ b/test_fixtures/padding_stretch_child.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; padding: 10px;">
+  <div style="height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/parent_wrap_child_size_overflowing_parent.html b/test_fixtures/parent_wrap_child_size_overflowing_parent.html
new file mode 100644
index 000000000..03f11e0fd
--- /dev/null
+++ b/test_fixtures/parent_wrap_child_size_overflowing_parent.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px;">
+  <div style="width: 100px;">
+    <div style="width: 100px; height: 200px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percent_absolute_position.html b/test_fixtures/percent_absolute_position.html
new file mode 100644
index 000000000..ec033bdc0
--- /dev/null
+++ b/test_fixtures/percent_absolute_position.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 60px; height: 50px; flex-direction: column;">
+  <div style="height: 50px; width: 100%; left: 50%; position: absolute; flex-direction: row;">
+    <div style="width: 100%;"></div>
+    <div style="width: 100%;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percent_within_flex_grow.html b/test_fixtures/percent_within_flex_grow.html
new file mode 100644
index 000000000..be0372bae
--- /dev/null
+++ b/test_fixtures/percent_within_flex_grow.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="flex-direction:row; width: 350px; height: 100px;">
+  <div style="width:100px;"></div>
+  <div style="flex-grow: 1; flex-direction: column;">
+      <div style="width:100%;"></div>
+  </div>
+  <div style="width: 100px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_absolute_position.html b/test_fixtures/percentage_absolute_position.html
new file mode 100644
index 000000000..48281261c
--- /dev/null
+++ b/test_fixtures/percentage_absolute_position.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 100px; flex-direction: column;">
+  <div style="position: absolute; top: 10%; left: 30%; width: 10px; height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_container_in_wrapping_container.html b/test_fixtures/percentage_container_in_wrapping_container.html
new file mode 100644
index 000000000..9b5d7c34b
--- /dev/null
+++ b/test_fixtures/percentage_container_in_wrapping_container.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="align-items: center; width: 200px; height: 200px; justify-content: center; flex-direction: column;">
+  <div style="flex-direction: column;">
+    <div style="alignItems: center; flex-direction: row; justify-content: center; width: 100%;">
+      <div style="width: 50px; height: 50px;"></div>
+      <div style="width: 50px; height: 50px;"></div>
+    </div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_flex_basis.html b/test_fixtures/percentage_flex_basis.html
new file mode 100644
index 000000000..711cadf56
--- /dev/null
+++ b/test_fixtures/percentage_flex_basis.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: row;">
+  <div style="flex-grow: 1; flex-basis: 50%;"></div>
+  <div style="flex-grow: 1; flex-basis: 25%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_flex_basis_cross.html b/test_fixtures/percentage_flex_basis_cross.html
new file mode 100644
index 000000000..b403adbca
--- /dev/null
+++ b/test_fixtures/percentage_flex_basis_cross.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; flex-basis: 50%;"></div>
+  <div style="flex-grow: 1; flex-basis: 25%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_flex_basis_cross_max_height.html b/test_fixtures/percentage_flex_basis_cross_max_height.html
new file mode 100644
index 000000000..2a692db28
--- /dev/null
+++ b/test_fixtures/percentage_flex_basis_cross_max_height.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; flex-basis: 10%; max-height: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 10%; max-height: 20%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_flex_basis_cross_max_width.html b/test_fixtures/percentage_flex_basis_cross_max_width.html
new file mode 100644
index 000000000..323e0d2d2
--- /dev/null
+++ b/test_fixtures/percentage_flex_basis_cross_max_width.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; flex-basis: 10%; max-width: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 15%; max-width: 20%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_flex_basis_cross_min_height.html b/test_fixtures/percentage_flex_basis_cross_min_height.html
new file mode 100644
index 000000000..8028cfeb1
--- /dev/null
+++ b/test_fixtures/percentage_flex_basis_cross_min_height.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; min-height: 60%;"></div>
+  <div style="flex-grow: 2; min-height: 10%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_flex_basis_cross_min_width.html b/test_fixtures/percentage_flex_basis_cross_min_width.html
new file mode 100644
index 000000000..1c9d8a5e6
--- /dev/null
+++ b/test_fixtures/percentage_flex_basis_cross_min_width.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; flex-basis: 10%; min-width: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 15%; min-width: 20%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_flex_basis_main_max_height.html b/test_fixtures/percentage_flex_basis_main_max_height.html
new file mode 100644
index 000000000..278d59717
--- /dev/null
+++ b/test_fixtures/percentage_flex_basis_main_max_height.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: row;">
+  <div style="flex-grow: 1; flex-basis: 10%; max-height: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 10%; max-height: 20%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_flex_basis_main_max_width.html b/test_fixtures/percentage_flex_basis_main_max_width.html
new file mode 100644
index 000000000..98af71dd2
--- /dev/null
+++ b/test_fixtures/percentage_flex_basis_main_max_width.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: row;">
+  <div style="flex-grow: 1; flex-basis: 15%; max-width: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 10%; max-width: 20%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_flex_basis_main_min_width.html b/test_fixtures/percentage_flex_basis_main_min_width.html
new file mode 100644
index 000000000..7f0b1b209
--- /dev/null
+++ b/test_fixtures/percentage_flex_basis_main_min_width.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: row;">
+  <div style="flex-grow: 1; flex-basis: 15%; min-width: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 10%; min-width: 20%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_margin_should_calculate_based_only_on_width.html b/test_fixtures/percentage_margin_should_calculate_based_only_on_width.html
new file mode 100644
index 000000000..9af2136f6
--- /dev/null
+++ b/test_fixtures/percentage_margin_should_calculate_based_only_on_width.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 100px; flex-direction: column;">
+  <div style="flex-grow: 1; margin: 10%; flex-direction: column;">
+    <div style="width: 10px; height: 10px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_multiple_nested_with_padding_margin_and_percentage_values.html b/test_fixtures/percentage_multiple_nested_with_padding_margin_and_percentage_values.html
new file mode 100644
index 000000000..44fdbdda5
--- /dev/null
+++ b/test_fixtures/percentage_multiple_nested_with_padding_margin_and_percentage_values.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; flex-basis: 10%; min-width: 60%; margin: 5px; padding: 3px; flex-direction: column;">
+    <div style="width: 50%; margin: 5px; padding: 3%; flex-direction: column;">
+      <div style="width: 45%; margin: 5%; padding: 3px;"></div>
+    </div>
+  </div>
+  <div style="flex-grow: 4; flex-basis: 15%; min-width: 20%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_padding_should_calculate_based_only_on_width.html b/test_fixtures/percentage_padding_should_calculate_based_only_on_width.html
new file mode 100644
index 000000000..8cf0f8010
--- /dev/null
+++ b/test_fixtures/percentage_padding_should_calculate_based_only_on_width.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 100px; flex-direction: column;">
+  <div style="flex-grow: 1; padding: 10%; flex-direction: column;">
+    <div style="width: 10px; height: 10px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_position_bottom_right.html b/test_fixtures/percentage_position_bottom_right.html
new file mode 100644
index 000000000..5a065daf6
--- /dev/null
+++ b/test_fixtures/percentage_position_bottom_right.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 500px; height: 500px; flex-direction: row;">
+  <div style="width: 55%; height: 15%; bottom: 10%; right: 20%"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_position_left_top.html b/test_fixtures/percentage_position_left_top.html
new file mode 100644
index 000000000..ca838f79e
--- /dev/null
+++ b/test_fixtures/percentage_position_left_top.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 400px; height: 400px; flex-direction: row;">
+  <div style="width: 45%; height: 55%; left: 10%; top: 20%"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_width_height.html b/test_fixtures/percentage_width_height.html
new file mode 100644
index 000000000..74001a931
--- /dev/null
+++ b/test_fixtures/percentage_width_height.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; flex-direction: row;">
+  <div style="width: 30%; height: 30%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/percentage_width_height_undefined_parent_size.html b/test_fixtures/percentage_width_height_undefined_parent_size.html
new file mode 100644
index 000000000..dae6f3a8d
--- /dev/null
+++ b/test_fixtures/percentage_width_height_undefined_parent_size.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="flex-direction: column;">
+  <div style="width: 50%; height: 50%;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/rounding_flex_basis_flex_grow_row_prime_number_width.html b/test_fixtures/rounding_flex_basis_flex_grow_row_prime_number_width.html
new file mode 100644
index 000000000..99e149c94
--- /dev/null
+++ b/test_fixtures/rounding_flex_basis_flex_grow_row_prime_number_width.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 113px; height: 100px; flex-direction: row;">
+ <div style="flex-grow: 1;"></div>
+ <div style="flex-grow: 1;"></div>
+ <div style="flex-grow: 1;"></div>
+ <div style="flex-grow: 1;"></div>
+ <div style="flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/rounding_flex_basis_flex_grow_row_width_of_100.html b/test_fixtures/rounding_flex_basis_flex_grow_row_width_of_100.html
new file mode 100644
index 000000000..42f2e4dac
--- /dev/null
+++ b/test_fixtures/rounding_flex_basis_flex_grow_row_width_of_100.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; flex-direction: row;">
+ <div style="flex-grow: 1;"></div>
+ <div style="flex-grow: 1;"></div>
+ <div style="flex-grow: 1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/rounding_flex_basis_flex_shrink_row.html b/test_fixtures/rounding_flex_basis_flex_shrink_row.html
new file mode 100644
index 000000000..c66b3c252
--- /dev/null
+++ b/test_fixtures/rounding_flex_basis_flex_shrink_row.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 101px; height: 100px; flex-direction: row;">
+ <div style="flex-basis: 100px; flex-shrink: 1;"></div>
+ <div style="flex-basis: 25px;"></div>
+ <div style="flex-basis: 25px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/rounding_flex_basis_overrides_main_size.html b/test_fixtures/rounding_flex_basis_overrides_main_size.html
new file mode 100644
index 000000000..f1967fcb8
--- /dev/null
+++ b/test_fixtures/rounding_flex_basis_overrides_main_size.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 113px; width: 100px; flex-direction: column;">
+ <div style="height: 20px; flex-grow:1; flex-basis:50px;"></div>
+ <div style="height: 10px; flex-grow:1;"></div>
+ <div style="height: 10px; flex-grow:1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/rounding_fractial_input_1.html b/test_fixtures/rounding_fractial_input_1.html
new file mode 100644
index 000000000..b5288f857
--- /dev/null
+++ b/test_fixtures/rounding_fractial_input_1.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 113.4px; width: 100px; flex-direction: column;">
+  <div style="height: 20px; flex-grow:1; flex-basis:50px;"></div>
+  <div style="height: 10px; flex-grow:1;"></div>
+  <div style="height: 10px; flex-grow:1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/rounding_fractial_input_2.html b/test_fixtures/rounding_fractial_input_2.html
new file mode 100644
index 000000000..20360cb94
--- /dev/null
+++ b/test_fixtures/rounding_fractial_input_2.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 113.6px; width: 100px; flex-direction: column;">
+  <div style="height: 20px; flex-grow:1; flex-basis:50px;"></div>
+  <div style="height: 10px; flex-grow:1;"></div>
+  <div style="height: 10px; flex-grow:1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/rounding_fractial_input_3.html b/test_fixtures/rounding_fractial_input_3.html
new file mode 100644
index 000000000..b5288f857
--- /dev/null
+++ b/test_fixtures/rounding_fractial_input_3.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 113.4px; width: 100px; flex-direction: column;">
+  <div style="height: 20px; flex-grow:1; flex-basis:50px;"></div>
+  <div style="height: 10px; flex-grow:1;"></div>
+  <div style="height: 10px; flex-grow:1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/rounding_fractial_input_4.html b/test_fixtures/rounding_fractial_input_4.html
new file mode 100644
index 000000000..b5288f857
--- /dev/null
+++ b/test_fixtures/rounding_fractial_input_4.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 113.4px; width: 100px; flex-direction: column;">
+  <div style="height: 20px; flex-grow:1; flex-basis:50px;"></div>
+  <div style="height: 10px; flex-grow:1;"></div>
+  <div style="height: 10px; flex-grow:1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/rounding_total_fractial.html b/test_fixtures/rounding_total_fractial.html
new file mode 100644
index 000000000..a87b15fcf
--- /dev/null
+++ b/test_fixtures/rounding_total_fractial.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 113.4px; width: 87.4px; flex-direction: column;">
+ <div style="height: 20.3px; flex-grow:0.7; flex-basis:50.3px;"></div>
+ <div style="height: 10px; flex-grow:1.6;"></div>
+ <div style="height: 10.7px; flex-grow:1.1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/rounding_total_fractial_nested.html b/test_fixtures/rounding_total_fractial_nested.html
new file mode 100644
index 000000000..f5e9f6694
--- /dev/null
+++ b/test_fixtures/rounding_total_fractial_nested.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 113.4px; width: 87.4px; flex-direction: column;">
+ <div style="height: 20.3px; flex-grow:0.7; flex-basis:50.3px; flex-direction: column;">
+   <div style="bottom: 13.3px; height: 9.9px; flex-grow:1; flex-basis:0.3px;"></div>
+   <div style="top: 13.3px; height: 1.1px; flex-grow:4; flex-basis:0.3px;"></div>
+ </div>
+ <div style="height: 10px; flex-grow:1.6;"></div>
+ <div style="height: 10.7px; flex-grow:1.1;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/size_defined_by_child.html b/test_fixtures/size_defined_by_child.html
new file mode 100644
index 000000000..baef13082
--- /dev/null
+++ b/test_fixtures/size_defined_by_child.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root">
+  <div style="width: 100px; height: 100px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/size_defined_by_child_with_border.html b/test_fixtures/size_defined_by_child_with_border.html
new file mode 100644
index 000000000..397363650
--- /dev/null
+++ b/test_fixtures/size_defined_by_child_with_border.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="border-width: 10px;">
+  <div style="width: 10px; height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/size_defined_by_child_with_padding.html b/test_fixtures/size_defined_by_child_with_padding.html
new file mode 100644
index 000000000..759e8182d
--- /dev/null
+++ b/test_fixtures/size_defined_by_child_with_padding.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="padding: 10px;">
+  <div style="width: 10px; height: 10px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/size_defined_by_grand_child.html b/test_fixtures/size_defined_by_grand_child.html
new file mode 100644
index 000000000..1030077bf
--- /dev/null
+++ b/test_fixtures/size_defined_by_grand_child.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root">
+  <div>
+    <div style="width: 100px; height: 100px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_column.html b/test_fixtures/wrap_column.html
new file mode 100644
index 000000000..16bf03588
--- /dev/null
+++ b/test_fixtures/wrap_column.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 100px; flex-wrap: wrap; flex-direction: column;">
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_nodes_with_content_sizing_margin_cross.html b/test_fixtures/wrap_nodes_with_content_sizing_margin_cross.html
new file mode 100644
index 000000000..256a5df4c
--- /dev/null
+++ b/test_fixtures/wrap_nodes_with_content_sizing_margin_cross.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 500px; height: 500px; flex-direction: column;">
+  <div style="flex-direction: row; flex-wrap: wrap; width: 70px;">
+    <div style="flex-direction: column;">
+      <div style="height: 40px; width: 40px;"></div>
+    </div>
+    <div style="margin-top: 10px; flex-direction: column;">
+      <div style="height: 40px; width: 40px;"></div>
+    </div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_nodes_with_content_sizing_overflowing_margin.html b/test_fixtures/wrap_nodes_with_content_sizing_overflowing_margin.html
new file mode 100644
index 000000000..863996613
--- /dev/null
+++ b/test_fixtures/wrap_nodes_with_content_sizing_overflowing_margin.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 500px; height: 500px; flex-direction: column;">
+  <div style="flex-direction: row; flex-wrap: wrap; width: 85px;">
+    <div style="flex-direction: column;">
+      <div style="height: 40px; width: 40px;"></div>
+    </div>
+    <div style="margin-right: 10px; flex-direction: column;">
+      <div style="height: 40px; width: 40px;"></div>
+    </div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_reverse_column_fixed_size.html b/test_fixtures/wrap_reverse_column_fixed_size.html
new file mode 100644
index 000000000..fe85bfcb4
--- /dev/null
+++ b/test_fixtures/wrap_reverse_column_fixed_size.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 100px; flex-direction: column; flex-wrap: wrap-reverse; align-items: center;">
+  <div style="height: 10px; width: 30px;"></div>
+  <div style="height: 20px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 40px; width: 30px;"></div>
+  <div style="height: 50px; width: 30px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_reverse_row_align_content_center.html b/test_fixtures/wrap_reverse_row_align_content_center.html
new file mode 100644
index 000000000..5308f20ad
--- /dev/null
+++ b/test_fixtures/wrap_reverse_row_align_content_center.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; flex-direction: row; flex-wrap: wrap-reverse; align-content: center;">
+  <div style="height: 10px; width: 30px;"></div>
+  <div style="height: 20px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 40px; width: 30px;"></div>
+  <div style="height: 50px; width: 30px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_reverse_row_align_content_flex_start.html b/test_fixtures/wrap_reverse_row_align_content_flex_start.html
new file mode 100644
index 000000000..65351a02e
--- /dev/null
+++ b/test_fixtures/wrap_reverse_row_align_content_flex_start.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; flex-direction: row; flex-wrap: wrap-reverse; align-content: flex-start;">
+  <div style="height: 10px; width: 30px;"></div>
+  <div style="height: 20px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 40px; width: 30px;"></div>
+  <div style="height: 50px; width: 30px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_reverse_row_align_content_space_around.html b/test_fixtures/wrap_reverse_row_align_content_space_around.html
new file mode 100644
index 000000000..607336f66
--- /dev/null
+++ b/test_fixtures/wrap_reverse_row_align_content_space_around.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; flex-direction: row; flex-wrap: wrap-reverse; align-content: space-around;">
+  <div style="height: 10px; width: 30px;"></div>
+  <div style="height: 20px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 40px; width: 30px;"></div>
+  <div style="height: 50px; width: 30px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_reverse_row_align_content_stretch.html b/test_fixtures/wrap_reverse_row_align_content_stretch.html
new file mode 100644
index 000000000..494b59796
--- /dev/null
+++ b/test_fixtures/wrap_reverse_row_align_content_stretch.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; flex-direction: row; flex-wrap: wrap-reverse; align-content: stretch;">
+  <div style="height: 10px; width: 30px;"></div>
+  <div style="height: 20px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 40px; width: 30px;"></div>
+  <div style="height: 50px; width: 30px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_reverse_row_single_line_different_size.html b/test_fixtures/wrap_reverse_row_single_line_different_size.html
new file mode 100644
index 000000000..c991a13da
--- /dev/null
+++ b/test_fixtures/wrap_reverse_row_single_line_different_size.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 300px; flex-direction: row; flex-wrap: wrap-reverse; align-content: flex-start;">
+  <div style="height: 10px; width: 30px;"></div>
+  <div style="height: 20px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 40px; width: 30px;"></div>
+  <div style="height: 50px; width: 30px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_row.html b/test_fixtures/wrap_row.html
new file mode 100644
index 000000000..111b5ea8c
--- /dev/null
+++ b/test_fixtures/wrap_row.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; flex-direction: row; flex-wrap: wrap">
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_row_align_items_center.html b/test_fixtures/wrap_row_align_items_center.html
new file mode 100644
index 000000000..91414cc0d
--- /dev/null
+++ b/test_fixtures/wrap_row_align_items_center.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; flex-direction: row; flex-wrap: wrap; align-items: center;">
+  <div style="height: 10px; width: 30px;"></div>
+  <div style="height: 20px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrap_row_align_items_flex_end.html b/test_fixtures/wrap_row_align_items_flex_end.html
new file mode 100644
index 000000000..3fcd8cd92
--- /dev/null
+++ b/test_fixtures/wrap_row_align_items_flex_end.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; flex-direction: row; flex-wrap: wrap; align-items: flex-end;">
+  <div style="height: 10px; width: 30px;"></div>
+  <div style="height: 20px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+  <div style="height: 30px; width: 30px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrapped_column_max_height.html b/test_fixtures/wrapped_column_max_height.html
new file mode 100644
index 000000000..00c693aef
--- /dev/null
+++ b/test_fixtures/wrapped_column_max_height.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 500px; width: 700px; flex-direction: column;align-items: center; justify-content: center; align-content: center; flex-wrap:wrap;">
+ <div style="width: 100px; height: 500px; max-height: 200px;"></div>
+ <div style="width: 200px; height: 200px; margin: 20px;"></div>
+ <div style="width: 100px; height: 100px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrapped_column_max_height_flex.html b/test_fixtures/wrapped_column_max_height_flex.html
new file mode 100644
index 000000000..7842d975c
--- /dev/null
+++ b/test_fixtures/wrapped_column_max_height_flex.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="height: 500px; width: 700px; flex-direction: column;align-items: center; justify-content: center; align-content: center; flex-wrap:wrap;">
+ <div style="width: 100px; height: 500px; max-height: 200px; flex: 1;"></div>
+ <div style="width: 200px; height: 200px; margin: 20px; flex: 1"></div>
+ <div style="width: 100px; height: 100px;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrapped_row_within_align_items_center.html b/test_fixtures/wrapped_row_within_align_items_center.html
new file mode 100644
index 000000000..018998a1c
--- /dev/null
+++ b/test_fixtures/wrapped_row_within_align_items_center.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: center; flex-direction: column;">
+  <div style="flex-direction:row; flex-wrap: wrap;">
+    <div style="width: 150px; height: 80px;"></div>
+    <div style="width: 80px; height: 80px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrapped_row_within_align_items_flex_end.html b/test_fixtures/wrapped_row_within_align_items_flex_end.html
new file mode 100644
index 000000000..9be73718a
--- /dev/null
+++ b/test_fixtures/wrapped_row_within_align_items_flex_end.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: flex-end; flex-direction: column;">
+  <div style="flex-direction:row; flex-wrap: wrap;">
+    <div style="width: 150px; height: 80px;"></div>
+    <div style="width: 80px; height: 80px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/wrapped_row_within_align_items_flex_start.html b/test_fixtures/wrapped_row_within_align_items_flex_start.html
new file mode 100644
index 000000000..1a24b747b
--- /dev/null
+++ b/test_fixtures/wrapped_row_within_align_items_flex_start.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <script src="../scripts/gentest/test_helper.js"></script>
+  <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+  <title>
+    Test description
+  </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 200px; height: 200px; align-items: flex-start; flex-direction: column;">
+  <div style="flex-direction:row; flex-wrap: wrap;">
+    <div style="width: 150px; height: 80px;"></div>
+    <div style="width: 80px; height: 80px;"></div>
+  </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/tests/generated.rs b/tests/generated.rs
index 8d6c9c10e..526b4de67 100644
--- a/tests/generated.rs
+++ b/tests/generated.rs
@@ -1,19 +1,586 @@
 #[cfg(test)]
 mod generated {
     #[test]
-    fn sample() {
+    fn justify_content_row_space_around() {
         let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::SpaceAround,
             width: stretch::style::Dimension::Points(100.0),
             height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 12.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 10.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 45.0);
+        assert_eq!(layout.children[1].y, 0.0);
+
+        assert_eq!(layout.children[2].width, 10.0);
+        assert_eq!(layout.children[2].height, 100.0);
+        assert_eq!(layout.children[2].x, 78.0);
+        assert_eq!(layout.children[2].y, 0.0);
+    }
+
+    #[test]
+    fn align_items_center() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(10.0),
+                height: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 45.0);
+    }
+
+    #[test]
+    fn absolute_layout_justify_content_center() {
+        let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(110.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                position: stretch::style::Position::Absolute,
+                width: stretch::style::Dimension::Points(60.0),
+                height: stretch::style::Dimension::Points(40.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 110.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 60.0);
+        assert_eq!(layout.children[0].height, 40.0);
+        assert_eq!(layout.children[0].x, 25.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn margin_auto_bottom_and_top() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        top: stretch::style::Dimension::Auto,
+                        bottom: stretch::style::Dimension::Auto,
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 75.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 50.0);
+        assert_eq!(layout.children[1].y, 75.0);
+    }
+
+    #[test]
+    fn margin_auto_left_and_right_strech() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        start: stretch::style::Dimension::Auto,
+                        end: stretch::style::Dimension::Auto,
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 50.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 150.0);
+        assert_eq!(layout.children[1].y, 0.0);
+    }
+
+    #[test]
+    fn rounding_flex_basis_overrides_main_size() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(113.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 113.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 64.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 25.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 64.0);
+
+        assert_eq!(layout.children[2].width, 100.0);
+        assert_eq!(layout.children[2].height, 24.0);
+        assert_eq!(layout.children[2].x, 0.0);
+        assert_eq!(layout.children[2].y, 89.0);
+    }
+
+    #[test]
+    fn percentage_flex_basis() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.5),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.2),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 125.0);
+        assert_eq!(layout.children[0].height, 200.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 75.0);
+        assert_eq!(layout.children[1].height, 200.0);
+        assert_eq!(layout.children[1].x, 125.0);
+        assert_eq!(layout.children[1].y, 0.0);
+    }
+
+    #[test]
+    fn rounding_fractial_input_3() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(113.4),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 113.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 64.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 25.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 64.0);
+
+        assert_eq!(layout.children[2].width, 100.0);
+        assert_eq!(layout.children[2].height, 24.0);
+        assert_eq!(layout.children[2].x, 0.0);
+        assert_eq!(layout.children[2].y, 89.0);
+    }
+
+    #[test]
+    fn margin_and_stretch_column() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                flex_grow: 1.0,
+                margin: stretch::style::Edges {
+                    start: stretch::style::Dimension::Points(10.0),
+                    end: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 80.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 10.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn wrapped_column_max_height_flex() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            align_items: stretch::style::AlignItems::Center,
+            align_content: stretch::style::AlignContent::Center,
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(700.0),
+            height: stretch::style::Dimension::Points(500.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_shrink: 1.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.0),
+                    width: stretch::style::Dimension::Points(100.0),
+                    height: stretch::style::Dimension::Points(500.0),
+                    max_height: stretch::style::Dimension::Points(200.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_shrink: 1.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.0),
+                    width: stretch::style::Dimension::Points(200.0),
+                    height: stretch::style::Dimension::Points(200.0),
+                    margin: stretch::style::Edges {
+                        start: stretch::style::Dimension::Points(20.0),
+                        end: stretch::style::Dimension::Points(20.0),
+                        top: stretch::style::Dimension::Points(20.0),
+                        bottom: stretch::style::Dimension::Points(20.0),
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(100.0),
+                    height: stretch::style::Dimension::Points(100.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 700.0);
+        assert_eq!(layout.height, 500.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 180.0);
+        assert_eq!(layout.children[0].x, 300.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 200.0);
+        assert_eq!(layout.children[1].height, 180.0);
+        assert_eq!(layout.children[1].x, 250.0);
+        assert_eq!(layout.children[1].y, 200.0);
+
+        assert_eq!(layout.children[2].width, 100.0);
+        assert_eq!(layout.children[2].height, 100.0);
+        assert_eq!(layout.children[2].x, 300.0);
+        assert_eq!(layout.children[2].y, 400.0);
+    }
+
+    #[test]
+    fn align_baseline_nested_child() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Baseline,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_direction: stretch::style::FlexDirection::Column,
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    children: vec![stretch::style::Node {
+                        width: stretch::style::Dimension::Points(50.0),
+                        height: stretch::style::Dimension::Points(10.0),
+                        ..Default::default()
+                    }],
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 20.0);
+        assert_eq!(layout.children[1].x, 50.0);
+        assert_eq!(layout.children[1].y, 40.0);
+
+        assert_eq!(layout.children[1].children[0].width, 50.0);
+        assert_eq!(layout.children[1].children[0].height, 10.0);
+        assert_eq!(layout.children[1].children[0].x, 0.0);
+        assert_eq!(layout.children[1].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn max_height_overrides_height_on_root() {
+        let layout = stretch::compute(&stretch::style::Node {
+            height: stretch::style::Dimension::Points(200.0),
+            max_height: stretch::style::Dimension::Points(100.0),
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 0.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+    }
+
+    #[test]
+    fn padding_center_child() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            padding: stretch::style::Edges {
+                start: stretch::style::Dimension::Points(10.0),
+                end: stretch::style::Dimension::Points(20.0),
+                top: stretch::style::Dimension::Points(10.0),
+                bottom: stretch::style::Dimension::Points(20.0),
+                ..Default::default()
+            },
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(10.0),
+                height: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 40.0);
+        assert_eq!(layout.children[0].y, 40.0);
+    }
+
+    #[test]
+    fn align_flex_start_with_stretching_children() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(500.0),
+            height: stretch::style::Dimension::Points(500.0),
+            children: vec![stretch::style::Node {
+                children: vec![stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_shrink: 1.0,
+                    children: vec![stretch::style::Node {
+                        flex_grow: 1.0,
+                        flex_shrink: 1.0,
+                        ..Default::default()
+                    }],
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 500.0);
+        assert_eq!(layout.height, 500.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 0.0);
+        assert_eq!(layout.children[0].height, 500.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 0.0);
+        assert_eq!(layout.children[0].children[0].height, 500.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].children[0].width, 0.0);
+        assert_eq!(layout.children[0].children[0].children[0].height, 500.0);
+        assert_eq!(layout.children[0].children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn min_width_overrides_width() {
+        let layout = stretch::compute(&stretch::style::Node {
             children: vec![stretch::style::Node {
                 width: stretch::style::Dimension::Points(50.0),
-                children: vec![],
+                min_width: stretch::style::Dimension::Points(100.0),
                 ..Default::default()
             }],
             ..Default::default()
         });
 
         assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 0.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 0.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn flex_wrap_align_stretch_fits_one_row() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(150.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 150.0);
         assert_eq!(layout.height, 100.0);
         assert_eq!(layout.x, 0.0);
         assert_eq!(layout.y, 0.0);
@@ -22,6 +589,7297 @@ mod generated {
         assert_eq!(layout.children[0].height, 100.0);
         assert_eq!(layout.children[0].x, 0.0);
         assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 50.0);
+        assert_eq!(layout.children[1].y, 0.0);
+    }
+
+    #[test]
+    fn justify_content_row_space_evenly() {
+        let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::SpaceEvenly,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 0.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 25.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 0.0);
+        assert_eq!(layout.children[1].height, 10.0);
+        assert_eq!(layout.children[1].x, 50.0);
+        assert_eq!(layout.children[1].y, 0.0);
+
+        assert_eq!(layout.children[2].width, 0.0);
+        assert_eq!(layout.children[2].height, 10.0);
+        assert_eq!(layout.children[2].x, 75.0);
+        assert_eq!(layout.children[2].y, 0.0);
+    }
+
+    #[test]
+    fn absolute_layout_percentage_bottom_based_on_parent_height() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    position: stretch::style::Position::Absolute,
+                    width: stretch::style::Dimension::Points(10.0),
+                    height: stretch::style::Dimension::Points(10.0),
+                    top: stretch::style::Dimension::Percent(0.5),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    position: stretch::style::Position::Absolute,
+                    width: stretch::style::Dimension::Points(10.0),
+                    height: stretch::style::Dimension::Points(10.0),
+                    bottom: stretch::style::Dimension::Percent(0.5),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    position: stretch::style::Position::Absolute,
+                    width: stretch::style::Dimension::Points(10.0),
+                    top: stretch::style::Dimension::Percent(0.1),
+                    bottom: stretch::style::Dimension::Percent(0.1),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 100.0);
+
+        assert_eq!(layout.children[1].width, 10.0);
+        assert_eq!(layout.children[1].height, 10.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 90.0);
+
+        assert_eq!(layout.children[2].width, 10.0);
+        assert_eq!(layout.children[2].height, 160.0);
+        assert_eq!(layout.children[2].x, 0.0);
+        assert_eq!(layout.children[2].y, 20.0);
+    }
+
+    #[test]
+    fn absolute_layout_align_items_and_justify_content_flex_end() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::FlexEnd,
+            justify_content: stretch::style::JustifyContent::FlexEnd,
+            width: stretch::style::Dimension::Points(110.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                position: stretch::style::Position::Absolute,
+                width: stretch::style::Dimension::Points(60.0),
+                height: stretch::style::Dimension::Points(40.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 110.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 60.0);
+        assert_eq!(layout.children[0].height, 40.0);
+        assert_eq!(layout.children[0].x, 50.0);
+        assert_eq!(layout.children[0].y, 60.0);
+    }
+
+    #[test]
+    fn nested_overflowing_child() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                children: vec![stretch::style::Node {
+                    width: stretch::style::Dimension::Points(200.0),
+                    height: stretch::style::Dimension::Points(200.0),
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 200.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 200.0);
+        assert_eq!(layout.children[0].children[0].height, 200.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn flex_direction_row() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 10.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 10.0);
+        assert_eq!(layout.children[1].y, 0.0);
+
+        assert_eq!(layout.children[2].width, 10.0);
+        assert_eq!(layout.children[2].height, 100.0);
+        assert_eq!(layout.children[2].x, 20.0);
+        assert_eq!(layout.children[2].y, 0.0);
+    }
+
+    #[test]
+    fn child_min_max_width_flexing() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(120.0),
+            height: stretch::style::Dimension::Points(50.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_shrink: 0.0,
+                    flex_basis: stretch::style::Dimension::Points(0.0),
+                    min_width: stretch::style::Dimension::Points(60.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_shrink: 0.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.5),
+                    max_width: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 120.0);
+        assert_eq!(layout.height, 50.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 20.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 100.0);
+        assert_eq!(layout.children[1].y, 0.0);
+    }
+
+    #[test]
+    fn absolute_layout_in_wrap_reverse_row_container_flex_end() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                position: stretch::style::Position::Absolute,
+                align_self: stretch::style::AlignSelf::FlexEnd,
+                width: stretch::style::Dimension::Points(20.0),
+                height: stretch::style::Dimension::Points(20.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 20.0);
+        assert_eq!(layout.children[0].height, 20.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn margin_and_flex_column() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                flex_grow: 1.0,
+                margin: stretch::style::Edges {
+                    top: stretch::style::Dimension::Points(10.0),
+                    bottom: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 80.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 10.0);
+    }
+
+    #[test]
+    fn flex_basis_flex_shrink_row() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_basis: stretch::style::Dimension::Points(100.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_basis: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 67.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 33.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 67.0);
+        assert_eq!(layout.children[1].y, 0.0);
+    }
+
+    #[test]
+    fn justify_content_overflow_min_max() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            justify_content: stretch::style::JustifyContent::Center,
+            min_height: stretch::style::Dimension::Points(100.0),
+            max_height: stretch::style::Dimension::Points(110.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 50.0);
+        assert_eq!(layout.height, 110.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 37.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 36.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 37.0);
+
+        assert_eq!(layout.children[2].width, 50.0);
+        assert_eq!(layout.children[2].height, 37.0);
+        assert_eq!(layout.children[2].x, 0.0);
+        assert_eq!(layout.children[2].y, 73.0);
+    }
+
+    #[test]
+    fn wrap_reverse_column_fixed_size() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            align_items: stretch::style::AlignItems::Center,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(30.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(40.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 30.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 135.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 30.0);
+        assert_eq!(layout.children[1].height, 20.0);
+        assert_eq!(layout.children[1].x, 135.0);
+        assert_eq!(layout.children[1].y, 10.0);
+
+        assert_eq!(layout.children[2].width, 30.0);
+        assert_eq!(layout.children[2].height, 30.0);
+        assert_eq!(layout.children[2].x, 135.0);
+        assert_eq!(layout.children[2].y, 30.0);
+
+        assert_eq!(layout.children[3].width, 30.0);
+        assert_eq!(layout.children[3].height, 40.0);
+        assert_eq!(layout.children[3].x, 135.0);
+        assert_eq!(layout.children[3].y, 60.0);
+
+        assert_eq!(layout.children[4].width, 30.0);
+        assert_eq!(layout.children[4].height, 50.0);
+        assert_eq!(layout.children[4].x, 35.0);
+        assert_eq!(layout.children[4].y, 0.0);
+    }
+
+    #[test]
+    fn max_width() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                max_width: stretch::style::Dimension::Points(50.0),
+                height: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn justify_content_row_center() {
+        let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 35.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 10.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 45.0);
+        assert_eq!(layout.children[1].y, 0.0);
+
+        assert_eq!(layout.children[2].width, 10.0);
+        assert_eq!(layout.children[2].height, 100.0);
+        assert_eq!(layout.children[2].x, 55.0);
+        assert_eq!(layout.children[2].y, 0.0);
+    }
+
+    #[test]
+    fn flex_grow_root_minimized() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            min_height: stretch::style::Dimension::Points(100.0),
+            max_height: stretch::style::Dimension::Points(500.0),
+            children: vec![stretch::style::Node {
+                flex_direction: stretch::style::FlexDirection::Column,
+                flex_grow: 1.0,
+                min_height: stretch::style::Dimension::Points(100.0),
+                max_height: stretch::style::Dimension::Points(500.0),
+                children: vec![
+                    stretch::style::Node {
+                        flex_grow: 1.0,
+                        flex_basis: stretch::style::Dimension::Points(200.0),
+                        ..Default::default()
+                    },
+                    stretch::style::Node {
+                        height: stretch::style::Dimension::Points(100.0),
+                        ..Default::default()
+                    },
+                ],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 300.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 300.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 100.0);
+        assert_eq!(layout.children[0].children[0].height, 200.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[1].width, 100.0);
+        assert_eq!(layout.children[0].children[1].height, 100.0);
+        assert_eq!(layout.children[0].children[1].x, 0.0);
+        assert_eq!(layout.children[0].children[1].y, 200.0);
+    }
+
+    #[test]
+    fn container_with_unsized_child() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 0.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn flex_grow_within_constrained_min_row() {
+        let layout = stretch::compute(&stretch::style::Node {
+            min_width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 50.0);
+        assert_eq!(layout.children[1].y, 0.0);
+    }
+
+    #[test]
+    fn absolute_layout_width_height_start_top_end_bottom() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                position: stretch::style::Position::Absolute,
+                width: stretch::style::Dimension::Points(10.0),
+                height: stretch::style::Dimension::Points(10.0),
+                start: stretch::style::Dimension::Points(10.0),
+                end: stretch::style::Dimension::Points(10.0),
+                top: stretch::style::Dimension::Points(10.0),
+                bottom: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 10.0);
+        assert_eq!(layout.children[0].y, 10.0);
+    }
+
+    #[test]
+    fn overflow_main_axis() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                flex_shrink: 0.0,
+                width: stretch::style::Dimension::Points(200.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 200.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn flex_grow_to_min() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            min_height: stretch::style::Dimension::Points(100.0),
+            max_height: stretch::style::Dimension::Points(500.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_shrink: 1.0,
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 50.0);
+    }
+
+    #[test]
+    fn absolute_layout_align_items_and_justify_content_center_and_top_position() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(110.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                position: stretch::style::Position::Absolute,
+                width: stretch::style::Dimension::Points(60.0),
+                height: stretch::style::Dimension::Points(40.0),
+                top: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 110.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 60.0);
+        assert_eq!(layout.children[0].height, 40.0);
+        assert_eq!(layout.children[0].x, 25.0);
+        assert_eq!(layout.children[0].y, 10.0);
+    }
+
+    #[test]
+    fn min_height() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    min_height: stretch::style::Dimension::Points(60.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 80.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 20.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 80.0);
+    }
+
+    #[test]
+    fn justify_content_column_flex_start() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 10.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 10.0);
+
+        assert_eq!(layout.children[2].width, 100.0);
+        assert_eq!(layout.children[2].height, 10.0);
+        assert_eq!(layout.children[2].x, 0.0);
+        assert_eq!(layout.children[2].y, 20.0);
+    }
+
+    #[test]
+    fn absolute_layout_in_wrap_reverse_column_container() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                position: stretch::style::Position::Absolute,
+                width: stretch::style::Dimension::Points(20.0),
+                height: stretch::style::Dimension::Points(20.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 20.0);
+        assert_eq!(layout.children[0].height, 20.0);
+        assert_eq!(layout.children[0].x, 80.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn margin_should_not_be_part_of_max_width() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(250.0),
+            height: stretch::style::Dimension::Points(250.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(100.0),
+                max_width: stretch::style::Dimension::Points(100.0),
+                height: stretch::style::Dimension::Points(100.0),
+                margin: stretch::style::Edges {
+                    start: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 250.0);
+        assert_eq!(layout.height, 250.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 20.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn border_flex_child() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            border: stretch::style::Edges {
+                start: stretch::style::Dimension::Points(10.0),
+                end: stretch::style::Dimension::Points(10.0),
+                top: stretch::style::Dimension::Points(10.0),
+                bottom: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            },
+            children: vec![stretch::style::Node {
+                flex_grow: 1.0,
+                width: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 80.0);
+        assert_eq!(layout.children[0].height, 80.0);
+        assert_eq!(layout.children[0].x, 10.0);
+        assert_eq!(layout.children[0].y, 10.0);
+    }
+
+    #[test]
+    fn margin_right() {
+        let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::FlexEnd,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(10.0),
+                margin: stretch::style::Edges {
+                    end: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 80.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn align_flex_start_with_shrinking_children_with_stretch() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(500.0),
+            height: stretch::style::Dimension::Points(500.0),
+            children: vec![stretch::style::Node {
+                align_items: stretch::style::AlignItems::FlexStart,
+                children: vec![stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_shrink: 1.0,
+                    children: vec![stretch::style::Node {
+                        flex_grow: 1.0,
+                        flex_shrink: 1.0,
+                        ..Default::default()
+                    }],
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 500.0);
+        assert_eq!(layout.height, 500.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 0.0);
+        assert_eq!(layout.children[0].height, 500.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 0.0);
+        assert_eq!(layout.children[0].children[0].height, 0.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].children[0].width, 0.0);
+        assert_eq!(layout.children[0].children[0].children[0].height, 0.0);
+        assert_eq!(layout.children[0].children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn align_items_stretch() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn parent_wrap_child_size_overflowing_parent() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(100.0),
+                children: vec![stretch::style::Node {
+                    width: stretch::style::Dimension::Points(100.0),
+                    height: stretch::style::Dimension::Points(200.0),
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 100.0);
+        assert_eq!(layout.children[0].children[0].height, 200.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn padding_stretch_child() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            padding: stretch::style::Edges {
+                start: stretch::style::Dimension::Points(10.0),
+                end: stretch::style::Dimension::Points(10.0),
+                top: stretch::style::Dimension::Points(10.0),
+                bottom: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            },
+            children: vec![stretch::style::Node {
+                height: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 0.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 10.0);
+        assert_eq!(layout.children[0].y, 10.0);
+    }
+
+    #[test]
+    fn wrap_nodes_with_content_sizing_overflowing_margin() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(500.0),
+            height: stretch::style::Dimension::Points(500.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(85.0),
+                children: vec![
+                    stretch::style::Node {
+                        flex_direction: stretch::style::FlexDirection::Column,
+                        children: vec![stretch::style::Node {
+                            width: stretch::style::Dimension::Points(40.0),
+                            height: stretch::style::Dimension::Points(40.0),
+                            ..Default::default()
+                        }],
+                        ..Default::default()
+                    },
+                    stretch::style::Node {
+                        flex_direction: stretch::style::FlexDirection::Column,
+                        margin: stretch::style::Edges {
+                            end: stretch::style::Dimension::Points(10.0),
+                            ..Default::default()
+                        },
+                        children: vec![stretch::style::Node {
+                            width: stretch::style::Dimension::Points(40.0),
+                            height: stretch::style::Dimension::Points(40.0),
+                            ..Default::default()
+                        }],
+                        ..Default::default()
+                    },
+                ],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 500.0);
+        assert_eq!(layout.height, 500.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 85.0);
+        assert_eq!(layout.children[0].height, 80.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 40.0);
+        assert_eq!(layout.children[0].children[0].height, 40.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].children[0].width, 40.0);
+        assert_eq!(layout.children[0].children[0].children[0].height, 40.0);
+        assert_eq!(layout.children[0].children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[1].width, 40.0);
+        assert_eq!(layout.children[0].children[1].height, 40.0);
+        assert_eq!(layout.children[0].children[1].x, 0.0);
+        assert_eq!(layout.children[0].children[1].y, 40.0);
+
+        assert_eq!(layout.children[0].children[1].children[0].width, 40.0);
+        assert_eq!(layout.children[0].children[1].children[0].height, 40.0);
+        assert_eq!(layout.children[0].children[1].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[1].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn flex_shrink_flex_grow_row() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(500.0),
+            height: stretch::style::Dimension::Points(500.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 0.0,
+                    flex_shrink: 1.0,
+                    width: stretch::style::Dimension::Points(500.0),
+                    height: stretch::style::Dimension::Points(100.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 0.0,
+                    flex_shrink: 1.0,
+                    width: stretch::style::Dimension::Points(500.0),
+                    height: stretch::style::Dimension::Points(100.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 500.0);
+        assert_eq!(layout.height, 500.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 250.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 250.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 250.0);
+        assert_eq!(layout.children[1].y, 0.0);
+    }
+
+    #[test]
+    fn flex_basis_flex_shrink_column() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_basis: stretch::style::Dimension::Points(100.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_basis: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 67.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 33.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 67.0);
+    }
+
+    #[test]
+    fn align_items_min_max() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            align_items: stretch::style::AlignItems::Center,
+            min_width: stretch::style::Dimension::Points(100.0),
+            max_width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(60.0),
+                height: stretch::style::Dimension::Points(60.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 60.0);
+        assert_eq!(layout.children[0].height, 60.0);
+        assert_eq!(layout.children[0].x, 20.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn justify_content_row_min_width_and_margin() {
+        let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::Center,
+            min_width: stretch::style::Dimension::Points(50.0),
+            margin: stretch::style::Edges {
+                start: stretch::style::Dimension::Points(100.0),
+                ..Default::default()
+            },
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(20.0),
+                height: stretch::style::Dimension::Points(20.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 50.0);
+        assert_eq!(layout.height, 20.0);
+        assert_eq!(layout.x, 100.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 20.0);
+        assert_eq!(layout.children[0].height, 20.0);
+        assert_eq!(layout.children[0].x, 15.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn align_self_flex_start() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                align_self: stretch::style::AlignSelf::FlexStart,
+                width: stretch::style::Dimension::Points(10.0),
+                height: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn percentage_position_left_top() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(400.0),
+            height: stretch::style::Dimension::Points(400.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Percent(0.4),
+                height: stretch::style::Dimension::Percent(0.6),
+                start: stretch::style::Dimension::Percent(0.1),
+                top: stretch::style::Dimension::Percent(0.2),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 400.0);
+        assert_eq!(layout.height, 400.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 180.0);
+        assert_eq!(layout.children[0].height, 220.0);
+        assert_eq!(layout.children[0].x, 40.0);
+        assert_eq!(layout.children[0].y, 80.0);
+    }
+
+    #[test]
+    fn border_stretch_child() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            border: stretch::style::Edges {
+                start: stretch::style::Dimension::Points(10.0),
+                end: stretch::style::Dimension::Points(10.0),
+                top: stretch::style::Dimension::Points(10.0),
+                bottom: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            },
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 80.0);
+        assert_eq!(layout.children[0].x, 10.0);
+        assert_eq!(layout.children[0].y, 10.0);
+    }
+
+    #[test]
+    fn rounding_fractial_input_2() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(113.6),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 114.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 65.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 24.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 65.0);
+
+        assert_eq!(layout.children[2].width, 100.0);
+        assert_eq!(layout.children[2].height, 25.0);
+        assert_eq!(layout.children[2].x, 0.0);
+        assert_eq!(layout.children[2].y, 89.0);
+    }
+
+    #[test]
+    fn percentage_flex_basis_main_max_width() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.2),
+                    max_width: stretch::style::Dimension::Percent(0.6),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 4.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.1),
+                    max_width: stretch::style::Dimension::Percent(0.2),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 120.0);
+        assert_eq!(layout.children[0].height, 200.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 40.0);
+        assert_eq!(layout.children[1].height, 200.0);
+        assert_eq!(layout.children[1].x, 120.0);
+        assert_eq!(layout.children[1].y, 0.0);
+    }
+
+    #[test]
+    fn margin_auto_top_and_bottom_strech() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        top: stretch::style::Dimension::Auto,
+                        bottom: stretch::style::Dimension::Auto,
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 50.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 150.0);
+    }
+
+    #[test]
+    fn percentage_multiple_nested_with_padding_margin_and_percentage_values() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_direction: stretch::style::FlexDirection::Column,
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.1),
+                    min_width: stretch::style::Dimension::Percent(0.6),
+                    margin: stretch::style::Edges {
+                        start: stretch::style::Dimension::Points(5.0),
+                        end: stretch::style::Dimension::Points(5.0),
+                        top: stretch::style::Dimension::Points(5.0),
+                        bottom: stretch::style::Dimension::Points(5.0),
+                        ..Default::default()
+                    },
+                    padding: stretch::style::Edges {
+                        start: stretch::style::Dimension::Points(3.0),
+                        end: stretch::style::Dimension::Points(3.0),
+                        top: stretch::style::Dimension::Points(3.0),
+                        bottom: stretch::style::Dimension::Points(3.0),
+                        ..Default::default()
+                    },
+                    children: vec![stretch::style::Node {
+                        flex_direction: stretch::style::FlexDirection::Column,
+                        width: stretch::style::Dimension::Percent(0.5),
+                        margin: stretch::style::Edges {
+                            start: stretch::style::Dimension::Points(5.0),
+                            end: stretch::style::Dimension::Points(5.0),
+                            top: stretch::style::Dimension::Points(5.0),
+                            bottom: stretch::style::Dimension::Points(5.0),
+                            ..Default::default()
+                        },
+                        padding: stretch::style::Edges {
+                            start: stretch::style::Dimension::Percent(0.0),
+                            end: stretch::style::Dimension::Percent(0.0),
+                            top: stretch::style::Dimension::Percent(0.0),
+                            bottom: stretch::style::Dimension::Percent(0.0),
+                            ..Default::default()
+                        },
+                        children: vec![stretch::style::Node {
+                            width: stretch::style::Dimension::Percent(0.4),
+                            margin: stretch::style::Edges {
+                                start: stretch::style::Dimension::Percent(0.1),
+                                end: stretch::style::Dimension::Percent(0.1),
+                                top: stretch::style::Dimension::Percent(0.1),
+                                bottom: stretch::style::Dimension::Percent(0.1),
+                                ..Default::default()
+                            },
+                            padding: stretch::style::Edges {
+                                start: stretch::style::Dimension::Points(3.0),
+                                end: stretch::style::Dimension::Points(3.0),
+                                top: stretch::style::Dimension::Points(3.0),
+                                bottom: stretch::style::Dimension::Points(3.0),
+                                ..Default::default()
+                            },
+                            ..Default::default()
+                        }],
+                        ..Default::default()
+                    }],
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 4.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.2),
+                    min_width: stretch::style::Dimension::Percent(0.2),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 190.0);
+        assert_eq!(layout.children[0].height, 48.0);
+        assert_eq!(layout.children[0].x, 5.0);
+        assert_eq!(layout.children[0].y, 5.0);
+
+        assert_eq!(layout.children[0].children[0].width, 92.0);
+        assert_eq!(layout.children[0].children[0].height, 25.0);
+        assert_eq!(layout.children[0].children[0].x, 8.0);
+        assert_eq!(layout.children[0].children[0].y, 8.0);
+
+        assert_eq!(layout.children[0].children[0].children[0].width, 36.0);
+        assert_eq!(layout.children[0].children[0].children[0].height, 6.0);
+        assert_eq!(layout.children[0].children[0].children[0].x, 10.0);
+        assert_eq!(layout.children[0].children[0].children[0].y, 10.0);
+
+        assert_eq!(layout.children[1].width, 200.0);
+        assert_eq!(layout.children[1].height, 142.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 58.0);
+    }
+
+    #[test]
+    fn flex_grow_within_constrained_min_column() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            min_height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 0.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 0.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 0.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 50.0);
+    }
+
+    #[test]
+    fn flex_grow_in_at_most_container() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::FlexStart,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                children: vec![stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Points(0.0),
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 0.0);
+        assert_eq!(layout.children[0].height, 0.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 0.0);
+        assert_eq!(layout.children[0].children[0].height, 0.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn margin_auto_left() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        start: stretch::style::Dimension::Auto,
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 100.0);
+        assert_eq!(layout.children[0].y, 75.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 150.0);
+        assert_eq!(layout.children[1].y, 75.0);
+    }
+
+    #[test]
+    fn percentage_flex_basis_cross() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.5),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.2),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 200.0);
+        assert_eq!(layout.children[0].height, 125.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 200.0);
+        assert_eq!(layout.children[1].height, 75.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 125.0);
+    }
+
+    #[test]
+    fn percentage_absolute_position() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                position: stretch::style::Position::Absolute,
+                width: stretch::style::Dimension::Points(10.0),
+                height: stretch::style::Dimension::Points(10.0),
+                start: stretch::style::Dimension::Percent(0.3),
+                top: stretch::style::Dimension::Percent(0.1),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 60.0);
+        assert_eq!(layout.children[0].y, 10.0);
+    }
+
+    #[test]
+    fn flex_basis_flex_grow_row() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 75.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 25.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 75.0);
+        assert_eq!(layout.children[1].y, 0.0);
+    }
+
+    #[test]
+    fn absolute_layout_in_wrap_reverse_column_container_flex_end() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                position: stretch::style::Position::Absolute,
+                align_self: stretch::style::AlignSelf::FlexEnd,
+                width: stretch::style::Dimension::Points(20.0),
+                height: stretch::style::Dimension::Points(20.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 20.0);
+        assert_eq!(layout.children[0].height, 20.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn justify_content_row_flex_start() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 10.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 10.0);
+        assert_eq!(layout.children[1].y, 0.0);
+
+        assert_eq!(layout.children[2].width, 10.0);
+        assert_eq!(layout.children[2].height, 100.0);
+        assert_eq!(layout.children[2].x, 20.0);
+        assert_eq!(layout.children[2].y, 0.0);
+    }
+
+    #[test]
+    fn margin_auto_left_right_child_bigger_than_parent() {
+        let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(52.0),
+            height: stretch::style::Dimension::Points(52.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(72.0),
+                height: stretch::style::Dimension::Points(72.0),
+                margin: stretch::style::Edges {
+                    start: stretch::style::Dimension::Auto,
+                    end: stretch::style::Dimension::Auto,
+                    ..Default::default()
+                },
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 52.0);
+        assert_eq!(layout.height, 52.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 52.0);
+        assert_eq!(layout.children[0].height, 72.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn margin_fix_left_auto_right_child_bigger_than_parent() {
+        let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(52.0),
+            height: stretch::style::Dimension::Points(52.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(72.0),
+                height: stretch::style::Dimension::Points(72.0),
+                margin: stretch::style::Edges {
+                    start: stretch::style::Dimension::Points(10.0),
+                    end: stretch::style::Dimension::Auto,
+                    ..Default::default()
+                },
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 52.0);
+        assert_eq!(layout.height, 52.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 42.0);
+        assert_eq!(layout.children[0].height, 72.0);
+        assert_eq!(layout.children[0].x, 10.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn percentage_container_in_wrapping_container() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            align_items: stretch::style::AlignItems::Center,
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![stretch::style::Node {
+                flex_direction: stretch::style::FlexDirection::Column,
+                children: vec![stretch::style::Node {
+                    justify_content: stretch::style::JustifyContent::Center,
+                    width: stretch::style::Dimension::Percent(1.0),
+                    children: vec![
+                        stretch::style::Node {
+                            width: stretch::style::Dimension::Points(50.0),
+                            height: stretch::style::Dimension::Points(50.0),
+                            ..Default::default()
+                        },
+                        stretch::style::Node {
+                            width: stretch::style::Dimension::Points(50.0),
+                            height: stretch::style::Dimension::Points(50.0),
+                            ..Default::default()
+                        },
+                    ],
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 50.0);
+        assert_eq!(layout.children[0].y, 75.0);
+
+        assert_eq!(layout.children[0].children[0].width, 100.0);
+        assert_eq!(layout.children[0].children[0].height, 50.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].children[0].width, 50.0);
+        assert_eq!(layout.children[0].children[0].children[0].height, 50.0);
+        assert_eq!(layout.children[0].children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].children[1].width, 50.0);
+        assert_eq!(layout.children[0].children[0].children[1].height, 50.0);
+        assert_eq!(layout.children[0].children[0].children[1].x, 50.0);
+        assert_eq!(layout.children[0].children[0].children[1].y, 0.0);
+    }
+
+    #[test]
+    fn margin_auto_left_stretching_child() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_shrink: 1.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.0),
+                    margin: stretch::style::Edges {
+                        start: stretch::style::Dimension::Auto,
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 150.0);
+        assert_eq!(layout.children[0].height, 0.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 100.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 150.0);
+        assert_eq!(layout.children[1].y, 75.0);
+    }
+
+    #[test]
+    fn percentage_flex_basis_cross_max_width() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.1),
+                    max_width: stretch::style::Dimension::Percent(0.6),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 4.0,
+                    flex_basis: stretch::style::Dimension::Percent(0.2),
+                    max_width: stretch::style::Dimension::Percent(0.2),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 120.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 40.0);
+        assert_eq!(layout.children[1].height, 150.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 50.0);
+    }
+
+    #[test]
+    fn align_items_flex_end_child_without_margin_bigger_than_parent() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(52.0),
+            height: stretch::style::Dimension::Points(52.0),
+            children: vec![stretch::style::Node {
+                align_items: stretch::style::AlignItems::FlexEnd,
+                children: vec![stretch::style::Node {
+                    width: stretch::style::Dimension::Points(72.0),
+                    height: stretch::style::Dimension::Points(72.0),
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 52.0);
+        assert_eq!(layout.height, 52.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 72.0);
+        assert_eq!(layout.children[0].height, 72.0);
+        assert_eq!(layout.children[0].x, -10.0);
+        assert_eq!(layout.children[0].y, -10.0);
+
+        assert_eq!(layout.children[0].children[0].width, 72.0);
+        assert_eq!(layout.children[0].children[0].height, 72.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn size_defined_by_child_with_padding() {
+        let layout = stretch::compute(&stretch::style::Node {
+            padding: stretch::style::Edges {
+                start: stretch::style::Dimension::Points(10.0),
+                end: stretch::style::Dimension::Points(10.0),
+                top: stretch::style::Dimension::Points(10.0),
+                bottom: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            },
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(10.0),
+                height: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 30.0);
+        assert_eq!(layout.height, 30.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 10.0);
+        assert_eq!(layout.children[0].y, 10.0);
+    }
+
+    #[test]
+    fn absolute_layout_within_border() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            padding: stretch::style::Edges {
+                start: stretch::style::Dimension::Points(10.0),
+                end: stretch::style::Dimension::Points(10.0),
+                top: stretch::style::Dimension::Points(10.0),
+                bottom: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            },
+            border: stretch::style::Edges {
+                start: stretch::style::Dimension::Points(10.0),
+                end: stretch::style::Dimension::Points(10.0),
+                top: stretch::style::Dimension::Points(10.0),
+                bottom: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            },
+            children: vec![
+                stretch::style::Node {
+                    position: stretch::style::Position::Absolute,
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    start: stretch::style::Dimension::Points(0.0),
+                    top: stretch::style::Dimension::Points(0.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    position: stretch::style::Position::Absolute,
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    end: stretch::style::Dimension::Points(0.0),
+                    bottom: stretch::style::Dimension::Points(0.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    position: stretch::style::Position::Absolute,
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        start: stretch::style::Dimension::Points(10.0),
+                        end: stretch::style::Dimension::Points(10.0),
+                        top: stretch::style::Dimension::Points(10.0),
+                        bottom: stretch::style::Dimension::Points(10.0),
+                        ..Default::default()
+                    },
+                    start: stretch::style::Dimension::Points(0.0),
+                    top: stretch::style::Dimension::Points(0.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    position: stretch::style::Position::Absolute,
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        start: stretch::style::Dimension::Points(10.0),
+                        end: stretch::style::Dimension::Points(10.0),
+                        top: stretch::style::Dimension::Points(10.0),
+                        bottom: stretch::style::Dimension::Points(10.0),
+                        ..Default::default()
+                    },
+                    end: stretch::style::Dimension::Points(0.0),
+                    bottom: stretch::style::Dimension::Points(0.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 10.0);
+        assert_eq!(layout.children[0].y, 10.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 40.0);
+        assert_eq!(layout.children[1].y, 40.0);
+
+        assert_eq!(layout.children[2].width, 50.0);
+        assert_eq!(layout.children[2].height, 50.0);
+        assert_eq!(layout.children[2].x, 20.0);
+        assert_eq!(layout.children[2].y, 20.0);
+
+        assert_eq!(layout.children[3].width, 50.0);
+        assert_eq!(layout.children[3].height, 50.0);
+        assert_eq!(layout.children[3].x, 30.0);
+        assert_eq!(layout.children[3].y, 30.0);
+    }
+
+    #[test]
+    fn margin_auto_left_fix_right_child_bigger_than_parent() {
+        let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(52.0),
+            height: stretch::style::Dimension::Points(52.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(72.0),
+                height: stretch::style::Dimension::Points(72.0),
+                margin: stretch::style::Edges {
+                    start: stretch::style::Dimension::Auto,
+                    end: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 52.0);
+        assert_eq!(layout.height, 52.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 42.0);
+        assert_eq!(layout.children[0].height, 72.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn justify_content_row_flex_end() {
+        let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::FlexEnd,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 70.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 10.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 80.0);
+        assert_eq!(layout.children[1].y, 0.0);
+
+        assert_eq!(layout.children[2].width, 10.0);
+        assert_eq!(layout.children[2].height, 100.0);
+        assert_eq!(layout.children[2].x, 90.0);
+        assert_eq!(layout.children[2].y, 0.0);
+    }
+
+    #[test]
+    fn margin_bottom() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            justify_content: stretch::style::JustifyContent::FlexEnd,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                height: stretch::style::Dimension::Points(10.0),
+                margin: stretch::style::Edges {
+                    bottom: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 80.0);
+    }
+
+    #[test]
+    fn margin_should_not_be_part_of_max_height() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(250.0),
+            height: stretch::style::Dimension::Points(250.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(100.0),
+                height: stretch::style::Dimension::Points(100.0),
+                max_height: stretch::style::Dimension::Points(100.0),
+                margin: stretch::style::Edges {
+                    top: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 250.0);
+        assert_eq!(layout.height, 250.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 20.0);
+    }
+
+    #[test]
+    fn percentage_flex_basis_cross_min_height() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    min_height: stretch::style::Dimension::Percent(0.6),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 2.0,
+                    min_height: stretch::style::Dimension::Percent(0.1),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 200.0);
+        assert_eq!(layout.children[0].height, 140.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 200.0);
+        assert_eq!(layout.children[1].height, 60.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 140.0);
+    }
+
+    #[test]
+    fn nested_overflowing_child_in_constraint_parent() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(100.0),
+                height: stretch::style::Dimension::Points(100.0),
+                children: vec![stretch::style::Node {
+                    width: stretch::style::Dimension::Points(200.0),
+                    height: stretch::style::Dimension::Points(200.0),
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 100.0);
+        assert_eq!(layout.children[0].children[0].height, 200.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn wrapped_row_within_align_items_center() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            align_items: stretch::style::AlignItems::Center,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![stretch::style::Node {
+                children: vec![
+                    stretch::style::Node {
+                        width: stretch::style::Dimension::Points(150.0),
+                        height: stretch::style::Dimension::Points(80.0),
+                        ..Default::default()
+                    },
+                    stretch::style::Node {
+                        width: stretch::style::Dimension::Points(80.0),
+                        height: stretch::style::Dimension::Points(80.0),
+                        ..Default::default()
+                    },
+                ],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 200.0);
+        assert_eq!(layout.children[0].height, 160.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 150.0);
+        assert_eq!(layout.children[0].children[0].height, 80.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[1].width, 80.0);
+        assert_eq!(layout.children[0].children[1].height, 80.0);
+        assert_eq!(layout.children[0].children[1].x, 0.0);
+        assert_eq!(layout.children[0].children[1].y, 80.0);
+    }
+
+    #[test]
+    fn justify_content_column_center() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 35.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 10.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 45.0);
+
+        assert_eq!(layout.children[2].width, 100.0);
+        assert_eq!(layout.children[2].height, 10.0);
+        assert_eq!(layout.children[2].x, 0.0);
+        assert_eq!(layout.children[2].y, 55.0);
+    }
+
+    #[test]
+    fn align_items_center_child_with_margin_bigger_than_parent() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(52.0),
+            height: stretch::style::Dimension::Points(52.0),
+            children: vec![stretch::style::Node {
+                align_items: stretch::style::AlignItems::Center,
+                children: vec![stretch::style::Node {
+                    width: stretch::style::Dimension::Points(52.0),
+                    height: stretch::style::Dimension::Points(52.0),
+                    margin: stretch::style::Edges {
+                        start: stretch::style::Dimension::Points(10.0),
+                        end: stretch::style::Dimension::Points(10.0),
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 52.0);
+        assert_eq!(layout.height, 52.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 72.0);
+        assert_eq!(layout.children[0].height, 52.0);
+        assert_eq!(layout.children[0].x, -10.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 52.0);
+        assert_eq!(layout.children[0].children[0].height, 52.0);
+        assert_eq!(layout.children[0].children[0].x, 10.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn percentage_width_height() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Percent(0.3),
+                height: stretch::style::Dimension::Percent(0.3),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 60.0);
+        assert_eq!(layout.children[0].height, 60.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn margin_auto_mutiple_children_column() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            align_items: stretch::style::AlignItems::Center,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        top: stretch::style::Dimension::Auto,
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        top: stretch::style::Dimension::Auto,
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 75.0);
+        assert_eq!(layout.children[0].y, 25.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 75.0);
+        assert_eq!(layout.children[1].y, 100.0);
+
+        assert_eq!(layout.children[2].width, 50.0);
+        assert_eq!(layout.children[2].height, 50.0);
+        assert_eq!(layout.children[2].x, 75.0);
+        assert_eq!(layout.children[2].y, 150.0);
+    }
+
+    #[test]
+    fn min_width_overrides_width_on_root() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(50.0),
+            min_width: stretch::style::Dimension::Points(100.0),
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 0.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+    }
+
+    #[test]
+    fn flex_wrap_wrap_to_child_height() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            children: vec![
+                stretch::style::Node {
+                    align_items: stretch::style::AlignItems::FlexStart,
+                    children: vec![stretch::style::Node {
+                        flex_direction: stretch::style::FlexDirection::Column,
+                        width: stretch::style::Dimension::Points(100.0),
+                        children: vec![stretch::style::Node {
+                            width: stretch::style::Dimension::Points(100.0),
+                            height: stretch::style::Dimension::Points(100.0),
+                            ..Default::default()
+                        }],
+                        ..Default::default()
+                    }],
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(100.0),
+                    height: stretch::style::Dimension::Points(100.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 100.0);
+        assert_eq!(layout.children[0].children[0].height, 100.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].children[0].width, 100.0);
+        assert_eq!(layout.children[0].children[0].children[0].height, 100.0);
+        assert_eq!(layout.children[0].children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 100.0);
+    }
+
+    #[test]
+    fn wrap_nodes_with_content_sizing_margin_cross() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(500.0),
+            height: stretch::style::Dimension::Points(500.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(70.0),
+                children: vec![
+                    stretch::style::Node {
+                        flex_direction: stretch::style::FlexDirection::Column,
+                        children: vec![stretch::style::Node {
+                            width: stretch::style::Dimension::Points(40.0),
+                            height: stretch::style::Dimension::Points(40.0),
+                            ..Default::default()
+                        }],
+                        ..Default::default()
+                    },
+                    stretch::style::Node {
+                        flex_direction: stretch::style::FlexDirection::Column,
+                        margin: stretch::style::Edges {
+                            top: stretch::style::Dimension::Points(10.0),
+                            ..Default::default()
+                        },
+                        children: vec![stretch::style::Node {
+                            width: stretch::style::Dimension::Points(40.0),
+                            height: stretch::style::Dimension::Points(40.0),
+                            ..Default::default()
+                        }],
+                        ..Default::default()
+                    },
+                ],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 500.0);
+        assert_eq!(layout.height, 500.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 70.0);
+        assert_eq!(layout.children[0].height, 90.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 40.0);
+        assert_eq!(layout.children[0].children[0].height, 40.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].children[0].width, 40.0);
+        assert_eq!(layout.children[0].children[0].children[0].height, 40.0);
+        assert_eq!(layout.children[0].children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[1].width, 40.0);
+        assert_eq!(layout.children[0].children[1].height, 40.0);
+        assert_eq!(layout.children[0].children[1].x, 0.0);
+        assert_eq!(layout.children[0].children[1].y, 50.0);
+
+        assert_eq!(layout.children[0].children[1].children[0].width, 40.0);
+        assert_eq!(layout.children[0].children[1].children[0].height, 40.0);
+        assert_eq!(layout.children[0].children[1].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[1].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn align_baseline() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Baseline,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 20.0);
+        assert_eq!(layout.children[1].x, 50.0);
+        assert_eq!(layout.children[1].y, 30.0);
+    }
+
+    #[test]
+    fn margin_with_sibling_row() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    margin: stretch::style::Edges {
+                        end: stretch::style::Dimension::Points(10.0),
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 45.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 45.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 55.0);
+        assert_eq!(layout.children[1].y, 0.0);
+    }
+
+    #[test]
+    fn wrap_reverse_row_align_content_space_around() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_content: stretch::style::AlignContent::SpaceAround,
+            width: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(30.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(40.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 80.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 30.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 70.0);
+
+        assert_eq!(layout.children[1].width, 30.0);
+        assert_eq!(layout.children[1].height, 20.0);
+        assert_eq!(layout.children[1].x, 30.0);
+        assert_eq!(layout.children[1].y, 60.0);
+
+        assert_eq!(layout.children[2].width, 30.0);
+        assert_eq!(layout.children[2].height, 30.0);
+        assert_eq!(layout.children[2].x, 60.0);
+        assert_eq!(layout.children[2].y, 50.0);
+
+        assert_eq!(layout.children[3].width, 30.0);
+        assert_eq!(layout.children[3].height, 40.0);
+        assert_eq!(layout.children[3].x, 0.0);
+        assert_eq!(layout.children[3].y, 10.0);
+
+        assert_eq!(layout.children[4].width, 30.0);
+        assert_eq!(layout.children[4].height, 50.0);
+        assert_eq!(layout.children[4].x, 30.0);
+        assert_eq!(layout.children[4].y, 0.0);
+    }
+
+    #[test]
+    fn align_items_center_with_child_margin() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(10.0),
+                height: stretch::style::Dimension::Points(10.0),
+                margin: stretch::style::Edges {
+                    top: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 50.0);
+    }
+
+    #[test]
+    fn flex_direction_column_reverse() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::ColumnReverse,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 90.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 10.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 80.0);
+
+        assert_eq!(layout.children[2].width, 100.0);
+        assert_eq!(layout.children[2].height, 10.0);
+        assert_eq!(layout.children[2].x, 0.0);
+        assert_eq!(layout.children[2].y, 70.0);
+    }
+
+    #[test]
+    fn flex_direction_column() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 10.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 10.0);
+
+        assert_eq!(layout.children[2].width, 100.0);
+        assert_eq!(layout.children[2].height, 10.0);
+        assert_eq!(layout.children[2].x, 0.0);
+        assert_eq!(layout.children[2].y, 20.0);
+    }
+
+    #[test]
+    fn align_items_center_child_without_margin_bigger_than_parent() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(52.0),
+            height: stretch::style::Dimension::Points(52.0),
+            children: vec![stretch::style::Node {
+                align_items: stretch::style::AlignItems::Center,
+                children: vec![stretch::style::Node {
+                    width: stretch::style::Dimension::Points(72.0),
+                    height: stretch::style::Dimension::Points(72.0),
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 52.0);
+        assert_eq!(layout.height, 52.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 72.0);
+        assert_eq!(layout.children[0].height, 72.0);
+        assert_eq!(layout.children[0].x, -10.0);
+        assert_eq!(layout.children[0].y, -10.0);
+
+        assert_eq!(layout.children[0].children[0].width, 72.0);
+        assert_eq!(layout.children[0].children[0].height, 72.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn align_self_flex_end_override_flex_start() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::FlexStart,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                align_self: stretch::style::AlignSelf::FlexEnd,
+                width: stretch::style::Dimension::Points(10.0),
+                height: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 90.0);
+    }
+
+    #[test]
+    fn rounding_total_fractial() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(87.4),
+            height: stretch::style::Dimension::Points(113.4),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 0.7,
+                    flex_basis: stretch::style::Dimension::Points(50.3),
+                    height: stretch::style::Dimension::Points(20.3),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.6,
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.1,
+                    height: stretch::style::Dimension::Points(10.7),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 87.0);
+        assert_eq!(layout.height, 113.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 87.0);
+        assert_eq!(layout.children[0].height, 59.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 87.0);
+        assert_eq!(layout.children[1].height, 30.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 59.0);
+
+        assert_eq!(layout.children[2].width, 87.0);
+        assert_eq!(layout.children[2].height, 24.0);
+        assert_eq!(layout.children[2].x, 0.0);
+        assert_eq!(layout.children[2].y, 89.0);
+    }
+
+    #[test]
+    fn align_baseline_child_multiline() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Baseline,
+            width: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(60.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    children: vec![
+                        stretch::style::Node {
+                            width: stretch::style::Dimension::Points(25.0),
+                            height: stretch::style::Dimension::Points(20.0),
+                            ..Default::default()
+                        },
+                        stretch::style::Node {
+                            width: stretch::style::Dimension::Points(25.0),
+                            height: stretch::style::Dimension::Points(10.0),
+                            ..Default::default()
+                        },
+                        stretch::style::Node {
+                            width: stretch::style::Dimension::Points(25.0),
+                            height: stretch::style::Dimension::Points(20.0),
+                            ..Default::default()
+                        },
+                        stretch::style::Node {
+                            width: stretch::style::Dimension::Points(25.0),
+                            height: stretch::style::Dimension::Points(10.0),
+                            ..Default::default()
+                        },
+                    ],
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 80.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 60.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 40.0);
+        assert_eq!(layout.children[1].x, 50.0);
+        assert_eq!(layout.children[1].y, 40.0);
+
+        assert_eq!(layout.children[1].children[0].width, 25.0);
+        assert_eq!(layout.children[1].children[0].height, 20.0);
+        assert_eq!(layout.children[1].children[0].x, 0.0);
+        assert_eq!(layout.children[1].children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].children[1].width, 25.0);
+        assert_eq!(layout.children[1].children[1].height, 10.0);
+        assert_eq!(layout.children[1].children[1].x, 25.0);
+        assert_eq!(layout.children[1].children[1].y, 0.0);
+
+        assert_eq!(layout.children[1].children[2].width, 25.0);
+        assert_eq!(layout.children[1].children[2].height, 20.0);
+        assert_eq!(layout.children[1].children[2].x, 0.0);
+        assert_eq!(layout.children[1].children[2].y, 20.0);
+
+        assert_eq!(layout.children[1].children[3].width, 25.0);
+        assert_eq!(layout.children[1].children[3].height, 10.0);
+        assert_eq!(layout.children[1].children[3].x, 25.0);
+        assert_eq!(layout.children[1].children[3].y, 20.0);
+    }
+
+    #[test]
+    fn absolute_layout_align_items_center_on_child_only() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(110.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                position: stretch::style::Position::Absolute,
+                align_self: stretch::style::AlignSelf::Center,
+                width: stretch::style::Dimension::Points(60.0),
+                height: stretch::style::Dimension::Points(40.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 110.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 60.0);
+        assert_eq!(layout.children[0].height, 40.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 30.0);
+    }
+
+    #[test]
+    fn wrap_reverse_row_single_line_different_size() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_content: stretch::style::AlignContent::FlexStart,
+            width: stretch::style::Dimension::Points(300.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(30.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(40.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 300.0);
+        assert_eq!(layout.height, 50.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 30.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 40.0);
+
+        assert_eq!(layout.children[1].width, 30.0);
+        assert_eq!(layout.children[1].height, 20.0);
+        assert_eq!(layout.children[1].x, 30.0);
+        assert_eq!(layout.children[1].y, 30.0);
+
+        assert_eq!(layout.children[2].width, 30.0);
+        assert_eq!(layout.children[2].height, 30.0);
+        assert_eq!(layout.children[2].x, 60.0);
+        assert_eq!(layout.children[2].y, 20.0);
+
+        assert_eq!(layout.children[3].width, 30.0);
+        assert_eq!(layout.children[3].height, 40.0);
+        assert_eq!(layout.children[3].x, 90.0);
+        assert_eq!(layout.children[3].y, 10.0);
+
+        assert_eq!(layout.children[4].width, 30.0);
+        assert_eq!(layout.children[4].height, 50.0);
+        assert_eq!(layout.children[4].x, 120.0);
+        assert_eq!(layout.children[4].y, 0.0);
+    }
+
+    #[test]
+    fn rounding_fractial_input_4() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(113.4),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 113.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 64.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 25.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 64.0);
+
+        assert_eq!(layout.children[2].width, 100.0);
+        assert_eq!(layout.children[2].height, 24.0);
+        assert_eq!(layout.children[2].x, 0.0);
+        assert_eq!(layout.children[2].y, 89.0);
+    }
+
+    #[test]
+    fn padding_flex_child() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            padding: stretch::style::Edges {
+                start: stretch::style::Dimension::Points(10.0),
+                end: stretch::style::Dimension::Points(10.0),
+                top: stretch::style::Dimension::Points(10.0),
+                bottom: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            },
+            children: vec![stretch::style::Node {
+                flex_grow: 1.0,
+                width: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 80.0);
+        assert_eq!(layout.children[0].height, 80.0);
+        assert_eq!(layout.children[0].x, 10.0);
+        assert_eq!(layout.children[0].y, 10.0);
+    }
+
+    #[test]
+    fn flex_direction_row_reverse() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::RowReverse,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 90.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 10.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 80.0);
+        assert_eq!(layout.children[1].y, 0.0);
+
+        assert_eq!(layout.children[2].width, 10.0);
+        assert_eq!(layout.children[2].height, 100.0);
+        assert_eq!(layout.children[2].x, 70.0);
+        assert_eq!(layout.children[2].y, 0.0);
+    }
+
+    #[test]
+    fn wrap_reverse_row_align_content_stretch() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(30.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(40.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 80.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 30.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 70.0);
+
+        assert_eq!(layout.children[1].width, 30.0);
+        assert_eq!(layout.children[1].height, 20.0);
+        assert_eq!(layout.children[1].x, 30.0);
+        assert_eq!(layout.children[1].y, 60.0);
+
+        assert_eq!(layout.children[2].width, 30.0);
+        assert_eq!(layout.children[2].height, 30.0);
+        assert_eq!(layout.children[2].x, 60.0);
+        assert_eq!(layout.children[2].y, 50.0);
+
+        assert_eq!(layout.children[3].width, 30.0);
+        assert_eq!(layout.children[3].height, 40.0);
+        assert_eq!(layout.children[3].x, 0.0);
+        assert_eq!(layout.children[3].y, 10.0);
+
+        assert_eq!(layout.children[4].width, 30.0);
+        assert_eq!(layout.children[4].height, 50.0);
+        assert_eq!(layout.children[4].x, 30.0);
+        assert_eq!(layout.children[4].y, 0.0);
+    }
+
+    #[test]
+    fn margin_auto_top() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        top: stretch::style::Dimension::Auto,
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 150.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 50.0);
+        assert_eq!(layout.children[1].y, 75.0);
+    }
+
+    #[test]
+    fn flex_grow_within_constrained_max_row() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(200.0),
+            children: vec![stretch::style::Node {
+                max_width: stretch::style::Dimension::Points(100.0),
+                height: stretch::style::Dimension::Points(100.0),
+                children: vec![
+                    stretch::style::Node {
+                        flex_shrink: 1.0,
+                        flex_basis: stretch::style::Dimension::Points(100.0),
+                        ..Default::default()
+                    },
+                    stretch::style::Node {
+                        width: stretch::style::Dimension::Points(50.0),
+                        ..Default::default()
+                    },
+                ],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 67.0);
+        assert_eq!(layout.children[0].children[0].height, 100.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[1].width, 33.0);
+        assert_eq!(layout.children[0].children[1].height, 100.0);
+        assert_eq!(layout.children[0].children[1].x, 67.0);
+        assert_eq!(layout.children[0].children[1].y, 0.0);
+    }
+
+    #[test]
+    fn absolute_layout_align_items_and_justify_content_center() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(110.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                position: stretch::style::Position::Absolute,
+                width: stretch::style::Dimension::Points(60.0),
+                height: stretch::style::Dimension::Points(40.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 110.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 60.0);
+        assert_eq!(layout.children[0].height, 40.0);
+        assert_eq!(layout.children[0].x, 25.0);
+        assert_eq!(layout.children[0].y, 30.0);
+    }
+
+    #[test]
+    fn align_self_flex_end() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                align_self: stretch::style::AlignSelf::FlexEnd,
+                width: stretch::style::Dimension::Points(10.0),
+                height: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 90.0);
+    }
+
+    #[test]
+    fn margin_auto_left_child_bigger_than_parent() {
+        let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(52.0),
+            height: stretch::style::Dimension::Points(52.0),
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(72.0),
+                height: stretch::style::Dimension::Points(72.0),
+                margin: stretch::style::Edges {
+                    start: stretch::style::Dimension::Auto,
+                    ..Default::default()
+                },
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 52.0);
+        assert_eq!(layout.height, 52.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 52.0);
+        assert_eq!(layout.children[0].height, 72.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn wrapped_row_within_align_items_flex_end() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            align_items: stretch::style::AlignItems::FlexEnd,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![stretch::style::Node {
+                children: vec![
+                    stretch::style::Node {
+                        width: stretch::style::Dimension::Points(150.0),
+                        height: stretch::style::Dimension::Points(80.0),
+                        ..Default::default()
+                    },
+                    stretch::style::Node {
+                        width: stretch::style::Dimension::Points(80.0),
+                        height: stretch::style::Dimension::Points(80.0),
+                        ..Default::default()
+                    },
+                ],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 200.0);
+        assert_eq!(layout.children[0].height, 160.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 150.0);
+        assert_eq!(layout.children[0].children[0].height, 80.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[1].width, 80.0);
+        assert_eq!(layout.children[0].children[1].height, 80.0);
+        assert_eq!(layout.children[0].children[1].x, 0.0);
+        assert_eq!(layout.children[0].children[1].y, 80.0);
+    }
+
+    #[test]
+    fn min_height_overrides_height() {
+        let layout = stretch::compute(&stretch::style::Node {
+            children: vec![stretch::style::Node {
+                height: stretch::style::Dimension::Points(50.0),
+                min_height: stretch::style::Dimension::Points(100.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 0.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 0.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+    }
+
+    #[test]
+    fn align_strech_should_size_based_on_parent() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![stretch::style::Node {
+                justify_content: stretch::style::JustifyContent::Center,
+                flex_grow: 0.0,
+                flex_shrink: 1.0,
+                children: vec![stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_shrink: 1.0,
+                    children: vec![stretch::style::Node {
+                        width: stretch::style::Dimension::Points(20.0),
+                        height: stretch::style::Dimension::Points(20.0),
+                        ..Default::default()
+                    }],
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 20.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 20.0);
+        assert_eq!(layout.children[0].children[0].height, 100.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].children[0].width, 20.0);
+        assert_eq!(layout.children[0].children[0].children[0].height, 20.0);
+        assert_eq!(layout.children[0].children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn wrap_row_align_items_flex_end() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::FlexEnd,
+            width: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(30.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(30.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 60.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 30.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 20.0);
+
+        assert_eq!(layout.children[1].width, 30.0);
+        assert_eq!(layout.children[1].height, 20.0);
+        assert_eq!(layout.children[1].x, 30.0);
+        assert_eq!(layout.children[1].y, 10.0);
+
+        assert_eq!(layout.children[2].width, 30.0);
+        assert_eq!(layout.children[2].height, 30.0);
+        assert_eq!(layout.children[2].x, 60.0);
+        assert_eq!(layout.children[2].y, 0.0);
+
+        assert_eq!(layout.children[3].width, 30.0);
+        assert_eq!(layout.children[3].height, 30.0);
+        assert_eq!(layout.children[3].x, 0.0);
+        assert_eq!(layout.children[3].y, 30.0);
+    }
+
+    #[test]
+    fn size_defined_by_child_with_border() {
+        let layout = stretch::compute(&stretch::style::Node {
+            border: stretch::style::Edges {
+                start: stretch::style::Dimension::Points(10.0),
+                end: stretch::style::Dimension::Points(10.0),
+                top: stretch::style::Dimension::Points(10.0),
+                bottom: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            },
+            children: vec![stretch::style::Node {
+                width: stretch::style::Dimension::Points(10.0),
+                height: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 30.0);
+        assert_eq!(layout.height, 30.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 10.0);
+        assert_eq!(layout.children[0].y, 10.0);
+    }
+
+    #[test]
+    fn margin_auto_bottom_and_top_justify_center() {
+        let layout = stretch::compute(&stretch::style::Node {
+            justify_content: stretch::style::JustifyContent::Center,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        top: stretch::style::Dimension::Auto,
+                        bottom: stretch::style::Dimension::Auto,
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 50.0);
+        assert_eq!(layout.children[0].y, 75.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 100.0);
+        assert_eq!(layout.children[1].y, 0.0);
+    }
+
+    #[test]
+    fn flex_basis_overrides_main_size() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_basis: stretch::style::Dimension::Points(50.0),
+                    width: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 60.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 20.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 60.0);
+        assert_eq!(layout.children[1].y, 0.0);
+
+        assert_eq!(layout.children[2].width, 20.0);
+        assert_eq!(layout.children[2].height, 100.0);
+        assert_eq!(layout.children[2].x, 80.0);
+        assert_eq!(layout.children[2].y, 0.0);
+    }
+
+    #[test]
+    fn wrapped_row_within_align_items_flex_start() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            align_items: stretch::style::AlignItems::FlexStart,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![stretch::style::Node {
+                children: vec![
+                    stretch::style::Node {
+                        width: stretch::style::Dimension::Points(150.0),
+                        height: stretch::style::Dimension::Points(80.0),
+                        ..Default::default()
+                    },
+                    stretch::style::Node {
+                        width: stretch::style::Dimension::Points(80.0),
+                        height: stretch::style::Dimension::Points(80.0),
+                        ..Default::default()
+                    },
+                ],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 200.0);
+        assert_eq!(layout.children[0].height, 160.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].width, 150.0);
+        assert_eq!(layout.children[0].children[0].height, 80.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[1].width, 80.0);
+        assert_eq!(layout.children[0].children[1].height, 80.0);
+        assert_eq!(layout.children[0].children[1].x, 0.0);
+        assert_eq!(layout.children[0].children[1].y, 80.0);
+    }
+
+    #[test]
+    fn align_center_should_size_based_on_content() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            margin: stretch::style::Edges {
+                top: stretch::style::Dimension::Points(20.0),
+                ..Default::default()
+            },
+            children: vec![stretch::style::Node {
+                justify_content: stretch::style::JustifyContent::Center,
+                flex_grow: 0.0,
+                flex_shrink: 1.0,
+                children: vec![stretch::style::Node {
+                    flex_grow: 1.0,
+                    flex_shrink: 1.0,
+                    children: vec![stretch::style::Node {
+                        width: stretch::style::Dimension::Points(20.0),
+                        height: stretch::style::Dimension::Points(20.0),
+                        ..Default::default()
+                    }],
+                    ..Default::default()
+                }],
+                ..Default::default()
+            }],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 20.0);
+
+        assert_eq!(layout.children[0].width, 20.0);
+        assert_eq!(layout.children[0].height, 20.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 40.0);
+
+        assert_eq!(layout.children[0].children[0].width, 20.0);
+        assert_eq!(layout.children[0].children[0].height, 20.0);
+        assert_eq!(layout.children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].y, 0.0);
+
+        assert_eq!(layout.children[0].children[0].children[0].width, 20.0);
+        assert_eq!(layout.children[0].children[0].children[0].height, 20.0);
+        assert_eq!(layout.children[0].children[0].children[0].x, 0.0);
+        assert_eq!(layout.children[0].children[0].children[0].y, 0.0);
+    }
+
+    #[test]
+    fn margin_auto_right() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_items: stretch::style::AlignItems::Center,
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        end: stretch::style::Dimension::Auto,
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 200.0);
+        assert_eq!(layout.height, 200.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 50.0);
+        assert_eq!(layout.children[0].height, 50.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 75.0);
+
+        assert_eq!(layout.children[1].width, 50.0);
+        assert_eq!(layout.children[1].height, 50.0);
+        assert_eq!(layout.children[1].x, 150.0);
+        assert_eq!(layout.children[1].y, 75.0);
+    }
+
+    #[test]
+    fn wrap_reverse_row_align_content_center() {
+        let layout = stretch::compute(&stretch::style::Node {
+            align_content: stretch::style::AlignContent::Center,
+            width: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(20.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(30.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(40.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(30.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 80.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 30.0);
+        assert_eq!(layout.children[0].height, 10.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 70.0);
+
+        assert_eq!(layout.children[1].width, 30.0);
+        assert_eq!(layout.children[1].height, 20.0);
+        assert_eq!(layout.children[1].x, 30.0);
+        assert_eq!(layout.children[1].y, 60.0);
+
+        assert_eq!(layout.children[2].width, 30.0);
+        assert_eq!(layout.children[2].height, 30.0);
+        assert_eq!(layout.children[2].x, 60.0);
+        assert_eq!(layout.children[2].y, 50.0);
+
+        assert_eq!(layout.children[3].width, 30.0);
+        assert_eq!(layout.children[3].height, 40.0);
+        assert_eq!(layout.children[3].x, 0.0);
+        assert_eq!(layout.children[3].y, 10.0);
+
+        assert_eq!(layout.children[4].width, 30.0);
+        assert_eq!(layout.children[4].height, 50.0);
+        assert_eq!(layout.children[4].x, 30.0);
+        assert_eq!(layout.children[4].y, 0.0);
+    }
+
+    #[test]
+    fn padding_no_child() {
+        let layout = stretch::compute(&stretch::style::Node {
+            padding: stretch::style::Edges {
+                start: stretch::style::Dimension::Points(10.0),
+                end: stretch::style::Dimension::Points(10.0),
+                top: stretch::style::Dimension::Points(10.0),
+                bottom: stretch::style::Dimension::Points(10.0),
+                ..Default::default()
+            },
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 20.0);
+        assert_eq!(layout.height, 20.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+    }
+
+    #[test]
+    fn margin_with_sibling_column() {
+        let layout = stretch::compute(&stretch::style::Node {
+            flex_direction: stretch::style::FlexDirection::Column,
+            width: stretch::style::Dimension::Points(100.0),
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    margin: stretch::style::Edges {
+                        bottom: stretch::style::Dimension::Points(10.0),
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    flex_grow: 1.0,
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 100.0);
+        assert_eq!(layout.children[0].height, 45.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 100.0);
+        assert_eq!(layout.children[1].height, 45.0);
+        assert_eq!(layout.children[1].x, 0.0);
+        assert_eq!(layout.children[1].y, 55.0);
+    }
+
+    #[test]
+    fn flex_direction_row_no_width() {
+        let layout = stretch::compute(&stretch::style::Node {
+            height: stretch::style::Dimension::Points(100.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(10.0),
+                    ..Default::default()
+                },
+            ],
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 30.0);
+        assert_eq!(layout.height, 100.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+
+        assert_eq!(layout.children[0].width, 10.0);
+        assert_eq!(layout.children[0].height, 100.0);
+        assert_eq!(layout.children[0].x, 0.0);
+        assert_eq!(layout.children[0].y, 0.0);
+
+        assert_eq!(layout.children[1].width, 10.0);
+        assert_eq!(layout.children[1].height, 100.0);
+        assert_eq!(layout.children[1].x, 10.0);
+        assert_eq!(layout.children[1].y, 0.0);
+
+        assert_eq!(layout.children[2].width, 10.0);
+        assert_eq!(layout.children[2].height, 100.0);
+        assert_eq!(layout.children[2].x, 20.0);
+        assert_eq!(layout.children[2].y, 0.0);
+    }
+
+    #[test]
+    fn max_width_overrides_width_on_root() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(200.0),
+            max_width: stretch::style::Dimension::Points(100.0),
+            ..Default::default()
+        });
+
+        assert_eq!(layout.width, 100.0);
+        assert_eq!(layout.height, 0.0);
+        assert_eq!(layout.x, 0.0);
+        assert_eq!(layout.y, 0.0);
+    }
+
+    #[test]
+    fn margin_auto_left_and_right() {
+        let layout = stretch::compute(&stretch::style::Node {
+            width: stretch::style::Dimension::Points(200.0),
+            height: stretch::style::Dimension::Points(200.0),
+            children: vec![
+                stretch::style::Node {
+                    width: stretch::style::Dimension::Points(50.0),
+                    height: stretch::style::Dimension::Points(50.0),
+                    margin: stretch::style::Edges {
+                        start: stretch::style::Dimension::Auto,
+                        end: stretch::style::Dimension::Auto,
+                        ..Default::default()
+                    },
+                    ..Default::default()
+                },
+                stretch::style::Node {
+                    widt