From ba9448e68210feb7f64f3f6aa43ec62fe503a205 Mon Sep 17 00:00:00 2001 From: Manish Goregaokar Date: Mon, 20 Jul 2020 14:18:23 -0700 Subject: [PATCH] flex 2020: Handle positioning flex item based on align-self --- components/layout_2020/flexbox/layout.rs | 28 +++++++++++++++++++----- 1 file changed, 23 insertions(+), 5 deletions(-) diff --git a/components/layout_2020/flexbox/layout.rs b/components/layout_2020/flexbox/layout.rs index bb39a5af5b3..9567bb0efbe 100644 --- a/components/layout_2020/flexbox/layout.rs +++ b/components/layout_2020/flexbox/layout.rs @@ -715,7 +715,10 @@ impl FlexLine<'_> { .items .iter() .zip(&item_margins) - .map(|(item, margin)| item.align_along_cross_axis(margin)); + .zip(&item_used_cross_sizes) + .map(|((item, margin), size)| { + item.align_along_cross_axis(margin, size, line_cross_size) + }); let item_fragments = self .items @@ -1149,14 +1152,29 @@ impl FlexItem<'_> { } /// Return the coordinate of the cross-start side of the content area - fn align_along_cross_axis(&self, margin: &FlexRelativeSides) -> Length { + fn align_along_cross_axis( + &self, + margin: &FlexRelativeSides, + content_size: &Length, + line_cross_size: Length, + ) -> Length { let outer_cross_start = if self.margin.cross_start.is_auto() || self.margin.cross_end.is_auto() { Length::zero() } else { - // FIXME: “Align all flex items along the cross-axis per `align-self`” - // For now we hard-code the behavior of `stretch`: - Length::zero() + match self.align_self { + AlignItems::Stretch | AlignItems::FlexStart => Length::zero(), + AlignItems::FlexEnd => { + let margin_box_cross = *content_size + self.pbm_auto_is_zero.cross; + line_cross_size - margin_box_cross + }, + AlignItems::Center => { + let margin_box_cross = *content_size + self.pbm_auto_is_zero.cross; + (line_cross_size - margin_box_cross) / 2. + }, + // FIXME: handle baseline alignment + AlignItems::Baseline => Length::zero(), + } }; outer_cross_start + margin.cross_start + self.border.cross_start + self.padding.cross_start }