diff --git a/components/layout/flex.rs b/components/layout/flex.rs index 789018e4121..50948ac411d 100644 --- a/components/layout/flex.rs +++ b/components/layout/flex.rs @@ -99,7 +99,9 @@ pub struct FlexFlow { /// The available cross axis size available_cross_size: AxisSize, /// List of flex-items that belong to this flex-container - items: Vec + items: Vec, + /// True if the flex-direction is *-reversed + is_reverse: bool } impl FlexFlow { @@ -107,9 +109,11 @@ impl FlexFlow { flotation: Option) -> FlexFlow { - let main_mode = match fragment.style.get_position().flex_direction { - flex_direction::T::row_reverse | flex_direction::T::row => Mode::Inline, - flex_direction::T::column_reverse | flex_direction::T::column => Mode::Block + let (main_mode, is_reverse) = match fragment.style.get_position().flex_direction { + flex_direction::T::row => (Mode::Inline, false), + flex_direction::T::row_reverse => (Mode::Inline, true), + flex_direction::T::column => (Mode::Block, false), + flex_direction::T::column_reverse => (Mode::Block, true), }; FlexFlow { @@ -117,7 +121,8 @@ impl FlexFlow { main_mode: main_mode, available_main_size: AxisSize::Infinite, available_cross_size: AxisSize::Infinite, - items: Vec::new() + items: Vec::new(), + is_reverse: is_reverse } } @@ -251,25 +256,43 @@ impl FlexFlow { self.block_flow.base.position.size.inline = inline_size; let block_container_explicit_block_size = self.block_flow.base.block_container_explicit_block_size; - let mut inline_child_start = inline_start_content_edge; + let mut inline_child_start = if !self.is_reverse { + inline_start_content_edge + } else { + self.block_flow.fragment.border_box.size.inline + }; for kid in &mut self.items { let base = flow::mut_base(flow_ref::deref_mut(&mut kid.flow)); base.block_container_inline_size = even_content_inline_size; base.block_container_writing_mode = container_mode; base.block_container_explicit_block_size = block_container_explicit_block_size; - base.position.start.i = inline_child_start; - inline_child_start = inline_child_start + even_content_inline_size; + if !self.is_reverse { + base.position.start.i = inline_child_start; + inline_child_start = inline_child_start + even_content_inline_size; + } else { + base.position.start.i = inline_child_start - base.intrinsic_inline_sizes.preferred_inline_size; + inline_child_start = inline_child_start - even_content_inline_size; + }; } } // TODO(zentner): This function should actually flex elements! fn block_mode_assign_block_size<'a>(&mut self, layout_context: &'a LayoutContext<'a>) { - let mut cur_b = self.block_flow.fragment.border_padding.block_start; + let mut cur_b = if !self.is_reverse { + self.block_flow.fragment.border_padding.block_start + } else { + self.block_flow.fragment.border_box.size.block + }; for kid in &mut self.items { let base = flow::mut_base(flow_ref::deref_mut(&mut kid.flow)); - base.position.start.b = cur_b; - cur_b = cur_b + base.position.size.block; + if !self.is_reverse { + base.position.start.b = cur_b; + cur_b = cur_b + base.position.size.block; + } else { + cur_b = cur_b - base.position.size.block; + base.position.start.b = cur_b; + } } self.block_flow.assign_block_size(layout_context) } diff --git a/tests/wpt/metadata-css/css-flexbox-1_dev/html/order-with-column-reverse.htm.ini b/tests/wpt/metadata-css/css-flexbox-1_dev/html/order-with-column-reverse.htm.ini deleted file mode 100644 index 7445ddfb2a3..00000000000 --- a/tests/wpt/metadata-css/css-flexbox-1_dev/html/order-with-column-reverse.htm.ini +++ /dev/null @@ -1,3 +0,0 @@ -[order-with-column-reverse.htm] - type: reftest - expected: FAIL