From 87c622789ab98f23fa66b9c3b3a38f3d0c0d9ad7 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Sun, 28 May 2023 18:52:37 +0300 Subject: [PATCH 01/73] blocks re-rendering refactor moved display property based re-rendering from render_item_block::render to the top functions: place_float, place_inline and render_item_block_context::_render_content --- include/litehtml/element.h | 4 ++-- src/element.cpp | 13 ++++++++++++- src/line_box.cpp | 2 +- src/render_block.cpp | 30 +++++++++--------------------- src/render_block_context.cpp | 6 +++++- src/render_inline_context.cpp | 26 +++++++++++++------------- src/render_item.cpp | 8 ++++---- test/render/test33.htm | 5 +++++ test/render/test33.htm.png | Bin 0 -> 206 bytes 9 files changed, 51 insertions(+), 43 deletions(-) create mode 100644 test/render/test33.htm create mode 100644 test/render/test33.htm.png diff --git a/include/litehtml/element.h b/include/litehtml/element.h index 2fa160c2c..3be1a8868 100644 --- a/include/litehtml/element.h +++ b/include/litehtml/element.h @@ -43,13 +43,13 @@ namespace litehtml css_properties& css_w(); bool in_normal_flow() const; - bool is_inline_box() const; + bool is_inline() const; // returns true if element is inline + bool is_inline_box() const; // returns true if element is inline box (inline-table, inline-box, inline-flex) bool is_block_box() const; position get_placement() const; bool is_positioned() const; bool is_float() const; - bool have_parent() const; bool is_root() const; element::ptr parent() const; void parent(const element::ptr& par); diff --git a/src/element.cpp b/src/element.cpp index 2438b1325..7322e9608 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -44,7 +44,7 @@ position element::get_placement() const return pos; } -bool element::is_inline_box() const +bool element::is_inline() const { if( css().get_display() == display_inline || css().get_display() == display_inline_table || @@ -57,6 +57,17 @@ bool element::is_inline_box() const return false; } +bool element::is_inline_box() const +{ + if( css().get_display() == display_inline_table || + css().get_display() == display_inline_block || + css().get_display() == display_inline_flex) + { + return true; + } + return false; +} + bool element::is_ancestor(const ptr &el) const { element::ptr el_parent = parent(); diff --git a/src/line_box.cpp b/src/line_box.cpp index 269dd4672..1ca9c85d7 100644 --- a/src/line_box.cpp +++ b/src/line_box.cpp @@ -551,7 +551,7 @@ std::shared_ptr litehtml::line_box::get_last_text_part() bool litehtml::line_box::can_hold(const std::unique_ptr& item, white_space ws) const { - if(!item->get_el()->src_el()->is_inline_box()) return false; + if(!item->get_el()->src_el()->is_inline()) return false; if(item->get_type() == line_box_item::type_text_part) { diff --git a/src/render_block.cpp b/src/render_block.cpp index 8e1d107b4..8380991a6 100644 --- a/src/render_block.cpp +++ b/src/render_block.cpp @@ -11,9 +11,14 @@ int litehtml::render_item_block::place_float(const std::shared_ptr int ret_width = 0; + int min_rendered_width = el->render(line_left, line_top, self_size.new_width(line_right)); + if(min_rendered_width < el->width() && el->src_el()->css().get_width().is_predefined()) + { + el->render(line_left, line_top, self_size.new_width(min_rendered_width)); + } + if (el->src_el()->css().get_float() == float_left) { - el->render(line_left, line_top, self_size.new_width(line_right)); if(el->right() > line_right) { int new_top = find_next_line_top(el->top(), el->width(), self_size.render_width); @@ -25,8 +30,6 @@ int litehtml::render_item_block::place_float(const std::shared_ptr ret_width = el->right(); } else if (el->src_el()->css().get_float() == float_right) { - el->render(0, line_top, self_size.new_width(line_right)); - if(line_left + el->width() > line_right) { int new_top = find_next_line_top(el->top(), el->width(), self_size.render_width); @@ -618,7 +621,7 @@ std::shared_ptr litehtml::render_item_block::init() if (el->src_el()->is_block_box()) { has_block_level = true; - } else if (el->src_el()->is_inline_box()) + } else if (el->src_el()->is_inline()) { has_inlines = true; } @@ -637,7 +640,7 @@ std::shared_ptr litehtml::render_item_block::init() bool not_ws_added = false; for (const auto& el : m_children) { - if(el->src_el()->is_inline_box()) + if(el->src_el()->is_inline()) { inlines.push_back(el); if(!el->src_el()->is_white_space()) @@ -733,22 +736,7 @@ int litehtml::render_item_block::render(int x, int y, const containing_block_con m_pos.width = self_size.render_width; } else { - if(src_el()->is_inline_box() || - src_el()->css().get_float() != float_none || - src_el()->css().get_display() == display_table_cell || - src_el()->css().get_display() == display_table_caption || - src_el()->css().get_position() > element_position_relative) - { - m_pos.width = ret_width; - if(ret_width < self_size.render_width && !second_pass) - { - // We have to render content again with new max_width - requires_rerender = true; - } - } else - { - m_pos.width = self_size.render_width; - } + m_pos.width = self_size.render_width; } // Fix width with min-width attribute diff --git a/src/render_block_context.cpp b/src/render_block_context.cpp index b0aa444d7..2072209d7 100644 --- a/src/render_block_context.cpp +++ b/src/render_block_context.cpp @@ -31,7 +31,11 @@ int litehtml::render_item_block_context::_render_content(int x, int y, bool seco { if(el->src_el()->css().get_position() == element_position_absolute || el->src_el()->css().get_position() == element_position_fixed) { - el->render(0, child_top, self_size); + int min_rendered_width = el->render(0, child_top, self_size); + if(min_rendered_width < el->width() && el->src_el()->css().get_width().is_predefined()) + { + el->render(0, child_top, self_size.new_width(min_rendered_width)); + } } else { child_top = get_cleared_top(el, child_top); diff --git a/src/render_inline_context.cpp b/src/render_inline_context.cpp index b348a8cf7..6750ccceb 100644 --- a/src/render_inline_context.cpp +++ b/src/render_inline_context.cpp @@ -198,7 +198,7 @@ int litehtml::render_item_inline_context::new_box(const std::unique_ptrget_el()->src_el()->is_inline_box() || el->get_el()->src_el()->is_floats_holder()) + if(el->get_el()->src_el()->is_inline() || el->get_el()->src_el()->is_floats_holder()) { if (el->get_el()->width() > line_ctx.right - line_ctx.left) { @@ -273,20 +273,20 @@ void litehtml::render_item_inline_context::place_inline(std::unique_ptrget_type() == line_box_item::type_text_part) { - switch (item->get_el()->src_el()->css().get_display()) + if(item->get_el()->src_el()->is_inline_box()) { - case display_inline_block: - case display_inline_table: - item->set_rendered_min_width(item->get_el()->render(line_ctx.left, line_ctx.top, self_size.new_width(line_ctx.right))); - break; - case display_inline_text: + int min_rendered_width = item->get_el()->render(line_ctx.left, line_ctx.top, self_size.new_width(line_ctx.right)); + if(min_rendered_width < item->get_el()->width() && item->get_el()->src_el()->css().get_width().is_predefined()) { - litehtml::size sz; - item->get_el()->src_el()->get_content_size(sz, line_ctx.right); - item->get_el()->pos() = sz; - item->set_rendered_min_width(sz.width); + item->get_el()->render(line_ctx.left, line_ctx.top, self_size.new_width(min_rendered_width)); } - break; + item->set_rendered_min_width(min_rendered_width); + } else if(item->get_el()->src_el()->css().get_display() == display_inline_text) + { + litehtml::size sz; + item->get_el()->src_el()->get_content_size(sz, line_ctx.right); + item->get_el()->pos() = sz; + item->set_rendered_min_width(sz.width); } } @@ -314,7 +314,7 @@ void litehtml::render_item_inline_context::place_inline(std::unique_ptrget_el()->src_el()->is_inline_box()) + if(!item->get_el()->src_el()->is_inline()) { if(m_line_boxes.size() == 1) { diff --git a/src/render_item.cpp b/src/render_item.cpp index 2fc8e99c7..daf41e975 100644 --- a/src/render_item.cpp +++ b/src/render_item.cpp @@ -632,7 +632,7 @@ void litehtml::render_item::draw_children(uint_ptr hdc, int x, int y, const posi } break; case draw_block: - if (!el->src_el()->is_inline_box() && el->src_el()->css().get_float() == float_none && !el->src_el()->is_positioned()) + if (!el->src_el()->is_inline() && el->src_el()->css().get_float() == float_none && !el->src_el()->is_positioned()) { el->src_el()->draw(hdc, pos.x, pos.y, clip, el); } @@ -646,7 +646,7 @@ void litehtml::render_item::draw_children(uint_ptr hdc, int x, int y, const posi } break; case draw_inlines: - if (el->src_el()->is_inline_box() && el->src_el()->css().get_float() == float_none && !el->src_el()->is_positioned()) + if (el->src_el()->is_inline() && el->src_el()->css().get_float() == float_none && !el->src_el()->is_positioned()) { el->src_el()->draw(hdc, pos.x, pos.y, clip, el); if (el->src_el()->css().get_display() == display_inline_block) @@ -734,7 +734,7 @@ std::shared_ptr litehtml::render_item::get_child_by_point(in } break; case draw_block: - if(!el->src_el()->is_inline_box() && el->src_el()->css().get_float() == float_none && !el->src_el()->is_positioned()) + if(!el->src_el()->is_inline() && el->src_el()->css().get_float() == float_none && !el->src_el()->is_positioned()) { if(el->is_point_inside(el_pos.x, el_pos.y)) { @@ -755,7 +755,7 @@ std::shared_ptr litehtml::render_item::get_child_by_point(in } break; case draw_inlines: - if(el->src_el()->is_inline_box() && el->src_el()->css().get_float() == float_none && !el->src_el()->is_positioned()) + if(el->src_el()->is_inline() && el->src_el()->css().get_float() == float_none && !el->src_el()->is_positioned()) { if(el->src_el()->css().get_display() == display_inline_block || el->src_el()->css().get_display() == display_inline_table || diff --git a/test/render/test33.htm b/test/render/test33.htm new file mode 100644 index 000000000..d47eb2365 --- /dev/null +++ b/test/render/test33.htm @@ -0,0 +1,5 @@ + + + + +
Lorem ipsum dolor
diff --git a/test/render/test33.htm.png b/test/render/test33.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d1bee94be59374650d8554776e7833aa7e9bb4b2 GIT binary patch literal 206 zcmeAS@N?(olHy`uVBq!ia0vp^3xHUI5lAouhMzG7Qd2!$978G?&tBTdcSu2i?SY+h z?2H;VChq2q>#wvNUAx|4@6nUhu8(zjSX|c|hU#BjsPdQH$u93_<1@9CsW)ntKKNic zU3=kk+4+f5EN6=6d^(gdK@u#X<{QfX!$wyvyw;fwp{ig}4 zEy;FliNB#O&8xOHwmb0coViz3R{s9Kl4O literal 0 HcmV?d00001 From b0a6930308e9381d68ab86bdbfb59a6ae2f217d8 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Tue, 6 Jun 2023 00:29:19 +0300 Subject: [PATCH 02/73] Optimizing floating boxes rendering * is_floats_holder function is renamed to is_block_formatting_context * All floating boxes related functions are moved to new class formatting_context * The class formatting_context was passed as argument to the render function * render function is now is wrapper for _render. The render function creates formatting_context when required --- CMakeLists.txt | 2 + include/litehtml/element.h | 2 +- include/litehtml/formatting_context.h | 52 +++ include/litehtml/html_tag.h | 2 +- include/litehtml/render_item.h | 69 +--- include/litehtml/types.h | 5 + src/document.cpp | 2 +- src/element.cpp | 2 +- src/formatting_context.cpp | 411 ++++++++++++++++++ src/html_tag.cpp | 5 +- src/render_block.cpp | 573 +------------------------- src/render_block_context.cpp | 20 +- src/render_flex.cpp | 3 +- src/render_image.cpp | 3 +- src/render_inline_context.cpp | 49 ++- src/render_item.cpp | 32 +- src/render_table.cpp | 32 +- 17 files changed, 594 insertions(+), 670 deletions(-) create mode 100644 include/litehtml/formatting_context.h create mode 100644 src/formatting_context.cpp diff --git a/CMakeLists.txt b/CMakeLists.txt index 34d6b1538..014089023 100644 --- a/CMakeLists.txt +++ b/CMakeLists.txt @@ -69,6 +69,7 @@ set(SOURCE_LITEHTML src/render_table.cpp src/render_flex.cpp src/render_image.cpp + src/formatting_context.cpp ) set(HEADER_LITEHTML @@ -124,6 +125,7 @@ set(HEADER_LITEHTML include/litehtml/render_item.h include/litehtml/master_css.h include/litehtml/string_id.h + include/litehtml/formatting_context.h ) set(TEST_LITEHTML diff --git a/include/litehtml/element.h b/include/litehtml/element.h index 3be1a8868..5a8c924ec 100644 --- a/include/litehtml/element.h +++ b/include/litehtml/element.h @@ -119,7 +119,7 @@ namespace litehtml virtual element::ptr find_adjacent_sibling(const element::ptr& el, const css_selector& selector, bool apply_pseudo = true, bool* is_pseudo = nullptr); virtual element::ptr find_sibling(const element::ptr& el, const css_selector& selector, bool apply_pseudo = true, bool* is_pseudo = nullptr); virtual void get_content_size(size& sz, int max_width); - virtual bool is_floats_holder() const; + virtual bool is_block_formatting_context() const; virtual void update_floats(int dy, const ptr &parent); virtual bool is_nth_child(const element::ptr& el, int num, int off, bool of_type) const; virtual bool is_nth_last_child(const element::ptr& el, int num, int off, bool of_type) const; diff --git a/include/litehtml/formatting_context.h b/include/litehtml/formatting_context.h new file mode 100644 index 000000000..b867b51aa --- /dev/null +++ b/include/litehtml/formatting_context.h @@ -0,0 +1,52 @@ +#ifndef LITEHTML_FLOATS_HOLDER_H +#define LITEHTML_FLOATS_HOLDER_H + +#include +#include "types.h" + +namespace litehtml +{ + class formatting_context + { + private: + std::list m_floats_left; + std::list m_floats_right; + int_int_cache m_cache_line_left; + int_int_cache m_cache_line_right; + int m_current_top; + int m_current_left; + + public: + formatting_context() : m_current_top(0), m_current_left(0) {} + + void push_position(int x, int y) + { + m_current_left += x; + m_current_top += y; + } + void pop_position(int x, int y) + { + m_current_left -= x; + m_current_top -= y; + } + + void add_float(const std::shared_ptr &el, int min_width, int context); + void clear_floats(int context); + int find_next_line_top( int top, int width, int def_right ); + int get_floats_height(element_float el_float = float_none) const; + int get_left_floats_height() const; + int get_right_floats_height() const; + int get_line_left( int y ); + void get_line_left_right( int y, int def_right, int& ln_left, int& ln_right ) + { + ln_left = get_line_left(y); + ln_right = get_line_right(y, def_right); + } + virtual int get_line_right( int y, int def_right ); + int get_cleared_top(const std::shared_ptr &el, int line_top) const; + void update_floats(int dy, const std::shared_ptr &parent); + void apply_relative_shift(const containing_block_context &containing_block_size); + }; +} + +#endif //LITEHTML_FLOATS_HOLDER_H diff --git a/include/litehtml/html_tag.h b/include/litehtml/html_tag.h index 71b9cb345..6ec7cc444 100644 --- a/include/litehtml/html_tag.h +++ b/include/litehtml/html_tag.h @@ -105,7 +105,7 @@ namespace litehtml void parse_attributes() override; void get_content_size(size& sz, int max_width) override; - bool is_floats_holder() const override; + bool is_block_formatting_context() const override; void add_style(const style& style) override; bool is_nth_child(const element::ptr& el, int num, int off, bool of_type) const override; diff --git a/include/litehtml/render_item.h b/include/litehtml/render_item.h index f3575778f..db2cf1255 100644 --- a/include/litehtml/render_item.h +++ b/include/litehtml/render_item.h @@ -8,6 +8,7 @@ #include "types.h" #include "line_box.h" #include "table.h" +#include "formatting_context.h" namespace litehtml { @@ -28,6 +29,10 @@ namespace litehtml containing_block_context calculate_containing_block_context(const containing_block_context& cb_context); void calc_cb_length(const css_length& len, int percent_base, containing_block_context::typed_int& out_value) const; + virtual int _render(int x, int y, const containing_block_context& containing_block_size, formatting_context* fmt_ctx, bool second_pass = false) + { + return 0; + } public: explicit render_item(std::shared_ptr src_el); @@ -268,10 +273,7 @@ namespace litehtml ri->parent(shared_from_this()); } - virtual int render(int x, int y, const containing_block_context& containing_block_size, bool second_pass = false) - { - return 0; - } + int render(int x, int y, const containing_block_context& containing_block_size, formatting_context* fmt_ctx, bool second_pass = false); bool is_root() const { @@ -345,27 +347,11 @@ namespace litehtml * @return */ void get_rendering_boxes( position::vector& redraw_boxes); - - virtual void get_line_left_right( int y, int def_right, int& ln_left, int& ln_right ) {} - virtual int get_line_left( int y ) { return 0; } - virtual int get_line_right( int y, int def_right ) { return 0; } - virtual int get_left_floats_height() const { return 0; } - virtual int get_right_floats_height() const { return 0; } - virtual int get_floats_height(element_float el_float = float_none) const { return 0; } - virtual int find_next_line_top( int top, int width, int def_right ) { return 0; } - virtual void add_float(const std::shared_ptr &el, int x, int y, int context) {} - virtual void clear_floats(int context) {} - virtual void update_floats(int dy, const std::shared_ptr &_parent) {} }; class render_item_block : public render_item { protected: - std::list m_floats_left; - std::list m_floats_right; - int_int_cache m_cache_line_left; - int_int_cache m_cache_line_right; - /** * Render block content. * @@ -376,24 +362,13 @@ namespace litehtml * @param self_size - defines calculated size of block * @return return value is the minimal width of the content in block. Must be greater or equal to ret_width parameter */ - virtual int _render_content(int x, int y, bool second_pass, int ret_width, const containing_block_context &self_size) {return ret_width;} - int render(int x, int y, const containing_block_context &containing_block_size, bool second_pass) override; - - int place_float(const std::shared_ptr &el, int top, const containing_block_context &self_size); - int get_floats_height(element_float el_float = float_none) const override; - int get_left_floats_height() const override; - int get_right_floats_height() const override; - int get_line_left( int y ) override; - int get_line_right( int y, int def_right ) override; - void get_line_left_right( int y, int def_right, int& ln_left, int& ln_right ) override; - void add_float(const std::shared_ptr &el, int x, int y, int context) override; - void clear_floats(int context) override; - int get_cleared_top(const std::shared_ptr &el, int line_top) const; - int find_next_line_top( int top, int width, int def_right ) override; - virtual void fix_line_width(element_float flt, - const containing_block_context &containing_block_size) + virtual int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) {return 0;} + int _render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) override; + int place_float(const std::shared_ptr &el, int top, const containing_block_context &self_size, formatting_context* fmt_ctx); + virtual void fix_line_width(element_float flt, + const containing_block_context &containing_block_size, formatting_context* fmt_ctx) {} - void update_floats(int dy, const std::shared_ptr &_parent) override; + public: explicit render_item_block(std::shared_ptr src_el) : render_item(std::move(src_el)) {} @@ -413,8 +388,7 @@ namespace litehtml class render_item_block_context : public render_item_block { protected: - int _render_content(int x, int y, bool second_pass, int ret_width, - const containing_block_context &self_size) override; + int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; public: explicit render_item_block_context(std::shared_ptr src_el) : render_item_block(std::move(src_el)) @@ -452,14 +426,13 @@ namespace litehtml std::vector > m_line_boxes; int m_max_line_width; - int _render_content(int x, int y, bool second_pass, int ret_width, - const containing_block_context &self_size) override; + int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; void fix_line_width(element_float flt, - const containing_block_context &self_size) override; + const containing_block_context &self_size, formatting_context* fmt_ctx) override; std::list > finish_last_box(bool end_of_render, const containing_block_context &self_size); - void place_inline(std::unique_ptr item, const containing_block_context &self_size); - int new_box(const std::unique_ptr& el, line_context& line_ctx, const containing_block_context &self_size); + void place_inline(std::unique_ptr item, const containing_block_context &self_size, formatting_context* fmt_ctx); + int new_box(const std::unique_ptr& el, line_context& line_ctx, const containing_block_context &self_size, formatting_context* fmt_ctx); void apply_vertical_align() override; public: explicit render_item_inline_context(std::shared_ptr src_el) : render_item_block(std::move(src_el)), m_max_line_width(0) @@ -481,6 +454,8 @@ namespace litehtml int m_border_spacing_x; int m_border_spacing_y; + int _render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) override; + public: explicit render_item_table(std::shared_ptr src_el); @@ -488,7 +463,6 @@ namespace litehtml { return std::make_shared(src_el()); } - int render(int x, int y, const containing_block_context &containing_block_size, bool second_pass) override; void draw_children(uint_ptr hdc, int x, int y, const position* clip, draw_flag flag, int zindex) override; int get_draw_vertical_offset() override; std::shared_ptr init() override; @@ -544,12 +518,12 @@ namespace litehtml { protected: int calc_max_height(int image_height, int containing_block_height); + int _render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) override; public: explicit render_item_image(std::shared_ptr src_el) : render_item(std::move(src_el)) {} - int render(int x, int y, const containing_block_context &containing_block_size, bool second_pass) override; std::shared_ptr clone() override { return std::make_shared(src_el()); @@ -579,8 +553,7 @@ namespace litehtml protected: std::list> m_flex_items; - int _render_content(int x, int y, bool second_pass, int ret_width, - const containing_block_context &self_size) override; + int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; public: explicit render_item_flex(std::shared_ptr src_el) : render_item_block(std::move(src_el)) diff --git a/include/litehtml/types.h b/include/litehtml/types.h index 7946a3f08..4713df104 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -598,6 +598,7 @@ namespace litehtml element_clear clear_floats; std::shared_ptr el; int context; + int min_width; floated_box() = default; floated_box(const floated_box& val) @@ -607,6 +608,7 @@ namespace litehtml clear_floats = val.clear_floats; el = val.el; context = val.context; + min_width = val.min_width; } floated_box& operator=(const floated_box& val) { @@ -615,6 +617,7 @@ namespace litehtml clear_floats = val.clear_floats; el = val.el; context = val.context; + min_width = val.min_width; return *this; } floated_box(floated_box&& val) @@ -624,6 +627,7 @@ namespace litehtml clear_floats = val.clear_floats; el = std::move(val.el); context = val.context; + min_width = val.min_width; } void operator=(floated_box&& val) { @@ -632,6 +636,7 @@ namespace litehtml clear_floats = val.clear_floats; el = std::move(val.el); context = val.context; + min_width = val.min_width; } }; diff --git a/src/document.cpp b/src/document.cpp index 8623bff41..293455dd4 100644 --- a/src/document.cpp +++ b/src/document.cpp @@ -304,7 +304,7 @@ int litehtml::document::render( int max_width, render_type rt ) m_root_render->render_positioned(rt); } else { - ret = m_root_render->render(0, 0, cb_context); + ret = m_root_render->render(0, 0, cb_context, nullptr); if(m_root_render->fetch_positioned()) { m_fixed_boxes.clear(); diff --git a/src/element.cpp b/src/element.cpp index 7322e9608..22dcaaede 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -289,7 +289,7 @@ bool element::is_only_child(const element::ptr& el, bool of_type) const LITEHTM element::ptr element::get_child( int idx ) const LITEHTML_RETURN_FUNC(nullptr) size_t element::get_children_count() const LITEHTML_RETURN_FUNC(0) void element::update_floats(int dy, const ptr &parent) LITEHTML_EMPTY_FUNC -bool element::is_floats_holder() const LITEHTML_RETURN_FUNC(false) +bool element::is_block_formatting_context() const LITEHTML_RETURN_FUNC(false) void element::get_content_size( size& sz, int max_width ) LITEHTML_EMPTY_FUNC bool element::appendChild(const ptr &el) LITEHTML_RETURN_FUNC(false) bool element::removeChild(const ptr &el) LITEHTML_RETURN_FUNC(false) diff --git a/src/formatting_context.cpp b/src/formatting_context.cpp new file mode 100644 index 000000000..d909f1610 --- /dev/null +++ b/src/formatting_context.cpp @@ -0,0 +1,411 @@ +#include "html.h" +#include "render_item.h" +#include "formatting_context.h" + +void litehtml::formatting_context::add_float(const std::shared_ptr &el, int min_width, int context) +{ + floated_box fb; + fb.pos.x = el->left() + m_current_left; + fb.pos.y = el->top() + m_current_top; + fb.pos.width = el->width(); + fb.pos.height = el->height(); + fb.float_side = el->src_el()->css().get_float(); + fb.clear_floats = el->src_el()->css().get_clear(); + fb.el = el; + fb.context = context; + fb.min_width = min_width; + + if(fb.float_side == float_left) + { + if(m_floats_left.empty()) + { + m_floats_left.push_back(fb); + } else + { + bool inserted = false; + for(auto i = m_floats_left.begin(); i != m_floats_left.end(); i++) + { + if(fb.pos.right() > i->pos.right()) + { + m_floats_left.insert(i, std::move(fb)); + inserted = true; + break; + } + } + if(!inserted) + { + m_floats_left.push_back(std::move(fb)); + } + } + m_cache_line_left.invalidate(); + } else if(fb.float_side == float_right) + { + if(m_floats_right.empty()) + { + m_floats_right.push_back(std::move(fb)); + } else + { + bool inserted = false; + for(auto i = m_floats_right.begin(); i != m_floats_right.end(); i++) + { + if(fb.pos.left() < i->pos.left()) + { + m_floats_right.insert(i, std::move(fb)); + inserted = true; + break; + } + } + if(!inserted) + { + m_floats_right.push_back(fb); + } + } + m_cache_line_right.invalidate(); + } +} + +int litehtml::formatting_context::get_floats_height(element_float el_float) const +{ + int h = 0; + + for(const auto& fb : m_floats_left) + { + bool process = false; + switch(el_float) + { + case float_none: + process = true; + break; + case float_left: + if (fb.clear_floats == clear_left || fb.clear_floats == clear_both) + { + process = true; + } + break; + case float_right: + if (fb.clear_floats == clear_right || fb.clear_floats == clear_both) + { + process = true; + } + break; + } + if(process) + { + if(el_float == float_none) + { + h = std::max(h, fb.pos.bottom()); + } else + { + h = std::max(h, fb.pos.top()); + } + } + } + + + for(const auto& fb : m_floats_right) + { + int process = false; + switch(el_float) + { + case float_none: + process = true; + break; + case float_left: + if (fb.clear_floats == clear_left || fb.clear_floats == clear_both) + { + process = true; + } + break; + case float_right: + if (fb.clear_floats == clear_right || fb.clear_floats == clear_both) + { + process = true; + } + break; + } + if(process) + { + if(el_float == float_none) + { + h = std::max(h, fb.pos.bottom()); + } else + { + h = std::max(h, fb.pos.top()); + } + } + } + + return h - m_current_top; +} + +int litehtml::formatting_context::get_left_floats_height() const +{ + int h = 0; + if(!m_floats_left.empty()) + { + for (const auto& fb : m_floats_left) + { + h = std::max(h, fb.pos.bottom()); + } + } + return h - m_current_top; +} + +int litehtml::formatting_context::get_right_floats_height() const +{ + int h = 0; + if(!m_floats_right.empty()) + { + for(const auto& fb : m_floats_right) + { + h = std::max(h, fb.pos.bottom()); + } + } + return h - m_current_top; +} + +int litehtml::formatting_context::get_line_left(int y ) +{ + y += m_current_top; + + if(m_cache_line_left.is_valid && m_cache_line_left.hash == y) + { + if(m_cache_line_left.val - m_current_left < 0) + { + return 0; + } + return m_cache_line_left.val - m_current_left; + } + + int w = 0; + for(const auto& fb : m_floats_left) + { + if (y >= fb.pos.top() && y < fb.pos.bottom()) + { + w = std::max(w, fb.pos.right()); + if (w < fb.pos.right()) + { + break; + } + } + } + m_cache_line_left.set_value(y, w); + w -= m_current_left; + if(w < 0) return 0; + return w; +} + +int litehtml::formatting_context::get_line_right(int y, int def_right ) +{ + y += m_current_top; + def_right += m_current_left; + if(m_cache_line_right.is_valid && m_cache_line_right.hash == y) + { + if(m_cache_line_right.is_default) + { + return def_right - m_current_left; + } else + { + int w = std::min(m_cache_line_right.val, def_right) - m_current_left; + if(w < 0) return 0; + return w; + } + } + + int w = def_right; + m_cache_line_right.is_default = true; + for(const auto& fb : m_floats_right) + { + if(y >= fb.pos.top() && y < fb.pos.bottom()) + { + w = std::min(w, fb.pos.left()); + m_cache_line_right.is_default = false; + if(w > fb.pos.left()) + { + break; + } + } + } + m_cache_line_right.set_value(y, w); + w -= m_current_left; + if(w < 0) return 0; + return w; +} + + +void litehtml::formatting_context::clear_floats(int context) +{ + auto iter = m_floats_left.begin(); + while(iter != m_floats_left.end()) + { + if(iter->context >= context) + { + iter = m_floats_left.erase(iter); + m_cache_line_left.invalidate(); + } else + { + iter++; + } + } + + iter = m_floats_right.begin(); + while(iter != m_floats_right.end()) + { + if(iter->context >= context) + { + iter = m_floats_right.erase(iter); + m_cache_line_right.invalidate(); + } else + { + iter++; + } + } +} + +int litehtml::formatting_context::get_cleared_top(const std::shared_ptr &el, int line_top) const +{ + switch(el->src_el()->css().get_clear()) + { + case clear_left: + { + int fh = get_left_floats_height(); + if(fh && fh > line_top) + { + line_top = fh; + } + } + break; + case clear_right: + { + int fh = get_right_floats_height(); + if(fh && fh > line_top) + { + line_top = fh; + } + } + break; + case clear_both: + { + int fh = get_floats_height(float_none); + if(fh && fh > line_top) + { + line_top = fh; + } + } + break; + default: + if(el->src_el()->css().get_float() != float_none) + { + int fh = get_floats_height(el->src_el()->css().get_float()); + if(fh && fh > line_top) + { + line_top = fh; + } + } + break; + } + return line_top; +} + +int litehtml::formatting_context::find_next_line_top(int top, int width, int def_right ) +{ + top += m_current_top; + def_right += m_current_left; + + int new_top = top; + int_vector points; + + for(const auto& fb : m_floats_left) + { + if(fb.pos.top() >= top) + { + if(find(points.begin(), points.end(), fb.pos.top()) == points.end()) + { + points.push_back(fb.pos.top()); + } + } + if (fb.pos.bottom() >= top) + { + if (find(points.begin(), points.end(), fb.pos.bottom()) == points.end()) + { + points.push_back(fb.pos.bottom()); + } + } + } + + for (const auto& fb : m_floats_right) + { + if (fb.pos.top() >= top) + { + if (find(points.begin(), points.end(), fb.pos.top()) == points.end()) + { + points.push_back(fb.pos.top()); + } + } + if (fb.pos.bottom() >= top) + { + if (find(points.begin(), points.end(), fb.pos.bottom()) == points.end()) + { + points.push_back(fb.pos.bottom()); + } + } + } + + if(!points.empty()) + { + sort(points.begin(), points.end(), std::less( )); + new_top = points.back(); + + for(auto pt : points) + { + int pos_left = 0; + int pos_right = def_right; + get_line_left_right(pt - m_current_top, def_right - m_current_left, pos_left, pos_right); + + if(pos_right - pos_left >= width) + { + new_top = pt; + break; + } + } + } + return new_top - m_current_top; +} + +void litehtml::formatting_context::update_floats(int dy, const std::shared_ptr &parent) +{ + bool reset_cache = false; + for(auto fb = m_floats_left.rbegin(); fb != m_floats_left.rend(); fb++) + { + if(fb->el->src_el()->is_ancestor(parent->src_el())) + { + reset_cache = true; + fb->pos.y += dy; + } + } + if(reset_cache) + { + m_cache_line_left.invalidate(); + } + reset_cache = false; + for(auto fb = m_floats_right.rbegin(); fb != m_floats_right.rend(); fb++) + { + if(fb->el->src_el()->is_ancestor(parent->src_el())) + { + reset_cache = true; + fb->pos.y += dy; + } + } + if(reset_cache) + { + m_cache_line_right.invalidate(); + } +} + +void litehtml::formatting_context::apply_relative_shift(const containing_block_context &containing_block_size) +{ + for (const auto& fb : m_floats_left) + { + fb.el->apply_relative_shift(containing_block_size); + } +} diff --git a/src/html_tag.cpp b/src/html_tag.cpp index d1e7302e4..3072b1b29 100644 --- a/src/html_tag.cpp +++ b/src/html_tag.cpp @@ -1063,10 +1063,11 @@ bool litehtml::html_tag::is_replaced() const return false; } -bool litehtml::html_tag::is_floats_holder() const +bool litehtml::html_tag::is_block_formatting_context() const { - if( m_css.get_display() == display_inline_block || + if( m_css.get_display() == display_inline_block || m_css.get_display() == display_table_cell || + m_css.get_display() == display_table_caption || is_root() || m_css.get_float() != float_none || m_css.get_position() == element_position_absolute || diff --git a/src/render_block.cpp b/src/render_block.cpp index 8380991a6..6faafba03 100644 --- a/src/render_block.cpp +++ b/src/render_block.cpp @@ -2,559 +2,54 @@ #include "render_item.h" #include "document.h" -int litehtml::render_item_block::place_float(const std::shared_ptr &el, int top, const containing_block_context &self_size) +int litehtml::render_item_block::place_float(const std::shared_ptr &el, int top, const containing_block_context &self_size, formatting_context* fmt_ctx) { - int line_top = get_cleared_top(el, top); + int line_top = fmt_ctx->get_cleared_top(el, top); int line_left = 0; int line_right = self_size.render_width; - get_line_left_right(line_top, self_size.render_width, line_left, line_right); + fmt_ctx->get_line_left_right(line_top, self_size.render_width, line_left, line_right); int ret_width = 0; - int min_rendered_width = el->render(line_left, line_top, self_size.new_width(line_right)); + int min_rendered_width = el->render(line_left, line_top, self_size.new_width(line_right), fmt_ctx); if(min_rendered_width < el->width() && el->src_el()->css().get_width().is_predefined()) { - el->render(line_left, line_top, self_size.new_width(min_rendered_width)); + el->render(line_left, line_top, self_size.new_width(min_rendered_width), fmt_ctx); } if (el->src_el()->css().get_float() == float_left) { if(el->right() > line_right) { - int new_top = find_next_line_top(el->top(), el->width(), self_size.render_width); - el->pos().x = get_line_left(new_top) + el->content_offset_left(); + int new_top = fmt_ctx->find_next_line_top(el->top(), el->width(), self_size.render_width); + el->pos().x = fmt_ctx->get_line_left(new_top) + el->content_offset_left(); el->pos().y = new_top + el->content_offset_top(); } - add_float(el, 0, 0, self_size.context_idx); - fix_line_width(float_left, self_size); + fmt_ctx->add_float(el, min_rendered_width, self_size.context_idx); + fix_line_width(float_left, self_size, fmt_ctx); ret_width = el->right(); } else if (el->src_el()->css().get_float() == float_right) { if(line_left + el->width() > line_right) { - int new_top = find_next_line_top(el->top(), el->width(), self_size.render_width); - el->pos().x = get_line_right(new_top, self_size.render_width) - el->width() + el->content_offset_left(); + int new_top = fmt_ctx->find_next_line_top(el->top(), el->width(), self_size.render_width); + el->pos().x = fmt_ctx->get_line_right(new_top, self_size.render_width) - el->width() + el->content_offset_left(); el->pos().y = new_top + el->content_offset_top(); } else { el->pos().x = line_right - el->width() + el->content_offset_left(); } - add_float(el, 0, 0, self_size.context_idx); - fix_line_width(float_right, self_size); + fmt_ctx->add_float(el, min_rendered_width, self_size.context_idx); + fix_line_width(float_right, self_size, fmt_ctx); line_left = 0; line_right = self_size.render_width; - get_line_left_right(line_top, self_size.render_width, line_left, line_right); + fmt_ctx->get_line_left_right(line_top, self_size.render_width, line_left, line_right); ret_width = ret_width + (self_size.render_width - line_right); } return ret_width; } -int litehtml::render_item_block::get_floats_height(element_float el_float) const -{ - if(src_el()->is_floats_holder()) - { - int h = 0; - - for(const auto& fb : m_floats_left) - { - bool process = false; - switch(el_float) - { - case float_none: - process = true; - break; - case float_left: - if (fb.clear_floats == clear_left || fb.clear_floats == clear_both) - { - process = true; - } - break; - case float_right: - if (fb.clear_floats == clear_right || fb.clear_floats == clear_both) - { - process = true; - } - break; - } - if(process) - { - if(el_float == float_none) - { - h = std::max(h, fb.pos.bottom()); - } else - { - h = std::max(h, fb.pos.top()); - } - } - } - - - for(const auto& fb : m_floats_right) - { - int process = false; - switch(el_float) - { - case float_none: - process = true; - break; - case float_left: - if (fb.clear_floats == clear_left || fb.clear_floats == clear_both) - { - process = true; - } - break; - case float_right: - if (fb.clear_floats == clear_right || fb.clear_floats == clear_both) - { - process = true; - } - break; - } - if(process) - { - if(el_float == float_none) - { - h = std::max(h, fb.pos.bottom()); - } else - { - h = std::max(h, fb.pos.top()); - } - } - } - - return h; - } - auto el_parent = parent(); - if (el_parent) - { - int h = el_parent->get_floats_height(el_float); - return h - m_pos.y; - } - return 0; -} - -int litehtml::render_item_block::get_left_floats_height() const -{ - if(src_el()->is_floats_holder()) - { - int h = 0; - if(!m_floats_left.empty()) - { - for (const auto& fb : m_floats_left) - { - h = std::max(h, fb.pos.bottom()); - } - } - return h; - } - auto el_parent = parent(); - if (el_parent) - { - int h = el_parent->get_left_floats_height(); - return h - m_pos.y; - } - return 0; -} - -int litehtml::render_item_block::get_right_floats_height() const -{ - if(src_el()->is_floats_holder()) - { - int h = 0; - if(!m_floats_right.empty()) - { - for(const auto& fb : m_floats_right) - { - h = std::max(h, fb.pos.bottom()); - } - } - return h; - } - auto el_parent = parent(); - if (el_parent) - { - int h = el_parent->get_right_floats_height(); - return h - m_pos.y; - } - return 0; -} - -int litehtml::render_item_block::get_line_left( int y ) -{ - if(src_el()->is_floats_holder()) - { - if(m_cache_line_left.is_valid && m_cache_line_left.hash == y) - { - return m_cache_line_left.val; - } - - int w = 0; - for(const auto& fb : m_floats_left) - { - if (y >= fb.pos.top() && y < fb.pos.bottom()) - { - w = std::max(w, fb.pos.right()); - if (w < fb.pos.right()) - { - break; - } - } - } - m_cache_line_left.set_value(y, w); - return w; - } - auto el_parent = parent(); - if (el_parent) - { - int w = el_parent->get_line_left(y + m_pos.y); - if (w < 0) - { - w = 0; - } - return w - (w ? m_pos.x : 0); - } - return 0; -} - -int litehtml::render_item_block::get_line_right( int y, int def_right ) -{ - if(src_el()->is_floats_holder()) - { - if(m_cache_line_right.is_valid && m_cache_line_right.hash == y) - { - if(m_cache_line_right.is_default) - { - return def_right; - } else - { - return std::min(m_cache_line_right.val, def_right); - } - } - - int w = def_right; - m_cache_line_right.is_default = true; - for(const auto& fb : m_floats_right) - { - if(y >= fb.pos.top() && y < fb.pos.bottom()) - { - w = std::min(w, fb.pos.left()); - m_cache_line_right.is_default = false; - if(w > fb.pos.left()) - { - break; - } - } - } - m_cache_line_right.set_value(y, w); - return w; - } - auto el_parent = parent(); - if (el_parent) - { - int w = el_parent->get_line_right(y + m_pos.y, def_right + m_pos.x); - return w - m_pos.x; - } - return 0; -} - - -void litehtml::render_item_block::get_line_left_right( int y, int def_right, int& ln_left, int& ln_right ) -{ - if(src_el()->is_floats_holder()) - { - ln_left = get_line_left(y); - ln_right = get_line_right(y, def_right); - } else - { - auto el_parent = parent(); - if (el_parent) - { - el_parent->get_line_left_right(y + m_pos.y, def_right + m_pos.x, ln_left, ln_right); - } - ln_right -= m_pos.x; - - if(ln_left < 0) - { - ln_left = 0; - } else if (ln_left > 0) - { - ln_left -= m_pos.x; - if (ln_left < 0) - { - ln_left = 0; - } - } - } -} - -void litehtml::render_item_block::clear_floats(int context) -{ - if(src_el()->is_floats_holder()) - { - auto iter = m_floats_left.begin(); - while(iter != m_floats_left.end()) - { - if(iter->context >= context) - { - iter = m_floats_left.erase(iter); - m_cache_line_left.invalidate(); - } else - { - iter++; - } - } - - iter = m_floats_right.begin(); - while(iter != m_floats_right.end()) - { - if(iter->context >= context) - { - iter = m_floats_right.erase(iter); - m_cache_line_right.invalidate(); - } else - { - iter++; - } - } - } else - { - auto el_parent = parent(); - if (el_parent) - { - el_parent->clear_floats(context); - } - } -} - -void litehtml::render_item_block::add_float(const std::shared_ptr &el, int x, int y, int context) -{ - if(src_el()->is_floats_holder()) - { - floated_box fb; - fb.pos.x = el->left() + x; - fb.pos.y = el->top() + y; - fb.pos.width = el->width(); - fb.pos.height = el->height(); - fb.float_side = el->src_el()->css().get_float(); - fb.clear_floats = el->src_el()->css().get_clear(); - fb.el = el; - fb.context = context; - - if(fb.float_side == float_left) - { - if(m_floats_left.empty()) - { - m_floats_left.push_back(fb); - } else - { - bool inserted = false; - for(auto i = m_floats_left.begin(); i != m_floats_left.end(); i++) - { - if(fb.pos.right() > i->pos.right()) - { - m_floats_left.insert(i, std::move(fb)); - inserted = true; - break; - } - } - if(!inserted) - { - m_floats_left.push_back(std::move(fb)); - } - } - m_cache_line_left.invalidate(); - } else if(fb.float_side == float_right) - { - if(m_floats_right.empty()) - { - m_floats_right.push_back(std::move(fb)); - } else - { - bool inserted = false; - for(auto i = m_floats_right.begin(); i != m_floats_right.end(); i++) - { - if(fb.pos.left() < i->pos.left()) - { - m_floats_right.insert(i, std::move(fb)); - inserted = true; - break; - } - } - if(!inserted) - { - m_floats_right.push_back(fb); - } - } - m_cache_line_right.invalidate(); - } - } else - { - auto el_parent = parent(); - if (el_parent) - { - el_parent->add_float(el, x + m_pos.x, y + m_pos.y, context); - } - } -} - -int litehtml::render_item_block::get_cleared_top(const std::shared_ptr &el, int line_top) const -{ - switch(el->src_el()->css().get_clear()) - { - case clear_left: - { - int fh = get_left_floats_height(); - if(fh && fh > line_top) - { - line_top = fh; - } - } - break; - case clear_right: - { - int fh = get_right_floats_height(); - if(fh && fh > line_top) - { - line_top = fh; - } - } - break; - case clear_both: - { - int fh = get_floats_height(float_none); - if(fh && fh > line_top) - { - line_top = fh; - } - } - break; - default: - if(el->src_el()->css().get_float() != float_none) - { - int fh = get_floats_height(el->src_el()->css().get_float()); - if(fh && fh > line_top) - { - line_top = fh; - } - } - break; - } - return line_top; -} - -int litehtml::render_item_block::find_next_line_top( int top, int width, int def_right ) -{ - if(src_el()->is_floats_holder()) - { - int new_top = top; - int_vector points; - - for(const auto& fb : m_floats_left) - { - if(fb.pos.top() >= top) - { - if(find(points.begin(), points.end(), fb.pos.top()) == points.end()) - { - points.push_back(fb.pos.top()); - } - } - if (fb.pos.bottom() >= top) - { - if (find(points.begin(), points.end(), fb.pos.bottom()) == points.end()) - { - points.push_back(fb.pos.bottom()); - } - } - } - - for (const auto& fb : m_floats_right) - { - if (fb.pos.top() >= top) - { - if (find(points.begin(), points.end(), fb.pos.top()) == points.end()) - { - points.push_back(fb.pos.top()); - } - } - if (fb.pos.bottom() >= top) - { - if (find(points.begin(), points.end(), fb.pos.bottom()) == points.end()) - { - points.push_back(fb.pos.bottom()); - } - } - } - - if(!points.empty()) - { - sort(points.begin(), points.end(), std::less( )); - new_top = points.back(); - - for(auto pt : points) - { - int pos_left = 0; - int pos_right = def_right; - get_line_left_right(pt, def_right, pos_left, pos_right); - - if(pos_right - pos_left >= width) - { - new_top = pt; - break; - } - } - } - return new_top; - } - auto el_parent = parent(); - if (el_parent) - { - int new_top = el_parent->find_next_line_top(top + m_pos.y, width, def_right + m_pos.x); - return new_top - m_pos.y; - } - return 0; -} - -void litehtml::render_item_block::update_floats(int dy, const std::shared_ptr &_parent) -{ - if(src_el()->is_floats_holder()) - { - bool reset_cache = false; - for(auto fb = m_floats_left.rbegin(); fb != m_floats_left.rend(); fb++) - { - if(fb->el->src_el()->is_ancestor(_parent->src_el())) - { - reset_cache = true; - fb->pos.y += dy; - } - } - if(reset_cache) - { - m_cache_line_left.invalidate(); - } - reset_cache = false; - for(auto fb = m_floats_right.rbegin(); fb != m_floats_right.rend(); fb++) - { - if(fb->el->src_el()->is_ancestor(_parent->src_el())) - { - reset_cache = true; - fb->pos.y += dy; - } - } - if(reset_cache) - { - m_cache_line_right.invalidate(); - } - } else - { - auto el_parent = parent(); - if (el_parent) - { - el_parent->update_floats(dy, _parent); - } - } -} - std::shared_ptr litehtml::render_item_block::init() { { @@ -701,28 +196,14 @@ std::shared_ptr litehtml::render_item_block::init() return ret; } -int litehtml::render_item_block::render(int x, int y, const containing_block_context &containing_block_size, bool second_pass) +int litehtml::render_item_block::_render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) { - int ret_width = 0; - calc_outlines(containing_block_size.width); - - m_pos.clear(); - m_pos.move_to(x, y); - - m_pos.x += content_offset_left(); - m_pos.y += content_offset_top(); - - m_floats_left.clear(); - m_floats_right.clear(); - m_cache_line_left.invalidate(); - m_cache_line_right.invalidate(); - containing_block_context self_size = calculate_containing_block_context(containing_block_size); //***************************************** // Render content //***************************************** - ret_width = _render_content(x, y, second_pass, ret_width, self_size); + int ret_width = _render_content(x, y, second_pass, self_size, fmt_ctx); //***************************************** bool requires_rerender = false; // when true, the second pass for content rendering is required @@ -762,18 +243,15 @@ int litehtml::render_item_block::render(int x, int y, const containing_block_con // re-render content with new width if required if (requires_rerender && !second_pass && !is_root()) { - if(src_el()->is_floats_holder()) + if(src_el()->is_block_formatting_context()) { - m_floats_left.clear(); - m_floats_right.clear(); + fmt_ctx->clear_floats(-1); } else { - clear_floats(self_size.context_idx); + fmt_ctx->clear_floats(self_size.context_idx); } - m_cache_line_left.invalidate(); - m_cache_line_right.invalidate(); - _render_content(x, y, true, ret_width, self_size.new_width(m_pos.width)); + _render_content(x, y, true, self_size.new_width(m_pos.width), fmt_ctx); } // Set block height @@ -784,10 +262,10 @@ int litehtml::render_item_block::render(int x, int y, const containing_block_con { m_pos.height -= box_sizing_height(); } - } else if (src_el()->is_floats_holder()) + } else if (src_el()->is_block_formatting_context()) { // add the floats' height to the block height - int floats_height = get_floats_height(); + int floats_height = fmt_ctx->get_floats_height(); if (floats_height > m_pos.height) { m_pos.height = floats_height; @@ -833,12 +311,5 @@ int litehtml::render_item_block::render(int x, int y, const containing_block_con } - if (src_el()->is_floats_holder() && !second_pass) - { - for (const auto& fb : m_floats_left) - { - fb.el->apply_relative_shift(containing_block_size); - } - } return ret_width + content_offset_width(); } diff --git a/src/render_block_context.cpp b/src/render_block_context.cpp index 2072209d7..0d16ab58f 100644 --- a/src/render_block_context.cpp +++ b/src/render_block_context.cpp @@ -2,11 +2,11 @@ #include "render_item.h" #include "document.h" -int litehtml::render_item_block_context::_render_content(int x, int y, bool second_pass, int ret_width, - const containing_block_context &self_size) +int litehtml::render_item_block_context::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) { element_position el_position; + int ret_width = 0; int child_top = 0; int last_margin = 0; std::shared_ptr last_margin_el; @@ -22,7 +22,7 @@ int litehtml::render_item_block_context::_render_content(int x, int y, bool seco if(el->src_el()->css().get_float() != float_none) { - int rw = place_float(el, child_top, self_size); + int rw = place_float(el, child_top, self_size, fmt_ctx); if (rw > ret_width) { ret_width = rw; @@ -31,14 +31,14 @@ int litehtml::render_item_block_context::_render_content(int x, int y, bool seco { if(el->src_el()->css().get_position() == element_position_absolute || el->src_el()->css().get_position() == element_position_fixed) { - int min_rendered_width = el->render(0, child_top, self_size); + int min_rendered_width = el->render(0, child_top, self_size, fmt_ctx); if(min_rendered_width < el->width() && el->src_el()->css().get_width().is_predefined()) { - el->render(0, child_top, self_size.new_width(min_rendered_width)); + el->render(0, child_top, self_size.new_width(min_rendered_width), fmt_ctx); } } else { - child_top = get_cleared_top(el, child_top); + child_top = fmt_ctx->get_cleared_top(el, child_top); int child_x = 0; int child_width = self_size.render_width; @@ -63,11 +63,11 @@ int litehtml::render_item_block_context::_render_content(int x, int y, bool seco } } - if(el->src_el()->is_replaced() || el->src_el()->is_floats_holder() || el->src_el()->css().get_display() == display_table) + if(el->src_el()->is_replaced() || el->src_el()->is_block_formatting_context() || el->src_el()->css().get_display() == display_table) { int ln_left = 0; int ln_right = child_width; - get_line_left_right(child_top, child_width, ln_left, ln_right); + fmt_ctx->get_line_left_right(child_top, child_width, ln_left, ln_right); child_x = ln_left; child_width = ln_right - ln_left; @@ -76,11 +76,11 @@ int litehtml::render_item_block_context::_render_content(int x, int y, bool seco el->pos().height = el->src_el()->css().get_height().calc_percent(el_parent ? el_parent->pos().height : 0); } - int rw = el->render(child_x, child_top, self_size.new_width(child_width)); + int rw = el->render(child_x, child_top, self_size.new_width(child_width), fmt_ctx); // Render table with "width: auto" into returned width if(el->src_el()->css().get_display() == display_table && rw < child_width && el->src_el()->css().get_width().is_predefined()) { - el->render(child_x, child_top, self_size.new_width(rw)); + el->render(child_x, child_top, self_size.new_width(rw), fmt_ctx); } int auto_margin = el->calc_auto_margins(child_width); if(auto_margin) diff --git a/src/render_flex.cpp b/src/render_flex.cpp index c9cf8e538..983f61812 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -2,8 +2,7 @@ #include "render_item.h" #include "types.h" -int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, int ret_width, - const containing_block_context &self_size) +int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) { return 0; } diff --git a/src/render_image.cpp b/src/render_image.cpp index 38f576bc1..37105278e 100644 --- a/src/render_image.cpp +++ b/src/render_image.cpp @@ -2,8 +2,7 @@ #include "render_item.h" #include "document.h" -int -litehtml::render_item_image::render(int x, int y, const containing_block_context &containing_block_size, bool second_pass) +int litehtml::render_item_image::_render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) { int parent_width = containing_block_size.width; diff --git a/src/render_inline_context.cpp b/src/render_inline_context.cpp index 6750ccceb..72cd1fe3d 100644 --- a/src/render_inline_context.cpp +++ b/src/render_inline_context.cpp @@ -3,8 +3,7 @@ #include "document.h" #include "iterators.h" -int litehtml::render_item_inline_context::_render_content(int x, int y, bool second_pass, int ret_width, - const containing_block_context &self_size) +int litehtml::render_item_inline_context::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) { m_line_boxes.clear(); m_max_line_width = 0; @@ -50,20 +49,20 @@ int litehtml::render_item_inline_context::_render_content(int x, int y, bool sec } } // place element into rendering flow - place_inline(std::unique_ptr(new line_box_item(el)), self_size); + place_inline(std::unique_ptr(new line_box_item(el)), self_size, fmt_ctx); } break; case iterator_item_type_start_parent: { el->clear_inline_boxes(); - place_inline(std::unique_ptr(new lbi_start(el)), self_size); + place_inline(std::unique_ptr(new lbi_start(el)), self_size, fmt_ctx); } break; case iterator_item_type_end_parent: { - place_inline(std::unique_ptr(new lbi_end(el)), self_size); + place_inline(std::unique_ptr(new lbi_end(el)), self_size, fmt_ctx); } break; } @@ -79,7 +78,7 @@ int litehtml::render_item_inline_context::_render_content(int x, int y, bool sec m_margins.top = std::max(m_line_boxes.front()->top_margin(), m_margins.top); if (m_margins.top != old_top) { - update_floats(m_margins.top - old_top, shared_from_this()); + fmt_ctx->update_floats(m_margins.top - old_top, shared_from_this()); } } if (collapse_bottom_margin()) @@ -93,13 +92,13 @@ int litehtml::render_item_inline_context::_render_content(int x, int y, bool sec } } - return std::max(ret_width, m_max_line_width); + return m_max_line_width; } void litehtml::render_item_inline_context::fix_line_width(element_float flt, - const containing_block_context &self_size) + const containing_block_context &self_size, + formatting_context* fmt_ctx) { - int ret_width = 0; if(!m_line_boxes.empty()) { auto el_front = m_line_boxes.back()->get_first_text_part(); @@ -128,7 +127,7 @@ void litehtml::render_item_inline_context::fix_line_width(element_float flt, for(auto& item : items) { - place_inline(std::move(item), self_size); + place_inline(std::move(item), self_size, fmt_ctx); } } else { @@ -137,7 +136,7 @@ void litehtml::render_item_inline_context::fix_line_width(element_float flt, int line_left = 0; int line_right = self_size.render_width; - get_line_left_right(line_top, self_size.render_width, line_left, line_right); + fmt_ctx->get_line_left_right(line_top, self_size.render_width, line_left, line_right); if(m_line_boxes.size() == 1) { @@ -157,7 +156,7 @@ void litehtml::render_item_inline_context::fix_line_width(element_float flt, auto items = m_line_boxes.back()->new_width(line_left, line_right); for(auto& item : items) { - place_inline(std::move(item), self_size); + place_inline(std::move(item), self_size, fmt_ctx); } } } @@ -183,7 +182,7 @@ std::list > litehtml::render_item_inlin return ret; } -int litehtml::render_item_inline_context::new_box(const std::unique_ptr& el, line_context& line_ctx, const containing_block_context &self_size) +int litehtml::render_item_inline_context::new_box(const std::unique_ptr& el, line_context& line_ctx, const containing_block_context &self_size, formatting_context* fmt_ctx) { auto items = finish_last_box(false, self_size); int line_top = 0; @@ -191,22 +190,22 @@ int litehtml::render_item_inline_context::new_box(const std::unique_ptrbottom(); } - line_ctx.top = get_cleared_top(el->get_el(), line_top); + line_ctx.top = fmt_ctx->get_cleared_top(el->get_el(), line_top); line_ctx.left = 0; line_ctx.right = self_size.render_width; line_ctx.fix_top(); - get_line_left_right(line_ctx.top, self_size.render_width, line_ctx.left, line_ctx.right); + fmt_ctx->get_line_left_right(line_ctx.top, self_size.render_width, line_ctx.left, line_ctx.right); - if(el->get_el()->src_el()->is_inline() || el->get_el()->src_el()->is_floats_holder()) + if(el->get_el()->src_el()->is_inline() || el->get_el()->src_el()->is_block_formatting_context()) { if (el->get_el()->width() > line_ctx.right - line_ctx.left) { - line_ctx.top = find_next_line_top(line_ctx.top, el->get_el()->width(), self_size.render_width); + line_ctx.top = fmt_ctx->find_next_line_top(line_ctx.top, el->get_el()->width(), self_size.render_width); line_ctx.left = 0; line_ctx.right = self_size.render_width; line_ctx.fix_top(); - get_line_left_right(line_ctx.top, self_size.render_width, line_ctx.left, line_ctx.right); + fmt_ctx->get_line_left_right(line_ctx.top, self_size.render_width, line_ctx.left, line_ctx.right); } } @@ -241,7 +240,7 @@ int litehtml::render_item_inline_context::new_box(const std::unique_ptr item, const containing_block_context &self_size) +void litehtml::render_item_inline_context::place_inline(std::unique_ptr item, const containing_block_context &self_size, formatting_context* fmt_ctx) { if(item->get_el()->src_el()->css().get_display() == display_none) return; @@ -252,7 +251,7 @@ void litehtml::render_item_inline_context::place_inline(std::unique_ptrtop(); } - int ret = place_float(item->get_el(), line_top, self_size); + int ret = place_float(item->get_el(), line_top, self_size, fmt_ctx); if(ret > m_max_line_width) { m_max_line_width = ret; @@ -269,16 +268,16 @@ void litehtml::render_item_inline_context::place_inline(std::unique_ptrget_line_left_right(line_ctx.top, self_size.render_width, line_ctx.left, line_ctx.right); if(item->get_type() == line_box_item::type_text_part) { if(item->get_el()->src_el()->is_inline_box()) { - int min_rendered_width = item->get_el()->render(line_ctx.left, line_ctx.top, self_size.new_width(line_ctx.right)); + int min_rendered_width = item->get_el()->render(line_ctx.left, line_ctx.top, self_size.new_width(line_ctx.right), fmt_ctx); if(min_rendered_width < item->get_el()->width() && item->get_el()->src_el()->css().get_width().is_predefined()) { - item->get_el()->render(line_ctx.left, line_ctx.top, self_size.new_width(min_rendered_width)); + item->get_el()->render(line_ctx.left, line_ctx.top, self_size.new_width(min_rendered_width), fmt_ctx); } item->set_rendered_min_width(min_rendered_width); } else if(item->get_el()->src_el()->css().get_display() == display_inline_text) @@ -300,7 +299,7 @@ void litehtml::render_item_inline_context::place_inline(std::unique_ptrtop(); @@ -311,7 +310,7 @@ void litehtml::render_item_inline_context::place_inline(std::unique_ptrget_line_left_right(line_ctx.top, self_size.render_width, line_ctx.left, line_ctx.right); } if(!item->get_el()->src_el()->is_inline()) diff --git a/src/render_item.cpp b/src/render_item.cpp index daf41e975..da7a7747a 100644 --- a/src/render_item.cpp +++ b/src/render_item.cpp @@ -27,6 +27,36 @@ litehtml::render_item::render_item(std::shared_ptr _src_el) : m_borders.bottom = doc->to_pixels(src_el()->css().get_borders().bottom.width, fnt_size); } +int litehtml::render_item::render(int x, int y, const containing_block_context& containing_block_size, formatting_context* fmt_ctx, bool second_pass) +{ + int ret; + + calc_outlines(containing_block_size.width); + + m_pos.clear(); + m_pos.move_to(x, y); + + int content_left = content_offset_left(); + int content_top = content_offset_top(); + + m_pos.x += content_left; + m_pos.y += content_top; + + + if(src_el()->is_block_formatting_context() || ! fmt_ctx) + { + formatting_context fmt; + fmt.push_position(content_left, content_top); + ret = _render(x, y, containing_block_size, &fmt, second_pass); + fmt.apply_relative_shift(containing_block_size); + } else + { + fmt_ctx->push_position(x + content_left, y + content_top); + ret = _render(x, y, containing_block_size, fmt_ctx, second_pass); + fmt_ctx->pop_position(x + content_left, y + content_top); + } + return ret; +} void litehtml::render_item::calc_outlines( int parent_width ) { @@ -438,7 +468,7 @@ void litehtml::render_item::render_positioned(render_type rt) if(need_render) { position pos = el->m_pos; - el->render(el->left(), el->top(), containing_block_size.new_width(el->width()), true); + el->render(el->left(), el->top(), containing_block_size.new_width(el->width()), nullptr, true); el->m_pos = pos; } diff --git a/src/render_table.cpp b/src/render_table.cpp index 2ec048a98..c6756304e 100644 --- a/src/render_table.cpp +++ b/src/render_table.cpp @@ -11,30 +11,12 @@ litehtml::render_item_table::render_item_table(std::shared_ptr _src_el) { } -int litehtml::render_item_table::render(int x, int y, const containing_block_context &containing_block_size, bool second_pass) +int litehtml::render_item_table::_render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) { if (!m_grid) return 0; - calc_outlines(containing_block_size.width); - - m_pos.clear(); - m_pos.move_to(x, y); - - m_pos.x += content_offset_left(); - m_pos.y += content_offset_top(); - containing_block_context self_size = calculate_containing_block_context(containing_block_size); -/* if(cb_size.width_type == containing_block_context::cbc_value_type_auto) - { - max_width -= content_offset_left() + content_offset_right(); - } else - { - max_width -= m_padding.width() + m_borders.width(); - } - if(max_width < 0) max_width = 0; - max_width = std::min(max_width, cb_size.width); -*/ // Calculate table spacing int table_width_spacing = 0; if (src_el()->css().get_border_collapse() == border_collapse_separate) @@ -71,7 +53,7 @@ int litehtml::render_item_table::render(int x, int y, const containing_block_con table_cell* cell = m_grid->cell(0, row); if (cell && cell->el) { - cell->min_width = cell->max_width = cell->el->render(0, 0, self_size.new_width(self_size.render_width - table_width_spacing)); + cell->min_width = cell->max_width = cell->el->render(0, 0, self_size.new_width(self_size.render_width - table_width_spacing), fmt_ctx); cell->el->pos().width = cell->min_width - cell->el->content_offset_left() - cell->el->content_offset_right(); } @@ -89,7 +71,7 @@ int litehtml::render_item_table::render(int x, int y, const containing_block_con if (!m_grid->column(col).css_width.is_predefined() && m_grid->column(col).css_width.units() != css_units_percentage) { int css_w = m_grid->column(col).css_width.calc_percent(self_size.width); - int el_w = cell->el->render(0, 0, self_size.new_width(css_w)); + int el_w = cell->el->render(0, 0, self_size.new_width(css_w),fmt_ctx); cell->min_width = cell->max_width = std::max(css_w, el_w); cell->el->pos().width = cell->min_width - cell->el->content_offset_left() - cell->el->content_offset_right(); @@ -97,9 +79,9 @@ int litehtml::render_item_table::render(int x, int y, const containing_block_con else { // calculate minimum content width - cell->min_width = cell->el->render(0, 0, self_size.new_width(cell->el->content_offset_width())); + cell->min_width = cell->el->render(0, 0, self_size.new_width(cell->el->content_offset_width()), fmt_ctx); // calculate maximum content width - cell->max_width = cell->el->render(0, 0, self_size.new_width(self_size.render_width - table_width_spacing)); + cell->max_width = cell->el->render(0, 0, self_size.new_width(self_size.render_width - table_width_spacing), fmt_ctx); } } } @@ -201,7 +183,7 @@ int litehtml::render_item_table::render(int x, int y, const containing_block_con //if (cell->el->pos().width != cell_width - cell->el->content_offset_left() - // cell->el->content_offset_right()) { - cell->el->render(m_grid->column(col).left, 0, self_size.new_width(cell_width), true); + cell->el->render(m_grid->column(col).left, 0, self_size.new_width(cell_width), fmt_ctx, true); cell->el->pos().width = cell_width - cell->el->content_offset_left() - cell->el->content_offset_right(); } @@ -343,7 +325,7 @@ int litehtml::render_item_table::render(int x, int y, const containing_block_con for (auto& caption : m_grid->captions()) { - caption->render(-border_left(), captions_height, self_size.new_width(table_width + border_left() + border_right())); + caption->render(-border_left(), captions_height, self_size.new_width(table_width + border_left() + border_right()), fmt_ctx); captions_height += caption->height(); } From 7ec04267b170160c995cc2e8986baba8e577dd99 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Wed, 7 Jun 2023 02:52:59 +0300 Subject: [PATCH 03/73] Fixed calculating min with for elements with floats Fixes issue #99 --- include/litehtml/element.h | 3 +- include/litehtml/formatting_context.h | 4 +- include/litehtml/html_tag.h | 1 - src/element.cpp | 17 ++++++- src/formatting_context.cpp | 30 ++++++++++++ src/html_tag.cpp | 16 ------ src/render_block.cpp | 21 ++++---- src/render_item.cpp | 4 +- test/render/test34.htm | 14 ++++++ test/render/test34.htm.png | Bin 0 -> 409 bytes test/render/test35.htm | 28 +++++++++++ test/render/test35.htm.png | Bin 0 -> 250 bytes test/render/test36.htm | 68 ++++++++++++++++++++++++++ test/render/test36.htm.png | Bin 0 -> 477 bytes 14 files changed, 172 insertions(+), 34 deletions(-) create mode 100644 test/render/test34.htm create mode 100644 test/render/test34.htm.png create mode 100644 test/render/test35.htm create mode 100644 test/render/test35.htm.png create mode 100644 test/render/test36.htm create mode 100644 test/render/test36.htm.png diff --git a/include/litehtml/element.h b/include/litehtml/element.h index 5a8c924ec..fd543da77 100644 --- a/include/litehtml/element.h +++ b/include/litehtml/element.h @@ -49,6 +49,7 @@ namespace litehtml position get_placement() const; bool is_positioned() const; bool is_float() const; + bool is_block_formatting_context() const; bool is_root() const; element::ptr parent() const; @@ -119,8 +120,6 @@ namespace litehtml virtual element::ptr find_adjacent_sibling(const element::ptr& el, const css_selector& selector, bool apply_pseudo = true, bool* is_pseudo = nullptr); virtual element::ptr find_sibling(const element::ptr& el, const css_selector& selector, bool apply_pseudo = true, bool* is_pseudo = nullptr); virtual void get_content_size(size& sz, int max_width); - virtual bool is_block_formatting_context() const; - virtual void update_floats(int dy, const ptr &parent); virtual bool is_nth_child(const element::ptr& el, int num, int off, bool of_type) const; virtual bool is_nth_last_child(const element::ptr& el, int num, int off, bool of_type) const; virtual bool is_only_child(const element::ptr& el, bool of_type) const; diff --git a/include/litehtml/formatting_context.h b/include/litehtml/formatting_context.h index b867b51aa..eee481dc4 100644 --- a/include/litehtml/formatting_context.h +++ b/include/litehtml/formatting_context.h @@ -42,10 +42,12 @@ namespace litehtml ln_left = get_line_left(y); ln_right = get_line_right(y, def_right); } - virtual int get_line_right( int y, int def_right ); + int get_line_right( int y, int def_right ); int get_cleared_top(const std::shared_ptr &el, int line_top) const; void update_floats(int dy, const std::shared_ptr &parent); void apply_relative_shift(const containing_block_context &containing_block_size); + int find_min_left(int y, int context_idx); + int find_min_right(int y, int right, int context_idx); }; } diff --git a/include/litehtml/html_tag.h b/include/litehtml/html_tag.h index 6ec7cc444..3c28effb4 100644 --- a/include/litehtml/html_tag.h +++ b/include/litehtml/html_tag.h @@ -105,7 +105,6 @@ namespace litehtml void parse_attributes() override; void get_content_size(size& sz, int max_width) override; - bool is_block_formatting_context() const override; void add_style(const style& style) override; bool is_nth_child(const element::ptr& el, int num, int off, bool of_type) const override; diff --git a/src/element.cpp b/src/element.cpp index 22dcaaede..7b4c7c3ff 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -273,6 +273,21 @@ element::ptr element::_add_before_after(int type, const style& style) return nullptr; } +bool element::is_block_formatting_context() const +{ + if( m_css.get_display() == display_inline_block || + m_css.get_display() == display_table_cell || + m_css.get_display() == display_table_caption || + is_root() || + m_css.get_float() != float_none || + m_css.get_position() == element_position_absolute || + m_css.get_position() == element_position_fixed || + m_css.get_overflow() > overflow_visible) + { + return true; + } + return false; +} const background* element::get_background(bool own_only) LITEHTML_RETURN_FUNC(nullptr) void element::add_style( const style& style) LITEHTML_EMPTY_FUNC @@ -288,8 +303,6 @@ bool element::is_nth_child(const element::ptr&, int num, int off, bool of_type) bool element::is_only_child(const element::ptr& el, bool of_type) const LITEHTML_RETURN_FUNC(false) element::ptr element::get_child( int idx ) const LITEHTML_RETURN_FUNC(nullptr) size_t element::get_children_count() const LITEHTML_RETURN_FUNC(0) -void element::update_floats(int dy, const ptr &parent) LITEHTML_EMPTY_FUNC -bool element::is_block_formatting_context() const LITEHTML_RETURN_FUNC(false) void element::get_content_size( size& sz, int max_width ) LITEHTML_EMPTY_FUNC bool element::appendChild(const ptr &el) LITEHTML_RETURN_FUNC(false) bool element::removeChild(const ptr &el) LITEHTML_RETURN_FUNC(false) diff --git a/src/formatting_context.cpp b/src/formatting_context.cpp index d909f1610..4e41c7b5f 100644 --- a/src/formatting_context.cpp +++ b/src/formatting_context.cpp @@ -409,3 +409,33 @@ void litehtml::formatting_context::apply_relative_shift(const containing_block_c fb.el->apply_relative_shift(containing_block_size); } } + +int litehtml::formatting_context::find_min_left(int y, int context_idx) +{ + y += m_current_top; + int min_left = m_current_left; + for(const auto& fb : m_floats_left) + { + if (y >= fb.pos.top() && y < fb.pos.bottom() && fb.context == context_idx) + { + min_left += fb.min_width; + } + } + if(min_left < m_current_left) return 0; + return min_left - m_current_left; +} + +int litehtml::formatting_context::find_min_right(int y, int right, int context_idx) +{ + y += m_current_top; + int min_right = right + m_current_left; + for(const auto& fb : m_floats_right) + { + if (y >= fb.pos.top() && y < fb.pos.bottom() && fb.context == context_idx) + { + min_right -= fb.min_width; + } + } + if(min_right < m_current_left) return 0; + return min_right - m_current_left; +} diff --git a/src/html_tag.cpp b/src/html_tag.cpp index 3072b1b29..b02215787 100644 --- a/src/html_tag.cpp +++ b/src/html_tag.cpp @@ -1063,22 +1063,6 @@ bool litehtml::html_tag::is_replaced() const return false; } -bool litehtml::html_tag::is_block_formatting_context() const -{ - if( m_css.get_display() == display_inline_block || - m_css.get_display() == display_table_cell || - m_css.get_display() == display_table_caption || - is_root() || - m_css.get_float() != float_none || - m_css.get_position() == element_position_absolute || - m_css.get_position() == element_position_fixed || - m_css.get_overflow() > overflow_visible) - { - return true; - } - return false; -} - size_t litehtml::html_tag::get_children_count() const { return m_children.size(); diff --git a/src/render_block.cpp b/src/render_block.cpp index 6faafba03..3c5dbdb83 100644 --- a/src/render_block.cpp +++ b/src/render_block.cpp @@ -21,13 +21,14 @@ int litehtml::render_item_block::place_float(const std::shared_ptr { if(el->right() > line_right) { - int new_top = fmt_ctx->find_next_line_top(el->top(), el->width(), self_size.render_width); - el->pos().x = fmt_ctx->get_line_left(new_top) + el->content_offset_left(); - el->pos().y = new_top + el->content_offset_top(); + line_top = fmt_ctx->find_next_line_top(el->top(), el->width(), self_size.render_width); + el->pos().x = fmt_ctx->get_line_left(line_top) + el->content_offset_left(); + el->pos().y = line_top + el->content_offset_top(); } fmt_ctx->add_float(el, min_rendered_width, self_size.context_idx); fix_line_width(float_left, self_size, fmt_ctx); - ret_width = el->right(); + + ret_width = fmt_ctx->find_min_left(line_top, self_size.context_idx); } else if (el->src_el()->css().get_float() == float_right) { if(line_left + el->width() > line_right) @@ -41,11 +42,8 @@ int litehtml::render_item_block::place_float(const std::shared_ptr } fmt_ctx->add_float(el, min_rendered_width, self_size.context_idx); fix_line_width(float_right, self_size, fmt_ctx); - line_left = 0; - line_right = self_size.render_width; - fmt_ctx->get_line_left_right(line_top, self_size.render_width, line_left, line_right); - - ret_width = ret_width + (self_size.render_width - line_right); + line_right = fmt_ctx->find_min_right(line_top, self_size.render_width, self_size.context_idx); + ret_width = self_size.render_width - line_right; } return ret_width; } @@ -257,7 +255,10 @@ int litehtml::render_item_block::_render(int x, int y, const containing_block_co // Set block height if (self_size.height.type != containing_block_context::cbc_value_type_auto) { - m_pos.height = self_size.height; + if(self_size.height > 0) + { + m_pos.height = self_size.height; + } if(src_el()->css().get_box_sizing() == box_sizing_border_box) { m_pos.height -= box_sizing_height(); diff --git a/src/render_item.cpp b/src/render_item.cpp index da7a7747a..808ffaf3f 100644 --- a/src/render_item.cpp +++ b/src/render_item.cpp @@ -149,10 +149,10 @@ bool litehtml::render_item::get_predefined_height(int& p_height, int containing_ if(h.units() == css_units_percentage) { p_height = h.calc_percent(containing_block_height); - return containing_block_height != 0; + return containing_block_height > 0; } p_height = src_el()->get_document()->to_pixels(h, src_el()->css().get_font_size()); - return true; + return p_height > 0; } int litehtml::render_item::calc_width(int defVal, int containing_block_width) const diff --git a/test/render/test34.htm b/test/render/test34.htm new file mode 100644 index 000000000..34586732b --- /dev/null +++ b/test/render/test34.htm @@ -0,0 +1,14 @@ + + + + + +
Should be on right side
+
+ + + + +
Should be on left side
diff --git a/test/render/test34.htm.png b/test/render/test34.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..fd4dbab0a4a8106bce6521bb68fc38c2cbd13c71 GIT binary patch literal 409 zcmV;K0cQS*P)vI0004CNkl1pw6b9fNql0O#5b)w5Bsqb61s@?ni?T#l2x#e0?5h|$w3BoN9l^y*0^+?!O4^1t z-dLCQO;e81Gyb(sIgd`*(-@OKk6p@!dLqhHxsSM&fNOL^x(e#HMBrU?q(Db@U zY0eQ02$CbM)oUwTi?+qLm0h%GSGFR46V2FKOU?Xx*=xqp9QF+y?p(M|^vZ zcCQz-2sqZAYE1A7ceh=i5gtMnEtje~*j?>VORW zq0|R12?@D(MC6E0Hhnlc37H>l4Kc!1=z2szI(HSM|AiouBVCc#V%!z;-DD18GMVo( z@i3!BM6OiLn_l?^{Mlg-T-CIQR1uNw*dxo#;cmvakF*H?ya|Sz_=m5#B9CwcMC4CJ zR)lorjVq=w?xqEGy6$IoCFGwXqsv8$M5u%$ + .vector-menu-tabs-legacy { + padding: 5px; + background-color: lightblue; + display: inline-block; + } + .vector-menu-tabs-legacy ul { + list-style: none; + margin: 0; + padding: 0; + } + .vector-menu-tabs-legacy li { + background-color: lightcoral; + float: left; + display: block; + margin: 0; + padding: 5px; + white-space: nowrap; + } + + + diff --git a/test/render/test35.htm.png b/test/render/test35.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..9ab5b44d878d5d6f5d5700a348fc431f6aeee575 GIT binary patch literal 250 zcmV)3L0sR + #mw-head { + position: absolute; + top: 0; + left: 0; + background-color: lightgray; + } + #right-navigation { + display: inline-block; + margin-top: 2.5em; + } + .vector-menu-tabs-legacy { + float: left; + height: 2.5em; + padding-left: 1px; + } + .vector-menu-tabs-legacy ul { + float: left; + list-style: none; + margin: 0; + padding: 0; + } + .vector-menu-tabs-legacy li { + background-color: lightblue; + float: left; + display: block; + margin: 0; + padding: 5px; + line-height: 1.125em; + white-space: nowrap; + } + .vector-search-box { + float: left; + margin-right: 5px; + margin-left: 5px; + background-color: lightgreen; + } + .vector-search-box-inner { + width: 200px; + height: 100%; + } + .vector-search-box-input { + width: 100%; + height: 30px; + box-sizing: border-box; + border: 1px solid #a2a9b1; + border-radius: 2px; + padding: 5px; + } + + +
+
+ + + +
+
diff --git a/test/render/test36.htm.png b/test/render/test36.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ef7f915aa6beca57298d7f63dc0a7ea3dd636bea GIT binary patch literal 477 zcmeAS@N?(olHy`uVBq!ia0y~yV7v%qN3bx1NYx8GKuRdUC&cyg<;(y7|6hCK*`k#j zC%l^g6rL`rTnkj*=IP=XQo;E4%6s281_CS}_JlLOWN5su=()J{ZyOFD zY(MSxShD5Q@$EY^3r7GU0ShFM1RVo)}TEBUE*FJoiyV# zj&frY?DqPfpH~?>?KbDmwl8lVzpPviGGOVIP%WjqpPkRJd#XSE6D}$0@tuA9KgGC9 zciEm#`KP*=$#Tz!$!*o_)9?FL+54OGP853^)pTXi;if-(FH{GfY7btx?zhL+n`Lii zZPa}gz43KUMNGo?ExYu;%<_1;cU$lBx7T{x8%?&omgi!-^g{FOtsT{_rH?Zeue{3* znjF2mpUY=f^d7Uu#asSdKYnRTfLY$#y_2_je%rg?Y;tVD^k?(+FPV7Ad4H{lD6q|( zyLaQcdwV{bO)!^U`pr@EZcO_74Gy;>(+ec8Exq9SN^pL;*Gu8KJ9no~$btk;>-1k~ uaxdSu#5h;^Ap#}U?4^|_j4SME&zO65!#lQ$V}-zoVeoYIb6Mw<&;$VW_~S4D literal 0 HcmV?d00001 From 672b603eff6cbe9b386b9bbc4c7579dad7de1b9e Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Wed, 7 Jun 2023 03:03:54 +0300 Subject: [PATCH 04/73] Process align attribute for table tag via master.css Fixes issue #114 --- include/litehtml/master_css.h | 13 +++++++++++++ src/el_table.cpp | 17 ----------------- 2 files changed, 13 insertions(+), 17 deletions(-) diff --git a/include/litehtml/master_css.h b/include/litehtml/master_css.h index b5c7f3f03..c8b7f3352 100644 --- a/include/litehtml/master_css.h +++ b/include/litehtml/master_css.h @@ -224,6 +224,19 @@ table[border|=0] td, table[border|=0] th { border-style:none; } +table[align=left] { + float: left; +} + +table[align=right] { + float: right; +} + +table[align=center] { + margin-left: auto; + margin-right: auto; +} + caption { display: table-caption; } diff --git a/src/el_table.cpp b/src/el_table.cpp index d0c711c4d..0bb864843 100644 --- a/src/el_table.cpp +++ b/src/el_table.cpp @@ -30,23 +30,6 @@ void litehtml::el_table::parse_attributes() m_style.add_property(_width_, str); } - str = get_attr("align"); - if(str) - { - int align = value_index(str, "left;center;right"); - switch(align) - { - case 1: - m_style.add_property(_margin_left_, "auto"); - m_style.add_property(_margin_right_, "auto"); - break; - case 2: - m_style.add_property(_margin_left_, "auto"); - m_style.add_property(_margin_right_, "0"); - break; - } - } - str = get_attr("cellspacing"); if(str) { From 0c700d240958707ef47a4904969ea514771ff823 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Wed, 7 Jun 2023 15:45:37 +0300 Subject: [PATCH 05/73] optimization: elements_vector replaced with elements_list Also added element::children() method. Closes issue #27 --- include/litehtml/document.h | 2 +- include/litehtml/el_style.h | 2 +- include/litehtml/element.h | 16 ++++++++++------ include/litehtml/html_tag.h | 12 +++++------- include/litehtml/types.h | 3 ++- src/document.cpp | 8 ++++---- src/element.cpp | 8 +++----- src/html_tag.cpp | 19 ++++--------------- src/render_block.cpp | 3 +-- 9 files changed, 31 insertions(+), 42 deletions(-) diff --git a/include/litehtml/document.h b/include/litehtml/document.h index a4a080204..e2623b222 100644 --- a/include/litehtml/document.h +++ b/include/litehtml/document.h @@ -110,7 +110,7 @@ namespace litehtml private: uint_ptr add_font(const char* name, int size, const char* weight, const char* style, const char* decoration, font_metrics* fm); - void create_node(void* gnode, elements_vector& elements, bool parseTextNode); + void create_node(void* gnode, elements_list& elements, bool parseTextNode); bool update_media_lists(const media_features& features); void fix_tables_layout(); void fix_table_children(const std::shared_ptr& el_ptr, style_display disp, const char* disp_str); diff --git a/include/litehtml/el_style.h b/include/litehtml/el_style.h index b6258932d..62f154625 100644 --- a/include/litehtml/el_style.h +++ b/include/litehtml/el_style.h @@ -7,7 +7,7 @@ namespace litehtml { class el_style : public element { - elements_vector m_children; + elements_list m_children; public: explicit el_style(const std::shared_ptr& doc); diff --git a/include/litehtml/element.h b/include/litehtml/element.h index fd543da77..e330b5c01 100644 --- a/include/litehtml/element.h +++ b/include/litehtml/element.h @@ -28,12 +28,12 @@ namespace litehtml protected: std::weak_ptr m_parent; std::weak_ptr m_doc; - elements_vector m_children; + elements_list m_children; css_properties m_css; std::list> m_renders; used_selector::vector m_used_styles; - virtual void select_all(const css_selector& selector, elements_vector& res); + virtual void select_all(const css_selector& selector, elements_list& res); element::ptr _add_before_after(int type, const style& style); public: explicit element(const std::shared_ptr& doc); @@ -58,9 +58,10 @@ namespace litehtml bool is_table_skip() const; std::shared_ptr get_document() const; + const std::list>& children() const; - virtual elements_vector select_all(const string& selector); - virtual elements_vector select_all(const css_selector& selector); + virtual elements_list select_all(const string& selector); + virtual elements_list select_all(const css_selector& selector); virtual element::ptr select_one(const string& selector); virtual element::ptr select_one(const css_selector& selector); @@ -74,8 +75,6 @@ namespace litehtml virtual const char* get_tagName() const; virtual void set_tagName(const char* tag); virtual void set_data(const char* data); - virtual size_t get_children_count() const; - virtual element::ptr get_child(int idx) const; virtual void set_attr(const char* name, const char* val); virtual const char* get_attr(const char* name, const char* def = nullptr) const; @@ -210,6 +209,11 @@ namespace litehtml } return false; } + + inline const std::list>& element::children() const + { + return m_children; + } } #endif // LH_ELEMENT_H diff --git a/include/litehtml/html_tag.h b/include/litehtml/html_tag.h index 3c28effb4..9148031b2 100644 --- a/include/litehtml/html_tag.h +++ b/include/litehtml/html_tag.h @@ -31,7 +31,7 @@ namespace litehtml string_map m_attrs; std::vector m_pseudo_classes; - void select_all(const css_selector& selector, elements_vector& res) override; + void select_all(const css_selector& selector, elements_list& res) override; public: explicit html_tag(const std::shared_ptr& doc); @@ -46,8 +46,6 @@ namespace litehtml const char* get_tagName() const override; void set_tagName(const char* tag) override; void set_data(const char* data) override; - size_t get_children_count() const override; - element::ptr get_child(int idx) const override; void set_attr(const char* name, const char* val) override; const char* get_attr(const char* name, const char* def = nullptr) const override; @@ -84,7 +82,7 @@ namespace litehtml size_vector get_size_vector_property (string_id name, bool inherited, const size_vector& default_value, uint_ptr css_properties_member_offset) const override; string get_custom_property(string_id name, const string& default_value) const override; - elements_vector& children(); + elements_list& children(); int select(const string& selector) override; int select(const css_selector& selector, bool apply_pseudo = true) override; @@ -92,8 +90,8 @@ namespace litehtml int select_pseudoclass(const css_attribute_selector& sel); int select_attribute(const css_attribute_selector& sel); - elements_vector select_all(const string& selector) override; - elements_vector select_all(const css_selector& selector) override; + elements_list select_all(const string& selector) override; + elements_list select_all(const css_selector& selector) override; element::ptr select_one(const string& selector) override; element::ptr select_one(const css_selector& selector) override; @@ -127,7 +125,7 @@ namespace litehtml /* Inline Functions */ /************************************************************************/ - inline elements_vector& litehtml::html_tag::children() + inline elements_list& litehtml::html_tag::children() { return m_children; } diff --git a/include/litehtml/types.h b/include/litehtml/types.h index 4713df104..20cb3d471 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -5,6 +5,7 @@ #include #include #include +#include namespace litehtml { @@ -12,7 +13,7 @@ namespace litehtml class element; typedef std::map string_map; - typedef std::vector< std::shared_ptr > elements_vector; + typedef std::list< std::shared_ptr > elements_list; typedef std::vector int_vector; typedef std::vector string_vector; diff --git a/src/document.cpp b/src/document.cpp index 293455dd4..4ba36b4ea 100644 --- a/src/document.cpp +++ b/src/document.cpp @@ -54,7 +54,7 @@ litehtml::document::ptr litehtml::document::createFromString( const char* str, d document::ptr doc = std::make_shared(objPainter); // Create litehtml::elements. - elements_vector root_elements; + elements_list root_elements; doc->create_node(output->root, root_elements, true); if (!root_elements.empty()) { @@ -718,7 +718,7 @@ void litehtml::document::add_media_list( const media_query_list::ptr& list ) } } -void litehtml::document::create_node(void* gnode, elements_vector& elements, bool parseTextNode) +void litehtml::document::create_node(void* gnode, elements_list& elements, bool parseTextNode) { auto* node = (GumboNode*)gnode; switch (node->type) @@ -756,7 +756,7 @@ void litehtml::document::create_node(void* gnode, elements_vector& elements, boo } if (ret) { - elements_vector child; + elements_list child; for (unsigned int i = 0; i < node->v.element.children.length; i++) { child.clear(); @@ -1018,7 +1018,7 @@ void litehtml::document::append_children_from_string(element& parent, const char GumboOutput* output = gumbo_parse(str); // Create litehtml::elements. - elements_vector child_elements; + elements_list child_elements; create_node(output->root, child_elements, true); // Destroy GumboOutput diff --git a/src/element.cpp b/src/element.cpp index 7b4c7c3ff..ccb6b97e2 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -291,9 +291,9 @@ bool element::is_block_formatting_context() const const background* element::get_background(bool own_only) LITEHTML_RETURN_FUNC(nullptr) void element::add_style( const style& style) LITEHTML_EMPTY_FUNC -void element::select_all(const css_selector& selector, elements_vector& res) LITEHTML_EMPTY_FUNC -elements_vector element::select_all(const css_selector& selector) LITEHTML_RETURN_FUNC(elements_vector()) -elements_vector element::select_all(const string& selector) LITEHTML_RETURN_FUNC(elements_vector()) +void element::select_all(const css_selector& selector, elements_list& res) LITEHTML_EMPTY_FUNC +elements_list element::select_all(const css_selector& selector) LITEHTML_RETURN_FUNC(elements_list()) +elements_list element::select_all(const string& selector) LITEHTML_RETURN_FUNC(elements_list()) element::ptr element::select_one( const css_selector& selector ) LITEHTML_RETURN_FUNC(nullptr) element::ptr element::select_one( const string& selector ) LITEHTML_RETURN_FUNC(nullptr) element::ptr element::find_adjacent_sibling(const element::ptr& el, const css_selector& selector, bool apply_pseudo /*= true*/, bool* is_pseudo /*= 0*/) LITEHTML_RETURN_FUNC(nullptr) @@ -301,8 +301,6 @@ element::ptr element::find_sibling(const element::ptr& el, const css_selector& s bool element::is_nth_last_child(const element::ptr& el, int num, int off, bool of_type) const LITEHTML_RETURN_FUNC(false) bool element::is_nth_child(const element::ptr&, int num, int off, bool of_type) const LITEHTML_RETURN_FUNC(false) bool element::is_only_child(const element::ptr& el, bool of_type) const LITEHTML_RETURN_FUNC(false) -element::ptr element::get_child( int idx ) const LITEHTML_RETURN_FUNC(nullptr) -size_t element::get_children_count() const LITEHTML_RETURN_FUNC(0) void element::get_content_size( size& sz, int max_width ) LITEHTML_EMPTY_FUNC bool element::appendChild(const ptr &el) LITEHTML_RETURN_FUNC(false) bool element::removeChild(const ptr &el) LITEHTML_RETURN_FUNC(false) diff --git a/src/html_tag.cpp b/src/html_tag.cpp index b02215787..7fc3d0331 100644 --- a/src/html_tag.cpp +++ b/src/html_tag.cpp @@ -121,7 +121,7 @@ const char* litehtml::html_tag::get_attr( const char* name, const char* def ) co return def; } -litehtml::elements_vector litehtml::html_tag::select_all( const string& selector ) +litehtml::elements_list litehtml::html_tag::select_all(const string& selector ) { css_selector sel; sel.parse(selector); @@ -129,14 +129,14 @@ litehtml::elements_vector litehtml::html_tag::select_all( const string& selector return select_all(sel); } -litehtml::elements_vector litehtml::html_tag::select_all( const css_selector& selector ) +litehtml::elements_list litehtml::html_tag::select_all(const css_selector& selector ) { - litehtml::elements_vector res; + litehtml::elements_list res; select_all(selector, res); return res; } -void litehtml::html_tag::select_all(const css_selector& selector, elements_vector& res) +void litehtml::html_tag::select_all(const css_selector& selector, elements_list& res) { if(select(selector)) { @@ -1063,17 +1063,6 @@ bool litehtml::html_tag::is_replaced() const return false; } -size_t litehtml::html_tag::get_children_count() const -{ - return m_children.size(); -} - -litehtml::element::ptr litehtml::html_tag::get_child( int idx ) const -{ - return m_children[idx]; -} - - void litehtml::html_tag::init_background_paint(position pos, std::vector& bg_paint, const background* bg, const std::shared_ptr& ri) { bg_paint = { background_paint() }; diff --git a/src/render_block.cpp b/src/render_block.cpp index 3c5dbdb83..a9568d11e 100644 --- a/src/render_block.cpp +++ b/src/render_block.cpp @@ -67,9 +67,8 @@ std::shared_ptr litehtml::render_item_block::init() if (auto p = src_el()->parent()) { int val = atoi(p->get_attr("start", "1")); - for (int i = 0; i < (int)p->get_children_count(); i++) + for(const auto &child : p->children()) { - auto child = p->get_child(i); if (child == src_el()) { src_el()->set_attr("list_index", std::to_string(val).c_str()); From b212cf42bb15573876be4f00d61f2a5265cebd06 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Wed, 7 Jun 2023 18:29:24 +0300 Subject: [PATCH 06/73] el_before_after_base::add_text add spaces as el_space --- src/el_before_after.cpp | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/el_before_after.cpp b/src/el_before_after.cpp index 4455642e8..fa45582d3 100644 --- a/src/el_before_after.cpp +++ b/src/el_before_after.cpp @@ -109,7 +109,7 @@ void litehtml::el_before_after_base::add_text( const string& txt ) word.clear(); } word += chr; - element::ptr el = std::make_shared(word.c_str(), get_document()); + element::ptr el = std::make_shared(word.c_str(), get_document()); appendChild(el); word.clear(); } else From 14b31106c3bd198ebf60e372a929b07d3cadbbfe Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Thu, 8 Jun 2023 04:28:18 +0300 Subject: [PATCH 07/73] fixed rendering of ::before and ::after elements * now ::before and ::after elements are created if content is not defined * styles ::before and ::after without other selectors are applied to the already created before/after elements --- include/litehtml/el_before_after.h | 1 - src/el_before_after.cpp | 5 ---- src/element.cpp | 24 +++++++-------- src/html_tag.cpp | 32 +++++++++++++++++--- test/render/test37.htm | 46 +++++++++++++++++++++++++++++ test/render/test37.htm.png | Bin 0 -> 792 bytes 6 files changed, 84 insertions(+), 24 deletions(-) create mode 100644 test/render/test37.htm create mode 100644 test/render/test37.htm.png diff --git a/include/litehtml/el_before_after.h b/include/litehtml/el_before_after.h index ac966f395..eed5f3dad 100644 --- a/include/litehtml/el_before_after.h +++ b/include/litehtml/el_before_after.h @@ -11,7 +11,6 @@ namespace litehtml el_before_after_base(const std::shared_ptr& doc, bool before); void add_style(const style& style) override; - void apply_stylesheet(const litehtml::css& stylesheet) override; private: void add_text(const string& txt); void add_function(const string& fnc, const string& params); diff --git a/src/el_before_after.cpp b/src/el_before_after.cpp index fa45582d3..8c24eec98 100644 --- a/src/el_before_after.cpp +++ b/src/el_before_after.cpp @@ -197,8 +197,3 @@ litehtml::string litehtml::el_before_after_base::convert_escape( const char* txt u_str[1] = 0; return litehtml::string(litehtml_from_wchar(u_str)); } - -void litehtml::el_before_after_base::apply_stylesheet( const litehtml::css& stylesheet ) -{ - -} diff --git a/src/element.cpp b/src/element.cpp index ccb6b97e2..234e95975 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -255,22 +255,18 @@ bool element::find_styles_changes( position::vector& redraw_boxes) element::ptr element::_add_before_after(int type, const style& style) { - if(style.get_property(_content_).m_type != prop_type_invalid) + element::ptr el; + if(type == 0) { - element::ptr el; - if(type == 0) - { - el = std::make_shared(get_document()); - m_children.insert(m_children.begin(), el); - } else - { - el = std::make_shared(get_document()); - m_children.insert(m_children.end(), el); - } - el->parent(shared_from_this()); - return el; + el = std::make_shared(get_document()); + m_children.insert(m_children.begin(), el); + } else + { + el = std::make_shared(get_document()); + m_children.insert(m_children.end(), el); } - return nullptr; + el->parent(shared_from_this()); + return el; } bool element::is_block_formatting_context() const diff --git a/src/html_tag.cpp b/src/html_tag.cpp index 7fc3d0331..a4bd20bac 100644 --- a/src/html_tag.cpp +++ b/src/html_tag.cpp @@ -209,17 +209,25 @@ void litehtml::html_tag::apply_stylesheet( const litehtml::css& stylesheet ) { if(apply & select_match_with_after) { - element::ptr el = get_element_after(*sel->m_style, true); + element::ptr el = get_element_after(*sel->m_style, sel->m_right.m_attrs.size() > 1); if(el) { el->add_style(*sel->m_style); + } else + { + add_style(*sel->m_style); + us->m_used = true; } } else if(apply & select_match_with_before) { - element::ptr el = get_element_before(*sel->m_style, true); + element::ptr el = get_element_before(*sel->m_style, sel->m_right.m_attrs.size() > 1); if(el) { el->add_style(*sel->m_style); + } else + { + add_style(*sel->m_style); + us->m_used = true; } } else @@ -230,17 +238,25 @@ void litehtml::html_tag::apply_stylesheet( const litehtml::css& stylesheet ) } } else if(apply & select_match_with_after) { - element::ptr el = get_element_after(*sel->m_style, true); + element::ptr el = get_element_after(*sel->m_style, sel->m_right.m_attrs.size() > 1); if(el) { el->add_style(*sel->m_style); + } else + { + add_style(*sel->m_style); + us->m_used = true; } } else if(apply & select_match_with_before) { - element::ptr el = get_element_before(*sel->m_style, true); + element::ptr el = get_element_before(*sel->m_style, sel->m_right.m_attrs.size() > 1); if(el) { el->add_style(*sel->m_style); + } else + { + add_style(*sel->m_style); + us->m_used = true; } } else { @@ -537,9 +553,17 @@ int litehtml::html_tag::select(const css_element_selector& selector, bool apply_ case select_pseudo_element: if(attr.name == _after_) { + if(selector.m_attrs.size() == 1 && m_tag != __tag_after_) + { + return select_no_match; + } res |= select_match_with_after; } else if(attr.name == _before_) { + if(selector.m_attrs.size() == 1 && m_tag != __tag_before_) + { + return select_no_match; + } res |= select_match_with_before; } else { diff --git a/test/render/test37.htm b/test/render/test37.htm new file mode 100644 index 000000000..a6f722111 --- /dev/null +++ b/test/render/test37.htm @@ -0,0 +1,46 @@ + + +
+
a
+
s
+
+
+
d
+
f
+
diff --git a/test/render/test37.htm.png b/test/render/test37.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..75b2b7c4dd5fc1533fdaf07ee655bdd137a61c69 GIT binary patch literal 792 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKzpyX^$%&Hj|A7>LfKQ0)|NkK7<;$1}E9l{OS`xVXjP1g}OBYZ$BHm3rTe!VV8K1NdUFR?0R{g{JVwV16`mVT>)yk3 z;%AD}H+D#vGj^Ib#vEhVv{y1^>oM6BOLkz0g93}?#5-dAH;?a0d38w+lLH5$b*UM70n;~wr>mdKI;Vst0JmrsxBvhE literal 0 HcmV?d00001 From 29c0df7e678969569f15f2eb9efc00416a2fc03a Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Thu, 8 Jun 2023 19:30:00 +0300 Subject: [PATCH 08/73] added "content: none" support for ::before/::after elements --- src/html_tag.cpp | 75 +++++++++++++++++++------------------ test/render/test38.htm | 33 ++++++++++++++++ test/render/test38.htm.png | Bin 0 -> 254 bytes 3 files changed, 71 insertions(+), 37 deletions(-) create mode 100644 test/render/test38.htm create mode 100644 test/render/test38.htm.png diff --git a/src/html_tag.cpp b/src/html_tag.cpp index a4bd20bac..1015a4ee0 100644 --- a/src/html_tag.cpp +++ b/src/html_tag.cpp @@ -203,61 +203,62 @@ void litehtml::html_tag::apply_stylesheet( const litehtml::css& stylesheet ) if(sel->is_media_valid()) { - if(apply & select_match_pseudo_class) - { - if(select(*sel, true)) + auto apply_before_after = [&]() { + const auto& content_property = sel->m_style->get_property(_content_); + bool content_none = content_property.m_type == prop_type_string && content_property.m_string == "none"; + bool create = !content_none && (sel->m_right.m_attrs.size() > 1 || sel->m_right.m_tag != star_id); + + element::ptr el; if(apply & select_match_with_after) { - element::ptr el = get_element_after(*sel->m_style, sel->m_right.m_attrs.size() > 1); - if(el) + el = get_element_after(*sel->m_style, create); + } else if(apply & select_match_with_before) + { + el = get_element_before(*sel->m_style, create); + } else + { + return; + } + if(el) + { + if(!content_none) { el->add_style(*sel->m_style); } else { - add_style(*sel->m_style); - us->m_used = true; + el->parent()->removeChild(el); } - } else if(apply & select_match_with_before) + } else { - element::ptr el = get_element_before(*sel->m_style, sel->m_right.m_attrs.size() > 1); - if(el) + if(!content_none) { - el->add_style(*sel->m_style); + add_style(*sel->m_style); } else { - add_style(*sel->m_style); - us->m_used = true; + parent()->removeChild(shared_from_this()); } } - else + us->m_used = true; + }; + + + if(apply & select_match_pseudo_class) + { + if(select(*sel, true)) + { + if((apply & (select_match_with_after | select_match_with_before))) + { + apply_before_after(); + } else { add_style(*sel->m_style); us->m_used = true; } } - } else if(apply & select_match_with_after) + } else if((apply & (select_match_with_after | select_match_with_before))) { - element::ptr el = get_element_after(*sel->m_style, sel->m_right.m_attrs.size() > 1); - if(el) - { - el->add_style(*sel->m_style); - } else - { - add_style(*sel->m_style); - us->m_used = true; - } - } else if(apply & select_match_with_before) - { - element::ptr el = get_element_before(*sel->m_style, sel->m_right.m_attrs.size() > 1); - if(el) - { - el->add_style(*sel->m_style); - } else - { - add_style(*sel->m_style); - us->m_used = true; - } + apply_before_after(); } else { add_style(*sel->m_style); @@ -553,14 +554,14 @@ int litehtml::html_tag::select(const css_element_selector& selector, bool apply_ case select_pseudo_element: if(attr.name == _after_) { - if(selector.m_attrs.size() == 1 && m_tag != __tag_after_) + if(selector.m_attrs.size() == 1 && selector.m_tag == star_id && m_tag != __tag_after_) { return select_no_match; } res |= select_match_with_after; } else if(attr.name == _before_) { - if(selector.m_attrs.size() == 1 && m_tag != __tag_before_) + if(selector.m_attrs.size() == 1 && selector.m_tag == star_id && m_tag != __tag_before_) { return select_no_match; } diff --git a/test/render/test38.htm b/test/render/test38.htm new file mode 100644 index 000000000..a2eb9c325 --- /dev/null +++ b/test/render/test38.htm @@ -0,0 +1,33 @@ + + +
    +
  • item1
    • +
  • item2
    • +
  • item3
    • +
\ No newline at end of file diff --git a/test/render/test38.htm.png b/test/render/test38.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0abfc11b5f11b3aa8544d6894aa62bc7e629f36e GIT binary patch literal 254 zcmeAS@N?(olHy`uVBq!ia0vp^yMS1Ui5W;v4b}DmQk(%kA+G=b{|7QByqmCjLrgc2 zwZYTHF{Fa=?PNo~Lk2vqa}QcO7jgOpvVG$@cPR6g^8sFo7n%n Date: Tue, 13 Jun 2023 00:36:18 +0300 Subject: [PATCH 09/73] refactor render_item based classes All render_item based classes are moved into the own headers --- CMakeLists.txt | 8 +- include/litehtml/render_block.h | 40 ++++ include/litehtml/render_block_context.h | 29 +++ include/litehtml/render_flex.h | 46 +++++ include/litehtml/render_image.h | 25 +++ include/litehtml/render_inline.h | 30 +++ include/litehtml/render_inline_context.h | 55 ++++++ include/litehtml/render_item.h | 222 +---------------------- include/litehtml/render_table.h | 56 ++++++ src/document.cpp | 2 + src/el_image.cpp | 2 +- src/element.cpp | 3 + src/render_block.cpp | 4 +- src/render_block_context.cpp | 2 +- src/render_flex.cpp | 2 +- src/render_image.cpp | 2 +- src/render_inline.cpp | 3 - src/render_inline_context.cpp | 2 +- src/render_item.cpp | 18 -- src/render_table.cpp | 20 +- 20 files changed, 321 insertions(+), 250 deletions(-) create mode 100644 include/litehtml/render_block.h create mode 100644 include/litehtml/render_block_context.h create mode 100644 include/litehtml/render_flex.h create mode 100644 include/litehtml/render_image.h create mode 100644 include/litehtml/render_inline.h create mode 100644 include/litehtml/render_inline_context.h create mode 100644 include/litehtml/render_table.h delete mode 100644 src/render_inline.cpp diff --git a/CMakeLists.txt b/CMakeLists.txt index 014089023..58a598881 100644 --- a/CMakeLists.txt +++ b/CMakeLists.txt @@ -65,7 +65,6 @@ set(SOURCE_LITEHTML src/render_block_context.cpp src/render_block.cpp src/render_inline_context.cpp - src/render_inline.cpp src/render_table.cpp src/render_flex.cpp src/render_image.cpp @@ -123,6 +122,13 @@ set(HEADER_LITEHTML include/litehtml/css_properties.h include/litehtml/line_box.h include/litehtml/render_item.h + include/litehtml/render_flex.h + include/litehtml/render_image.h + include/litehtml/render_inline.h + include/litehtml/render_table.h + include/litehtml/render_inline_context.h + include/litehtml/render_block_context.h + include/litehtml/render_block.h include/litehtml/master_css.h include/litehtml/string_id.h include/litehtml/formatting_context.h diff --git a/include/litehtml/render_block.h b/include/litehtml/render_block.h new file mode 100644 index 000000000..eb058c618 --- /dev/null +++ b/include/litehtml/render_block.h @@ -0,0 +1,40 @@ +#ifndef LITEHTML_RENDER_BLOCK_H +#define LITEHTML_RENDER_BLOCK_H + +#include "render_item.h" + +namespace litehtml +{ + class render_item_block : public render_item + { + protected: + /** + * Render block content. + * + * @param x - horizontal position of the content + * @param y - vertical position of the content + * @param second_pass - true is this is the second pass. + * @param ret_width - input minimal width. + * @param self_size - defines calculated size of block + * @return return value is the minimal width of the content in block. Must be greater or equal to ret_width parameter + */ + virtual int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) {return 0;} + int _render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) override; + int place_float(const std::shared_ptr &el, int top, const containing_block_context &self_size, formatting_context* fmt_ctx); + virtual void fix_line_width(element_float flt, + const containing_block_context &containing_block_size, formatting_context* fmt_ctx) + {} + + public: + explicit render_item_block(std::shared_ptr src_el) : render_item(std::move(src_el)) + {} + + std::shared_ptr clone() override + { + return std::make_shared(src_el()); + } + std::shared_ptr init() override; + }; +} + +#endif //LITEHTML_RENDER_BLOCK_H diff --git a/include/litehtml/render_block_context.h b/include/litehtml/render_block_context.h new file mode 100644 index 000000000..3b5192261 --- /dev/null +++ b/include/litehtml/render_block_context.h @@ -0,0 +1,29 @@ +#ifndef LITEHTML_RENDER_BLOCK_CONTEXT_H +#define LITEHTML_RENDER_BLOCK_CONTEXT_H + +#include "render_block.h" + +namespace litehtml +{ + /** + * In a block formatting context, boxes are laid out one after the other, vertically, beginning at the top of a + * containing block. + * https://www.w3.org/TR/CSS22/visuren.html#block-formatting + */ + class render_item_block_context : public render_item_block + { + protected: + int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; + + public: + explicit render_item_block_context(std::shared_ptr src_el) : render_item_block(std::move(src_el)) + {} + + std::shared_ptr clone() override + { + return std::make_shared(src_el()); + } + }; +} + +#endif //LITEHTML_RENDER_BLOCK_CONTEXT_H diff --git a/include/litehtml/render_flex.h b/include/litehtml/render_flex.h new file mode 100644 index 000000000..5d31bc9bf --- /dev/null +++ b/include/litehtml/render_flex.h @@ -0,0 +1,46 @@ +#ifndef LITEHTML_RENDER_FLEX_H +#define LITEHTML_RENDER_FLEX_H + +#include "render_block.h" + +namespace litehtml +{ + class render_item_flex : public render_item_block + { + struct flex_item + { + std::shared_ptr el; + int base_size; + int main_size; + int min_width; + int max_width; + int line; + + explicit flex_item(std::shared_ptr _el) : + el(std::move(_el)), + min_width(0), + max_width(0), + line(0), + base_size(0), + main_size(0) + {} + }; + protected: + std::list> m_flex_items; + + int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; + + public: + explicit render_item_flex(std::shared_ptr src_el) : render_item_block(std::move(src_el)) + {} + + std::shared_ptr clone() override + { + return std::make_shared(src_el()); + } + void draw_children(uint_ptr hdc, int x, int y, const position* clip, draw_flag flag, int zindex) override; + std::shared_ptr init() override; + }; +} + +#endif //LITEHTML_RENDER_FLEX_H diff --git a/include/litehtml/render_image.h b/include/litehtml/render_image.h new file mode 100644 index 000000000..e85f487ca --- /dev/null +++ b/include/litehtml/render_image.h @@ -0,0 +1,25 @@ +#ifndef LITEHTML_RENDER_IMAGE_H +#define LITEHTML_RENDER_IMAGE_H + +#include "render_item.h" + +namespace litehtml +{ + class render_item_image : public render_item + { + protected: + int calc_max_height(int image_height, int containing_block_height); + int _render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) override; + + public: + explicit render_item_image(std::shared_ptr src_el) : render_item(std::move(src_el)) + {} + + std::shared_ptr clone() override + { + return std::make_shared(src_el()); + } + }; +} + +#endif //LITEHTML_RENDER_IMAGE_H diff --git a/include/litehtml/render_inline.h b/include/litehtml/render_inline.h new file mode 100644 index 000000000..476011563 --- /dev/null +++ b/include/litehtml/render_inline.h @@ -0,0 +1,30 @@ +#ifndef LITEHTML_RENDER_INLINE_H +#define LITEHTML_RENDER_INLINE_H + +#include "render_item.h" + +namespace litehtml +{ + class render_item_inline : public render_item + { + protected: + position::vector m_boxes; + + public: + explicit render_item_inline(std::shared_ptr src_el) : render_item(std::move(src_el)) + {} + + void get_inline_boxes( position::vector& boxes ) const override { boxes = m_boxes; } + void set_inline_boxes( position::vector& boxes ) override { m_boxes = boxes; } + void add_inline_box( const position& box ) override { m_boxes.emplace_back(box); }; + void clear_inline_boxes() override { m_boxes.clear(); } + int get_base_line() override { return src_el()->css().get_font_metrics().base_line(); } + + std::shared_ptr clone() override + { + return std::make_shared(src_el()); + } + }; +} + +#endif //LITEHTML_RENDER_INLINE_H diff --git a/include/litehtml/render_inline_context.h b/include/litehtml/render_inline_context.h new file mode 100644 index 000000000..894cfe989 --- /dev/null +++ b/include/litehtml/render_inline_context.h @@ -0,0 +1,55 @@ +#ifndef LITEHTML_RENDER_INLINE_CONTEXT_H +#define LITEHTML_RENDER_INLINE_CONTEXT_H + +#include "render_block.h" + +namespace litehtml +{ + /** + * An inline formatting context is established by a block container box that contains no block-level boxes. + * https://www.w3.org/TR/CSS22/visuren.html#inline-formatting + */ + class render_item_inline_context : public render_item_block + { + /** + * Structure contains elements with display: inline + * members: + * - element: render_item with display: inline + * - boxes: rectangles represented inline element content. There are can be many boxes if content + * is split into some lines + * - start_box: the start position of currently calculated box + */ + struct inlines_item + { + std::shared_ptr element; + position::vector boxes; + position start_box; + + explicit inlines_item(const std::shared_ptr& el) : element(el) {} + }; + protected: + std::vector > m_line_boxes; + int m_max_line_width; + + int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; + void fix_line_width(element_float flt, + const containing_block_context &self_size, formatting_context* fmt_ctx) override; + + std::list > finish_last_box(bool end_of_render, const containing_block_context &self_size); + void place_inline(std::unique_ptr item, const containing_block_context &self_size, formatting_context* fmt_ctx); + int new_box(const std::unique_ptr& el, line_context& line_ctx, const containing_block_context &self_size, formatting_context* fmt_ctx); + void apply_vertical_align() override; + public: + explicit render_item_inline_context(std::shared_ptr src_el) : render_item_block(std::move(src_el)), m_max_line_width(0) + {} + + std::shared_ptr clone() override + { + return std::make_shared(src_el()); + } + + int get_base_line() override; + }; +} + +#endif //LITEHTML_RENDER_INLINE_CONTEXT_H diff --git a/include/litehtml/render_item.h b/include/litehtml/render_item.h index db2cf1255..9d4561e5a 100644 --- a/include/litehtml/render_item.h +++ b/include/litehtml/render_item.h @@ -273,8 +273,6 @@ namespace litehtml ri->parent(shared_from_this()); } - int render(int x, int y, const containing_block_context& containing_block_size, formatting_context* fmt_ctx, bool second_pass = false); - bool is_root() const { return m_parent.expired(); @@ -305,6 +303,7 @@ namespace litehtml return !(m_skip || src_el()->css().get_display() == display_none || src_el()->css().get_visibility() != visibility_visible); } + int render(int x, int y, const containing_block_context& containing_block_size, formatting_context* fmt_ctx, bool second_pass = false); int calc_width(int defVal, int containing_block_width) const; bool get_predefined_height(int& p_height, int containing_block_height) const; void apply_relative_shift(const containing_block_context &containing_block_size); @@ -348,225 +347,6 @@ namespace litehtml */ void get_rendering_boxes( position::vector& redraw_boxes); }; - - class render_item_block : public render_item - { - protected: - /** - * Render block content. - * - * @param x - horizontal position of the content - * @param y - vertical position of the content - * @param second_pass - true is this is the second pass. - * @param ret_width - input minimal width. - * @param self_size - defines calculated size of block - * @return return value is the minimal width of the content in block. Must be greater or equal to ret_width parameter - */ - virtual int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) {return 0;} - int _render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) override; - int place_float(const std::shared_ptr &el, int top, const containing_block_context &self_size, formatting_context* fmt_ctx); - virtual void fix_line_width(element_float flt, - const containing_block_context &containing_block_size, formatting_context* fmt_ctx) - {} - - public: - explicit render_item_block(std::shared_ptr src_el) : render_item(std::move(src_el)) - {} - - std::shared_ptr clone() override - { - return std::make_shared(src_el()); - } - std::shared_ptr init() override; - }; - - /** - * In a block formatting context, boxes are laid out one after the other, vertically, beginning at the top of a - * containing block. - * https://www.w3.org/TR/CSS22/visuren.html#block-formatting - */ - class render_item_block_context : public render_item_block - { - protected: - int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; - - public: - explicit render_item_block_context(std::shared_ptr src_el) : render_item_block(std::move(src_el)) - {} - - std::shared_ptr clone() override - { - return std::make_shared(src_el()); - } - }; - - /** - * An inline formatting context is established by a block container box that contains no block-level boxes. - * https://www.w3.org/TR/CSS22/visuren.html#inline-formatting - */ - class render_item_inline_context : public render_item_block - { - /** - * Structure contains elements with display: inline - * members: - * - element: render_item with display: inline - * - boxes: rectangles represented inline element content. There are can be many boxes if content - * is split into some lines - * - start_box: the start position of currently calculated box - */ - struct inlines_item - { - std::shared_ptr element; - position::vector boxes; - position start_box; - - explicit inlines_item(const std::shared_ptr& el) : element(el) {} - }; - protected: - std::vector > m_line_boxes; - int m_max_line_width; - - int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; - void fix_line_width(element_float flt, - const containing_block_context &self_size, formatting_context* fmt_ctx) override; - - std::list > finish_last_box(bool end_of_render, const containing_block_context &self_size); - void place_inline(std::unique_ptr item, const containing_block_context &self_size, formatting_context* fmt_ctx); - int new_box(const std::unique_ptr& el, line_context& line_ctx, const containing_block_context &self_size, formatting_context* fmt_ctx); - void apply_vertical_align() override; - public: - explicit render_item_inline_context(std::shared_ptr src_el) : render_item_block(std::move(src_el)), m_max_line_width(0) - {} - - std::shared_ptr clone() override - { - return std::make_shared(src_el()); - } - - int get_base_line() override; - }; - - class render_item_table : public render_item - { - protected: - // data for table rendering - std::unique_ptr m_grid; - int m_border_spacing_x; - int m_border_spacing_y; - - int _render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) override; - - public: - explicit render_item_table(std::shared_ptr src_el); - - std::shared_ptr clone() override - { - return std::make_shared(src_el()); - } - void draw_children(uint_ptr hdc, int x, int y, const position* clip, draw_flag flag, int zindex) override; - int get_draw_vertical_offset() override; - std::shared_ptr init() override; - }; - - class render_item_table_part : public render_item - { - public: - explicit render_item_table_part(std::shared_ptr src_el) : render_item(std::move(src_el)) - {} - - std::shared_ptr clone() override - { - return std::make_shared(src_el()); - } - }; - - class render_item_table_row : public render_item - { - public: - explicit render_item_table_row(std::shared_ptr src_el) : render_item(std::move(src_el)) - {} - - std::shared_ptr clone() override - { - return std::make_shared(src_el()); - } - void get_inline_boxes( position::vector& boxes ) const override; - }; - - class render_item_inline : public render_item - { - protected: - position::vector m_boxes; - - public: - explicit render_item_inline(std::shared_ptr src_el) : render_item(std::move(src_el)) - {} - - void get_inline_boxes( position::vector& boxes ) const override { boxes = m_boxes; } - void set_inline_boxes( position::vector& boxes ) override { m_boxes = boxes; } - void add_inline_box( const position& box ) override { m_boxes.emplace_back(box); }; - void clear_inline_boxes() override { m_boxes.clear(); } - int get_base_line() override { return src_el()->css().get_font_metrics().base_line(); } - - std::shared_ptr clone() override - { - return std::make_shared(src_el()); - } - }; - - class render_item_image : public render_item - { - protected: - int calc_max_height(int image_height, int containing_block_height); - int _render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) override; - - public: - explicit render_item_image(std::shared_ptr src_el) : render_item(std::move(src_el)) - {} - - std::shared_ptr clone() override - { - return std::make_shared(src_el()); - } - }; - - class render_item_flex : public render_item_block - { - struct flex_item - { - std::shared_ptr el; - int base_size; - int main_size; - int min_width; - int max_width; - int line; - - explicit flex_item(std::shared_ptr _el) : - el(std::move(_el)), - min_width(0), - max_width(0), - line(0), - base_size(0), - main_size(0) - {} - }; - protected: - std::list> m_flex_items; - - int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; - - public: - explicit render_item_flex(std::shared_ptr src_el) : render_item_block(std::move(src_el)) - {} - - std::shared_ptr clone() override - { - return std::make_shared(src_el()); - } - void draw_children(uint_ptr hdc, int x, int y, const position* clip, draw_flag flag, int zindex) override; - std::shared_ptr init() override; - }; - } #endif //LH_RENDER_ITEM_H diff --git a/include/litehtml/render_table.h b/include/litehtml/render_table.h new file mode 100644 index 000000000..57fe435df --- /dev/null +++ b/include/litehtml/render_table.h @@ -0,0 +1,56 @@ +#ifndef LITEHTML_RENDER_TABLE_H +#define LITEHTML_RENDER_TABLE_H + +#include "render_item.h" + +namespace litehtml +{ + class render_item_table : public render_item + { + protected: + // data for table rendering + std::unique_ptr m_grid; + int m_border_spacing_x; + int m_border_spacing_y; + + int _render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) override; + + public: + explicit render_item_table(std::shared_ptr src_el); + + std::shared_ptr clone() override + { + return std::make_shared(src_el()); + } + void draw_children(uint_ptr hdc, int x, int y, const position* clip, draw_flag flag, int zindex) override; + int get_draw_vertical_offset() override; + std::shared_ptr init() override; + }; + + class render_item_table_part : public render_item + { + public: + explicit render_item_table_part(std::shared_ptr src_el) : render_item(std::move(src_el)) + {} + + std::shared_ptr clone() override + { + return std::make_shared(src_el()); + } + }; + + class render_item_table_row : public render_item + { + public: + explicit render_item_table_row(std::shared_ptr src_el) : render_item(std::move(src_el)) + {} + + std::shared_ptr clone() override + { + return std::make_shared(src_el()); + } + void get_inline_boxes( position::vector& boxes ) const override; + }; +} + +#endif //LITEHTML_RENDER_TABLE_H diff --git a/src/document.cpp b/src/document.cpp index 4ba36b4ea..ec336613d 100644 --- a/src/document.cpp +++ b/src/document.cpp @@ -27,6 +27,8 @@ #include "gumbo.h" #include "utf8_strings.h" #include "render_item.h" +#include "render_table.h" +#include "render_block.h" litehtml::document::document(document_container* objContainer) { diff --git a/src/el_image.cpp b/src/el_image.cpp index 34b8a7aef..9cf8146b4 100644 --- a/src/el_image.cpp +++ b/src/el_image.cpp @@ -1,6 +1,6 @@ #include "html.h" #include "el_image.h" -#include "render_item.h" +#include "render_image.h" litehtml::el_image::el_image(const document::ptr& doc) : html_tag(doc) { diff --git a/src/element.cpp b/src/element.cpp index 234e95975..1d0a509b1 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -2,6 +2,9 @@ #include "element.h" #include "document.h" #include "render_item.h" +#include "render_flex.h" +#include "render_inline.h" +#include "render_table.h" #include "el_before_after.h" namespace litehtml diff --git a/src/render_block.cpp b/src/render_block.cpp index a9568d11e..d653f3114 100644 --- a/src/render_block.cpp +++ b/src/render_block.cpp @@ -1,5 +1,7 @@ #include "html.h" -#include "render_item.h" +#include "render_block.h" +#include "render_inline_context.h" +#include "render_block_context.h" #include "document.h" int litehtml::render_item_block::place_float(const std::shared_ptr &el, int top, const containing_block_context &self_size, formatting_context* fmt_ctx) diff --git a/src/render_block_context.cpp b/src/render_block_context.cpp index 0d16ab58f..7591378c2 100644 --- a/src/render_block_context.cpp +++ b/src/render_block_context.cpp @@ -1,5 +1,5 @@ #include "html.h" -#include "render_item.h" +#include "render_block_context.h" #include "document.h" int litehtml::render_item_block_context::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 983f61812..2cab59e04 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -1,6 +1,6 @@ #include "html.h" -#include "render_item.h" #include "types.h" +#include "render_flex.h" int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) { diff --git a/src/render_image.cpp b/src/render_image.cpp index 37105278e..63e622d7b 100644 --- a/src/render_image.cpp +++ b/src/render_image.cpp @@ -1,5 +1,5 @@ #include "html.h" -#include "render_item.h" +#include "render_image.h" #include "document.h" int litehtml::render_item_image::_render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) diff --git a/src/render_inline.cpp b/src/render_inline.cpp deleted file mode 100644 index 0ea24b17d..000000000 --- a/src/render_inline.cpp +++ /dev/null @@ -1,3 +0,0 @@ -#include "html.h" -#include "render_item.h" - diff --git a/src/render_inline_context.cpp b/src/render_inline_context.cpp index 72cd1fe3d..2d8f2e173 100644 --- a/src/render_inline_context.cpp +++ b/src/render_inline_context.cpp @@ -1,5 +1,5 @@ #include "html.h" -#include "render_item.h" +#include "render_inline_context.h" #include "document.h" #include "iterators.h" diff --git a/src/render_item.cpp b/src/render_item.cpp index 808ffaf3f..4eb25757d 100644 --- a/src/render_item.cpp +++ b/src/render_item.cpp @@ -1086,21 +1086,3 @@ litehtml::containing_block_context litehtml::render_item::calculate_containing_b } return ret; } - -void litehtml::render_item_table_row::get_inline_boxes( position::vector& boxes ) const -{ - position pos; - for(auto& el : m_children) - { - if(el->src_el()->css().get_display() == display_table_cell) - { - pos.x = el->left() + el->margin_left(); - pos.y = el->top() - m_padding.top - m_borders.top; - - pos.width = el->right() - pos.x - el->margin_right() - el->margin_left(); - pos.height = el->height() + m_padding.top + m_padding.bottom + m_borders.top + m_borders.bottom; - - boxes.push_back(pos); - } - } -} diff --git a/src/render_table.cpp b/src/render_table.cpp index c6756304e..3720bfcd0 100644 --- a/src/render_table.cpp +++ b/src/render_table.cpp @@ -1,5 +1,5 @@ #include "html.h" -#include "render_item.h" +#include "render_table.h" #include "document.h" #include "iterators.h" @@ -462,3 +462,21 @@ int litehtml::render_item_table::get_draw_vertical_offset() } return 0; } + +void litehtml::render_item_table_row::get_inline_boxes( position::vector& boxes ) const +{ + position pos; + for(auto& el : m_children) + { + if(el->src_el()->css().get_display() == display_table_cell) + { + pos.x = el->left() + el->margin_left(); + pos.y = el->top() - m_padding.top - m_borders.top; + + pos.width = el->right() - pos.x - el->margin_right() - el->margin_left(); + pos.height = el->height() + m_padding.top + m_padding.bottom + m_borders.top + m_borders.bottom; + + boxes.push_back(pos); + } + } +} From 96769e7a29b769f1eba100878f1bb29d279fb23c Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Tue, 1 Aug 2023 16:22:52 +0300 Subject: [PATCH 10/73] Added tags figure and fugcaption into master css --- include/litehtml/master_css.h | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/include/litehtml/master_css.h b/include/litehtml/master_css.h index c8b7f3352..0e7b0ca4e 100644 --- a/include/litehtml/master_css.h +++ b/include/litehtml/master_css.h @@ -360,5 +360,17 @@ sup { font-size: smaller; } +figure { + display: block; + margin-top: 1em; + margin-bottom: 1em; + margin-left: 40px; + margin-right: 40px; +} + +figcaption { + display: block; +} + )##"; } #endif // LH_MASTER_CSS_H From afe910294169dadabd8e35bf2cbbf1c84f0a9464 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Tue, 1 Aug 2023 16:24:50 +0300 Subject: [PATCH 11/73] added single quotes support for atributes values in CSS selector --- src/css_selector.cpp | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/css_selector.cpp b/src/css_selector.cpp index 6ace9bb07..5843cb1a6 100644 --- a/src/css_selector.cpp +++ b/src/css_selector.cpp @@ -183,6 +183,11 @@ void litehtml::css_element_selector::parse( const string& txt ) string::size_type pos2 = txt.find_first_of('\"', pos + 1); attribute.val = txt.substr(pos + 1, pos2 == string::npos ? pos2 : (pos2 - pos - 1)); pos = pos2 == string::npos ? pos2 : (pos2 + 1); + } else if(txt[pos] == '\'') + { + string::size_type pos2 = txt.find_first_of('\'', pos + 1); + attribute.val = txt.substr(pos + 1, pos2 == string::npos ? pos2 : (pos2 - pos - 1)); + pos = pos2 == string::npos ? pos2 : (pos2 + 1); } else if(txt[pos] == ']') { pos ++; From d4409bc2326cf19f72394ea62ce058bc0c5ea7bf Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Tue, 1 Aug 2023 17:49:24 +0300 Subject: [PATCH 12/73] Added support for caption-side CSS property --- include/litehtml/css_properties.h | 15 ++++++++++++++ include/litehtml/string_id.h | 2 ++ include/litehtml/table.h | 18 +++++++++------- include/litehtml/types.h | 7 +++++++ src/css_properties.cpp | 1 + src/render_table.cpp | 34 ++++++++++++++++++++++--------- src/style.cpp | 4 ++++ 7 files changed, 64 insertions(+), 17 deletions(-) diff --git a/include/litehtml/css_properties.h b/include/litehtml/css_properties.h index 0eed09d9a..739e35fc2 100644 --- a/include/litehtml/css_properties.h +++ b/include/litehtml/css_properties.h @@ -70,6 +70,8 @@ namespace litehtml flex_align_self m_flex_align_self; flex_align_content m_flex_align_content; + caption_side m_caption_side; + private: void compute_font(const element* el, const std::shared_ptr& doc); void compute_background(const element* el, const std::shared_ptr& doc); @@ -238,6 +240,9 @@ namespace litehtml const css_length& get_border_spacing_y() const; void set_border_spacing_y(const css_length& mBorderSpacingY); + caption_side get_caption_side() const; + void set_caption_side(caption_side side); + float get_flex_grow() const; float get_flex_shrink() const; const css_length& get_flex_basis() const; @@ -638,6 +643,16 @@ namespace litehtml { return m_flex_align_content; } + + inline caption_side css_properties::get_caption_side() const + { + return m_caption_side; + } + inline void css_properties::set_caption_side(caption_side side) + { + m_caption_side = side; + } + } #endif //LITEHTML_CSS_PROPERTIES_H diff --git a/include/litehtml/string_id.h b/include/litehtml/string_id.h index 340ac7fbc..60d30f5e4 100644 --- a/include/litehtml/string_id.h +++ b/include/litehtml/string_id.h @@ -287,6 +287,8 @@ STRING_ID( _flex_grow_, _flex_shrink_, _flex_basis_, + + _caption_side_, ); #undef STRING_ID extern const string_id empty_id; // _id("") diff --git a/include/litehtml/table.h b/include/litehtml/table.h index edd5f055e..d738b63eb 100644 --- a/include/litehtml/table.h +++ b/include/litehtml/table.h @@ -204,14 +204,16 @@ namespace litehtml table_column::vector m_columns; table_row::vector m_rows; std::vector> m_captions; - int m_captions_height; + int m_top_captions_height; + int m_bottom_captions_height; public: - table_grid() + table_grid() : + m_rows_count(0), + m_cols_count(0), + m_top_captions_height(0), + m_bottom_captions_height(0) { - m_rows_count = 0; - m_cols_count = 0; - m_captions_height = 0; } void clear(); @@ -227,8 +229,10 @@ namespace litehtml int rows_count() const { return m_rows_count; } int cols_count() const { return m_cols_count; } - void captions_height(int height) { m_captions_height = height; } - int captions_height() const { return m_captions_height; } + void top_captions_height(int height) { m_top_captions_height = height; } + int top_captions_height() const { return m_top_captions_height; } + void bottom_captions_height(int height) { m_bottom_captions_height = height; } + int bottom_captions_height() const { return m_bottom_captions_height; } void distribute_max_width(int width, int start, int end); void distribute_min_width(int width, int start, int end); diff --git a/include/litehtml/types.h b/include/litehtml/types.h index 20cb3d471..b1feeeea6 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -905,6 +905,13 @@ namespace litehtml flex_basis_max_content, }; +#define caption_side_strings "top;bottom" + + enum caption_side + { + caption_side_top, + caption_side_bottom + }; } #endif // LH_TYPES_H diff --git a/src/css_properties.cpp b/src/css_properties.cpp index 902cce67c..2696ae28f 100644 --- a/src/css_properties.cpp +++ b/src/css_properties.cpp @@ -21,6 +21,7 @@ void litehtml::css_properties::compute(const element* el, const document::ptr& d m_vertical_align = (vertical_align) el->get_enum_property( _vertical_align_, false, va_baseline, offset(m_vertical_align)); m_text_transform = (text_transform) el->get_enum_property( _text_transform_, true, text_transform_none, offset(m_text_transform)); m_white_space = (white_space) el->get_enum_property( _white_space_, true, white_space_normal, offset(m_white_space)); + m_caption_side = (caption_side) el->get_enum_property( _caption_side_, true, caption_side_top, offset(m_caption_side)); // https://www.w3.org/TR/CSS22/visuren.html#dis-pos-flo if (m_display == display_none) diff --git a/src/render_table.cpp b/src/render_table.cpp index 3720bfcd0..1a3859641 100644 --- a/src/render_table.cpp +++ b/src/render_table.cpp @@ -321,40 +321,54 @@ int litehtml::render_item_table::_render(int x, int y, const containing_block_co // Render table captions // Table border doesn't round the caption, so we have to start caption in the border position - int captions_height = -border_top(); + int top_captions = -border_top(); for (auto& caption : m_grid->captions()) { - caption->render(-border_left(), captions_height, self_size.new_width(table_width + border_left() + border_right()), fmt_ctx); - captions_height += caption->height(); + if(caption->css().get_caption_side() == caption_side_top) + { + caption->render(-border_left(), top_captions, self_size.new_width(table_width + border_left() + border_right()), fmt_ctx); + top_captions += caption->height(); + } } - if (captions_height) + if (top_captions) { // Add border height to get the top of cells - captions_height += border_top(); + top_captions += border_top(); // Save caption height for draw_background - m_grid->captions_height(captions_height); + m_grid->top_captions_height(top_captions); // Move table cells to the bottom side for (int row = 0; row < m_grid->rows_count(); row++) { - m_grid->row(row).el_row->pos().y += captions_height; + m_grid->row(row).el_row->pos().y += top_captions; for (int col = 0; col < m_grid->cols_count(); col++) { table_cell* cell = m_grid->cell(col, row); if (cell->el) { - cell->el->pos().y += captions_height; + cell->el->pos().y += top_captions; } } } } + int bottom_captions = 0; + + for (auto& caption : m_grid->captions()) + { + if(caption->css().get_caption_side() == caption_side_bottom) + { + caption->render(-border_left(), table_height + top_captions + bottom_captions, self_size.new_width(table_width + border_left() + border_right()), fmt_ctx); + bottom_captions += caption->height(); + } + } + m_pos.move_to(x + content_offset_left(), y + content_offset_top()); m_pos.width = table_width; - m_pos.height = table_height + captions_height; + m_pos.height = table_height + top_captions + bottom_captions; if(self_size.width.type != containing_block_context::cbc_value_type_absolute) { @@ -458,7 +472,7 @@ int litehtml::render_item_table::get_draw_vertical_offset() { if(m_grid) { - return m_grid->captions_height(); + return m_grid->top_captions_height(); } return 0; } diff --git a/src/style.cpp b/src/style.cpp index ca6b18f06..5f267bfae 100644 --- a/src/style.cpp +++ b/src/style.cpp @@ -44,6 +44,8 @@ std::map style::m_valid_values = { _align_items_, flex_align_items_strings }, { _align_content_, flex_align_content_strings }, { _align_self_, flex_align_self_strings }, + + { _caption_side_, caption_side_strings }, }; void style::parse(const string& txt, const string& baseurl, document_container* container) @@ -130,6 +132,8 @@ void style::add_property(string_id name, const string& val, const string& baseur case _align_content_: case _align_self_: + case _caption_side_: + idx = value_index(val, m_valid_values[name]); if (idx >= 0) { From 1fb57d73a2d7fcd116b6fe3aea9f4b0291421df9 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Tue, 1 Aug 2023 19:34:47 +0300 Subject: [PATCH 13/73] Create FUNDING.yml --- .github/FUNDING.yml | 13 +++++++++++++ 1 file changed, 13 insertions(+) create mode 100644 .github/FUNDING.yml diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml new file mode 100644 index 000000000..1299f2468 --- /dev/null +++ b/.github/FUNDING.yml @@ -0,0 +1,13 @@ +# These are supported funding model platforms + +github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2] +patreon: # Replace with a single Patreon username +open_collective: # Replace with a single Open Collective username +ko_fi: # Replace with a single Ko-fi username +tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel +community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry +liberapay: # Replace with a single Liberapay username +issuehunt: # Replace with a single IssueHunt username +otechie: # Replace with a single Otechie username +lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry +custom: ["http://www.litehtml.com/donate.html"] # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2'] From 92047d674e2453669e6071ceccad9828d0b5430e Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Tue, 5 Sep 2023 18:09:02 +0300 Subject: [PATCH 14/73] Unnecessary removal of element in apply_stylesheet Fixes crash on https://www.lostfilm.today/news/id11063 --- src/html_tag.cpp | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/html_tag.cpp b/src/html_tag.cpp index 1015a4ee0..0b978f56a 100644 --- a/src/html_tag.cpp +++ b/src/html_tag.cpp @@ -178,6 +178,11 @@ litehtml::element::ptr litehtml::html_tag::select_one( const css_selector& selec void litehtml::html_tag::apply_stylesheet( const litehtml::css& stylesheet ) { + if(is_root()) + { + int i = 0; + i++; + } for(const auto& sel : stylesheet.selectors()) { // optimization @@ -234,9 +239,6 @@ void litehtml::html_tag::apply_stylesheet( const litehtml::css& stylesheet ) if(!content_none) { add_style(*sel->m_style); - } else - { - parent()->removeChild(shared_from_this()); } } us->m_used = true; From 330e124166be5ce2871050aa026677489ec1763a Mon Sep 17 00:00:00 2001 From: stasoid Date: Mon, 11 Sep 2023 22:36:59 +0600 Subject: [PATCH 15/73] discard invalid color declarations --- src/style.cpp | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/src/style.cpp b/src/style.cpp index 5f267bfae..5642d36c4 100644 --- a/src/style.cpp +++ b/src/style.cpp @@ -242,7 +242,7 @@ void style::add_property(string_id name, const string& val, const string& baseur add_parsed_property(_border_top_width_, width); add_parsed_property(_border_bottom_width_, width); } - else + else if (web_color::is_color(token, container)) { web_color _color = web_color::from_string(token, container); property_value color(_color, important); @@ -275,7 +275,7 @@ void style::add_property(string_id name, const string& val, const string& baseur property_value width(parse_border_width(token), important); add_parsed_property(_id(_s(name) + "-width"), width); } - else + else if (web_color::is_color(token, container)) { web_color color = web_color::from_string(token, container); add_parsed_property(_id(_s(name) + "-color"), property_value(color, important)); @@ -338,11 +338,12 @@ void style::add_property(string_id name, const string& val, const string& baseur case _border_bottom_color_: case _border_left_color_: case _border_right_color_: - { - web_color color = web_color::from_string(val, container); - add_parsed_property(name, property_value(color, important)); + if (web_color::is_color(val, container)) + { + web_color color = web_color::from_string(val, container); + add_parsed_property(name, property_value(color, important)); + } break; - } // Parse border radius shorthand properties case _border_bottom_left_radius_: From 01f186a1720217820e87427d1c3f425c19394ad1 Mon Sep 17 00:00:00 2001 From: stasoid Date: Mon, 11 Sep 2023 22:40:00 +0600 Subject: [PATCH 16/73] fix win32_container after commit 3b896be --- containers/win32/win32_container.cpp | 15 +-------------- 1 file changed, 1 insertion(+), 14 deletions(-) diff --git a/containers/win32/win32_container.cpp b/containers/win32/win32_container.cpp index d48530071..520b1ed23 100644 --- a/containers/win32/win32_container.cpp +++ b/containers/win32/win32_container.cpp @@ -280,20 +280,7 @@ void win32_container::draw_background( uint_ptr _hdc, const std::vector Date: Mon, 11 Sep 2023 23:43:35 +0600 Subject: [PATCH 17/73] test for commit 330e1241 --- test/render/css-2-invalid-color.htm | 11 +++++++++++ test/render/css-2-invalid-color.htm.png | Bin 0 -> 151 bytes 2 files changed, 11 insertions(+) create mode 100644 test/render/css-2-invalid-color.htm create mode 100644 test/render/css-2-invalid-color.htm.png diff --git a/test/render/css-2-invalid-color.htm b/test/render/css-2-invalid-color.htm new file mode 100644 index 000000000..df396aafd --- /dev/null +++ b/test/render/css-2-invalid-color.htm @@ -0,0 +1,11 @@ + + + + +

text \ No newline at end of file diff --git a/test/render/css-2-invalid-color.htm.png b/test/render/css-2-invalid-color.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..69dfe83c1665d53883b5dde516ac32617f903d05 GIT binary patch literal 151 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK4H%h$5M4 zba4!+V0?RVBX5HNk4vE1N1iD>M>*uqUG+^>RI%D+vQO!k|I7V)b_@&$&i}Mk>bAQ2 y*<0ms`AajGd8Y+5k54kXqY`8&$H>57UB&1i#uvZO%cCD?E`z75pUXO@geCxH!!a=c literal 0 HcmV?d00001 From 719df590880b5da6542538ebae032e7b6597ecfa Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Tue, 19 Sep 2023 00:42:51 +0300 Subject: [PATCH 18/73] Integer underflow in litehtml::media_query::create_from_string Closes issue #275 --- src/media_query.cpp | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/media_query.cpp b/src/media_query.cpp index 763620367..7cddb15a2 100644 --- a/src/media_query.cpp +++ b/src/media_query.cpp @@ -31,7 +31,7 @@ litehtml::media_query::ptr litehtml::media_query::create_from_string(const strin } else if(token.at(0) == '(') { token.erase(0, 1); - if(token.at(token.length() - 1) == ')') + if(!token.empty() && token.at(token.length() - 1) == ')') { token.erase(token.length() - 1, 1); } From 334eb32c49c42d8393f5c94f81d4901b77ba8bab Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Tue, 10 Oct 2023 23:24:45 +0300 Subject: [PATCH 19/73] Endless cycle in litehtml::css::parse_stylesheet Closes issue #276 --- src/stylesheet.cpp | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/stylesheet.cpp b/src/stylesheet.cpp index 12bfd721d..8c4b78431 100644 --- a/src/stylesheet.cpp +++ b/src/stylesheet.cpp @@ -13,6 +13,11 @@ void litehtml::css::parse_stylesheet(const char* str, const char* baseurl, const while(c_start != string::npos) { string::size_type c_end = text.find("*/", c_start + 2); + if(c_end == string::npos) + { + text.erase(c_start); + break; + } text.erase(c_start, c_end - c_start + 2); c_start = text.find("/*"); } From 42632777fbb047e15cb6a4f661a3304f993671ec Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Wed, 18 Oct 2023 03:56:58 +0300 Subject: [PATCH 20/73] Fix compile bugs on Windows --- containers/cairo/cairo_container.cpp | 2 +- litehtml.vcxproj | 6 +++++- litehtml.vcxproj.filters | 18 +++++++++++++++--- 3 files changed, 21 insertions(+), 5 deletions(-) diff --git a/containers/cairo/cairo_container.cpp b/containers/cairo/cairo_container.cpp index 02c50bbca..c766d9854 100644 --- a/containers/cairo/cairo_container.cpp +++ b/containers/cairo/cairo_container.cpp @@ -939,7 +939,7 @@ litehtml::string cairo_container::resolve_color(const litehtml::string& color) c { struct custom_color { - char* name; + const char* name; int color_index; }; diff --git a/litehtml.vcxproj b/litehtml.vcxproj index f6697e00e..20b94bf10 100644 --- a/litehtml.vcxproj +++ b/litehtml.vcxproj @@ -163,6 +163,7 @@ + @@ -190,6 +191,7 @@ + @@ -211,7 +213,6 @@ - @@ -220,6 +221,9 @@ + + + diff --git a/litehtml.vcxproj.filters b/litehtml.vcxproj.filters index 696c1df84..f4a16a22b 100644 --- a/litehtml.vcxproj.filters +++ b/litehtml.vcxproj.filters @@ -173,9 +173,6 @@ Source Files - - Source Files - Source Files @@ -200,6 +197,21 @@ Source Files + + Source Files + + + Source Files + + + Source Files + + + Source Files + + + Source Files + From 32e294ff34c7f9ac6f8e70ff520d386de8befeb1 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Sun, 22 Oct 2023 23:06:54 +0300 Subject: [PATCH 21/73] fix: casting void* to enum directly causes warning Closes issue #273 --- src/gumbo/error.c | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/gumbo/error.c b/src/gumbo/error.c index 5e89cd76c..369e7c11e 100644 --- a/src/gumbo/error.c +++ b/src/gumbo/error.c @@ -79,7 +79,7 @@ static void print_tag_stack(GumboParser* parser, const GumboParserError* error, if (i) { print_message(parser, output, ", "); } - GumboTag tag = (GumboTag) error->tag_stack.data[i]; + GumboTag tag = (GumboTag)(uintptr_t) error->tag_stack.data[i]; print_message(parser, output, gumbo_normalized_tagname(tag)); } gumbo_string_buffer_append_codepoint(parser, '.', output); From 6d065eaef57fb1d3c15bfcc2925c7b868d9f5343 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Sun, 5 Nov 2023 17:04:28 +0300 Subject: [PATCH 22/73] flex layout - the first implementation --- include/litehtml/css_properties.h | 8 +- include/litehtml/render_flex.h | 1 - include/litehtml/render_item.h | 4 +- include/litehtml/types.h | 17 +-- src/css_properties.cpp | 4 +- src/render_flex.cpp | 208 +++++++++++++++++++++++++++++- src/style.cpp | 2 +- 7 files changed, 217 insertions(+), 27 deletions(-) diff --git a/include/litehtml/css_properties.h b/include/litehtml/css_properties.h index 739e35fc2..c0c9be49d 100644 --- a/include/litehtml/css_properties.h +++ b/include/litehtml/css_properties.h @@ -67,7 +67,7 @@ namespace litehtml flex_wrap m_flex_wrap; flex_justify_content m_flex_justify_content; flex_align_items m_flex_align_items; - flex_align_self m_flex_align_self; + flex_align_items m_flex_align_self; flex_align_content m_flex_align_content; caption_side m_caption_side; @@ -119,7 +119,7 @@ namespace litehtml m_flex_wrap(flex_wrap_nowrap), m_flex_justify_content(flex_justify_content_flex_start), m_flex_align_items(flex_align_items_stretch), - m_flex_align_self(flex_align_self_auto), + m_flex_align_self(flex_align_items_auto), m_flex_align_content(flex_align_content_stretch) {} @@ -250,7 +250,7 @@ namespace litehtml flex_wrap get_flex_wrap() const; flex_justify_content get_flex_justify_content() const; flex_align_items get_flex_align_items() const; - flex_align_self get_flex_align_self() const; + flex_align_items get_flex_align_self() const; flex_align_content get_flex_align_content() const; }; @@ -634,7 +634,7 @@ namespace litehtml return m_flex_align_items; } - inline flex_align_self css_properties::get_flex_align_self() const + inline flex_align_items css_properties::get_flex_align_self() const { return m_flex_align_self; } diff --git a/include/litehtml/render_flex.h b/include/litehtml/render_flex.h index 5d31bc9bf..d06b4cb66 100644 --- a/include/litehtml/render_flex.h +++ b/include/litehtml/render_flex.h @@ -38,7 +38,6 @@ namespace litehtml { return std::make_shared(src_el()); } - void draw_children(uint_ptr hdc, int x, int y, const position* clip, draw_flag flag, int zindex) override; std::shared_ptr init() override; }; } diff --git a/include/litehtml/render_item.h b/include/litehtml/render_item.h index 9d4561e5a..2589974bb 100644 --- a/include/litehtml/render_item.h +++ b/include/litehtml/render_item.h @@ -86,7 +86,7 @@ namespace litehtml int width() const { - return m_pos.width + m_margins.left + m_margins.right + m_padding.width() + m_borders.width(); + return m_pos.width + m_margins.width() + m_padding.width() + m_borders.width(); } int padding_top() const @@ -234,7 +234,7 @@ namespace litehtml int box_sizing_width() const { - return box_sizing_left() + box_sizing_left(); + return box_sizing_left() + box_sizing_right(); } int box_sizing_top() const diff --git a/include/litehtml/types.h b/include/litehtml/types.h index b1feeeea6..50eaf1c40 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -859,7 +859,7 @@ namespace litehtml flex_justify_content_space_around }; -#define flex_align_items_strings "flex-start;flex-end;center;baseline;stretch" +#define flex_align_items_strings "flex-start;flex-end;center;baseline;stretch;auto" enum flex_align_items { @@ -867,19 +867,8 @@ namespace litehtml flex_align_items_flex_end, flex_align_items_center, flex_align_items_baseline, - flex_align_items_stretch - }; - -#define flex_align_self_strings "auto;flex-start;flex-end;center;baseline;stretch" - - enum flex_align_self - { - flex_align_self_auto, - flex_align_self_flex_start, - flex_align_self_flex_end, - flex_align_self_center, - flex_align_self_baseline, - flex_align_self_stretch + flex_align_items_stretch, + flex_align_items_auto // used for align-self property only }; #define flex_align_content_strings "flex-start;flex-end;center;space-between;space-around;stretch" diff --git a/src/css_properties.cpp b/src/css_properties.cpp index 2696ae28f..99b6cd92b 100644 --- a/src/css_properties.cpp +++ b/src/css_properties.cpp @@ -405,8 +405,8 @@ void litehtml::css_properties::compute_flex(const element* el, const document::p { m_flex_grow = el->get_number_property(_flex_grow_, false, 0, offset(m_flex_grow)); m_flex_shrink = el->get_number_property(_flex_shrink_, false, 1, offset(m_flex_shrink)); - m_flex_align_self = (flex_align_self) el->get_enum_property(_align_self_, false, flex_align_self_auto, offset(m_flex_align_self)); - m_flex_basis = el->get_length_property(_flex_shrink_, false, css_length::predef_value(flex_basis_auto), offset(m_flex_basis)); + m_flex_align_self = (flex_align_items) el->get_enum_property(_align_self_, false, flex_align_items_auto, offset(m_flex_align_self)); + m_flex_basis = el->get_length_property(_flex_basis_, false, css_length::predef_value(flex_basis_auto), offset(m_flex_basis)); doc->cvt_units(m_flex_basis, get_font_size()); if(m_display == display_inline || m_display == display_inline_block) { diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 2cab59e04..82da44996 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -4,13 +4,215 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) { - return 0; + struct flex_item + { + std::shared_ptr el; + int basis; // flex basis + int min_width; + int grow; + int shrink; + flex_align_items align; + explicit flex_item(std::shared_ptr& _el) : + el(_el), + align(flex_align_items_auto), + grow(0), + basis(0), + shrink(0), + min_width(0) {} + }; + + struct flex_line + { + std::list items; + int top; + int height; // line height + int width; + int basis; + int total_not_min; // Total items with width > min_width + int total_grow; + int total_shrink; + flex_line() : height(0), top(0), total_grow(0.0), width(0), total_not_min(0), basis(0), total_shrink(0) {} + void clear() + { + items.clear(); + top = height = width = total_not_min = basis = total_shrink = total_grow = 0; + } + }; + + std::list items; + for( auto& el : m_children) + { + flex_item item(el); + item.grow = (int) (item.el->css().get_flex_grow() * 1000.0); + item.shrink = (int) (item.el->css().get_flex_shrink() * 1000.0); + item.min_width = el->render(0, 0, self_size.new_width(el->content_offset_width()), fmt_ctx); + if(item.el->css().get_flex_basis().is_predefined()) + { + switch (item.el->css().get_flex_basis().predef()) + { + case flex_basis_auto: + if(!item.el->css().get_width().is_predefined()) + { + item.el->calc_outlines(self_size.render_width); + item.basis = item.el->css().get_width().calc_percent(self_size.render_width) + item.el->content_offset_width(); + break; + } + case flex_basis_max_content: + case flex_basis_fit_content: + item.basis = el->render(0, 0, self_size, fmt_ctx); + break; + case flex_basis_min_content: + item.basis = item.min_width; + break; + } + } else + { + item.el->calc_outlines(self_size.render_width); + item.basis = item.el->css().get_flex_basis().calc_percent(self_size.render_width) + item.el->content_offset_width(); + } + if(el->css().get_flex_align_self() == flex_align_items_auto) + { + item.align = css().get_flex_align_items(); + } else + { + item.align = el->css().get_flex_align_self(); + } + items.push_back(item); + } + + std::list lines; + flex_line line; + for(auto& item : items) + { + if(!line.items.empty() && css().get_flex_wrap() != flex_wrap_nowrap && line.basis + item.basis > self_size.render_width) + { + lines.push_back(line); + line.clear(); + } + line.items.push_back(item); + line.basis += item.basis; + line.total_grow += item.grow; + line.total_shrink += item.shrink; + if(item.basis > item.min_width) + { + line.total_not_min++; + } + } + if(!line.items.empty()) + { + lines.push_back(line); + } + + int el_y = 0; + for(auto& ln : lines) + { + ln.top = el_y; + ln.height = 0; + int el_x = 0; + + // distribute free space to items + int line_free_space = self_size.render_width - ln.basis; + if(line_free_space < 0) + { + int left_space = -line_free_space; + int total_not_min = ln.total_not_min; + for (auto &item: ln.items) + { + if(total_not_min >= 0) + { + if (item.basis > item.min_width) + { + int addSpace = (int) ((float) line_free_space / (float) total_not_min); + if (left_space + addSpace < 0) + { + addSpace = -left_space; + } + if (item.basis + addSpace <= item.min_width) + { + addSpace = item.min_width - item.basis; + item.basis = item.min_width; + total_not_min--; + } else + { + item.basis += addSpace; + } + left_space -= -addSpace; + } + } else break; + } + // we have some more free space, add it to the last item + if (left_space > 0) + { + for(auto iter = ln.items.begin(); iter != ln.items.end(); iter++) + { + if(iter->basis > iter->min_width) + { + ln.items.back().basis -= left_space; + break; + } + } + } + } else if(ln.total_grow > 0) + { + // Distribute free space by flex-grow + int left_space = line_free_space; + for(auto& item : ln.items) + { + if(item.grow > 0) + { + int add_space = (int) ((float) line_free_space * (float) item.grow / (float) ln.total_grow); + item.basis += add_space; + } + } + } + + // render items into new width + for(auto& item : ln.items) + { + item.el->render(el_x, + el_y, + self_size.new_width(item.basis), fmt_ctx, false); + ln.height = std::max(ln.height, item.el->height()); + el_x += item.el->width(); + } + el_y += ln.height; + } + for(auto& ln : lines) + { + for(auto& item : ln.items) + { + switch (item.align) + { + case flex_align_items_flex_end: + item.el->pos().y = ln.top + ln.height - item.el->height() + item.el->content_offset_top(); + break; + case flex_align_items_center: + item.el->pos().y = ln.top + ln.height / 2 - item.el->height() /2 + item.el->content_offset_top(); + break; + case flex_align_items_flex_start: + item.el->pos().y = ln.top + item.el->content_offset_top(); + break; + default: + item.el->pos().y = ln.top + item.el->content_offset_top(); + item.el->pos().height = ln.height - item.el->content_offset_height(); + break; + } + } + } + + // calculate the final position + m_pos.move_to(x, y); + m_pos.x += content_offset_left(); + m_pos.y += content_offset_top(); + m_pos.height = el_y; + + return 0; } -void litehtml::render_item_flex::draw_children(uint_ptr hdc, int x, int y, const position* clip, draw_flag flag, int zindex) +/*void litehtml::render_item_flex::draw_children(uint_ptr hdc, int x, int y, const position* clip, draw_flag flag, int zindex) { -} +}*/ std::shared_ptr litehtml::render_item_flex::init() { diff --git a/src/style.cpp b/src/style.cpp index 5642d36c4..e32e7613d 100644 --- a/src/style.cpp +++ b/src/style.cpp @@ -43,7 +43,7 @@ std::map style::m_valid_values = { _justify_content_, flex_justify_content_strings }, { _align_items_, flex_align_items_strings }, { _align_content_, flex_align_content_strings }, - { _align_self_, flex_align_self_strings }, + { _align_self_, flex_align_items_strings }, { _caption_side_, caption_side_strings }, }; From c5335d559f16583ad07a6aa15011b40490df5cef Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Mon, 6 Nov 2023 04:15:46 +0300 Subject: [PATCH 23/73] flex layout: support for flex-direction: row --- src/render_flex.cpp | 124 +++++++++++++++++++++++++++----------------- 1 file changed, 76 insertions(+), 48 deletions(-) diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 82da44996..f37c91162 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -9,8 +9,11 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, std::shared_ptr el; int basis; // flex basis int min_width; + int main_size; int grow; int shrink; + int scaled_flex_shrink_factor; + bool frozen; flex_align_items align; explicit flex_item(std::shared_ptr& _el) : el(_el), @@ -18,7 +21,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, grow(0), basis(0), shrink(0), - min_width(0) {} + min_width(0), + frozen(false), + main_size(0), + scaled_flex_shrink_factor(0) {} }; struct flex_line @@ -28,14 +34,19 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, int height; // line height int width; int basis; - int total_not_min; // Total items with width > min_width int total_grow; int total_shrink; - flex_line() : height(0), top(0), total_grow(0.0), width(0), total_not_min(0), basis(0), total_shrink(0) {} + flex_line() : + height(0), + top(0), + total_grow(0), + width(0), + basis(0), + total_shrink(0){} void clear() { items.clear(); - top = height = width = total_not_min = basis = total_shrink = total_grow = 0; + top = height = width = basis = total_shrink = total_grow = 0; } }; @@ -77,6 +88,8 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { item.align = el->css().get_flex_align_self(); } + item.main_size = item.basis; + item.scaled_flex_shrink_factor = item.basis * item.shrink; items.push_back(item); } @@ -89,14 +102,17 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, lines.push_back(line); line.clear(); } - line.items.push_back(item); line.basis += item.basis; line.total_grow += item.grow; line.total_shrink += item.shrink; if(item.basis > item.min_width) { - line.total_not_min++; + item.frozen = false; + } else + { + item.frozen = true; } + line.items.push_back(item); } if(!line.items.empty()) { @@ -104,64 +120,81 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } int el_y = 0; + int ret_width = 0; for(auto& ln : lines) { ln.top = el_y; ln.height = 0; int el_x = 0; + ret_width += ln.basis; + // distribute free space to items - int line_free_space = self_size.render_width - ln.basis; - if(line_free_space < 0) + int initial_free_space = self_size.render_width - ln.basis; + if(initial_free_space < 0) { - int left_space = -line_free_space; - int total_not_min = ln.total_not_min; - for (auto &item: ln.items) + if(ln.total_shrink > 0) { - if(total_not_min >= 0) + initial_free_space = -initial_free_space; + bool processed = true; + while (processed) { - if (item.basis > item.min_width) + int sum_scaled_flex_shrink_factor = 0; + int sum_flex_factors = 0; + int remaining_free_space = self_size.render_width; + int total_not_frozen = 0; + for (auto &item: ln.items) { - int addSpace = (int) ((float) line_free_space / (float) total_not_min); - if (left_space + addSpace < 0) + if (!item.frozen) { - addSpace = -left_space; - } - if (item.basis + addSpace <= item.min_width) - { - addSpace = item.min_width - item.basis; - item.basis = item.min_width; - total_not_min--; + sum_scaled_flex_shrink_factor += item.scaled_flex_shrink_factor; + sum_flex_factors += item.shrink; + remaining_free_space -= item.basis; + total_not_frozen++; } else { - item.basis += addSpace; + remaining_free_space -= item.main_size; } - left_space -= -addSpace; } - } else break; - } - // we have some more free space, add it to the last item - if (left_space > 0) - { - for(auto iter = ln.items.begin(); iter != ln.items.end(); iter++) - { - if(iter->basis > iter->min_width) + if (!total_not_frozen) break; + remaining_free_space = -remaining_free_space; + if (remaining_free_space) { - ln.items.back().basis -= left_space; - break; + int total_clamped = 0; + for (auto &item: ln.items) + { + if (!item.frozen) + { + // Distribute free space proportional to the flex factors. + int scaled_flex_shrink_factor = item.basis * item.shrink; + item.main_size = (int) ((float) item.basis - (float) remaining_free_space * + (float) scaled_flex_shrink_factor / + (float) sum_scaled_flex_shrink_factor); + + if (item.main_size <= item.min_width) + { + total_clamped++; + item.main_size = item.min_width; + item.frozen = true; + } + } + } + if (total_clamped == 0) processed = false; } } } - } else if(ln.total_grow > 0) + } else { - // Distribute free space by flex-grow - int left_space = line_free_space; - for(auto& item : ln.items) + if(ln.total_grow > 0) { - if(item.grow > 0) + // Distribute free space by flex-grow + for (auto &item: ln.items) { - int add_space = (int) ((float) line_free_space * (float) item.grow / (float) ln.total_grow); - item.basis += add_space; + if (item.grow > 0) + { + int add_space = (int) ((float) initial_free_space * (float) item.grow / (float) ln.total_grow); + item.main_size = item.basis + add_space; + } } } } @@ -171,7 +204,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { item.el->render(el_x, el_y, - self_size.new_width(item.basis), fmt_ctx, false); + self_size.new_width(item.main_size), fmt_ctx, false); ln.height = std::max(ln.height, item.el->height()); el_x += item.el->width(); } @@ -206,14 +239,9 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, m_pos.y += content_offset_top(); m_pos.height = el_y; - return 0; + return ret_width + content_offset_width(); } -/*void litehtml::render_item_flex::draw_children(uint_ptr hdc, int x, int y, const position* clip, draw_flag flag, int zindex) -{ - -}*/ - std::shared_ptr litehtml::render_item_flex::init() { auto doc = src_el()->get_document(); From dbe19ccb6141216dfae5dc79bc0ffbe276d20015 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Mon, 6 Nov 2023 23:31:59 +0300 Subject: [PATCH 24/73] flex layout: remake disrtibute free space algorithm REF: https://www.w3.org/TR/css-flexbox-1/#resolve-flexible-lengths --- src/render_flex.cpp | 137 ++++++++++++++++++++++++++----------- test/render/test39.htm | 42 ++++++++++++ test/render/test39.htm.png | Bin 0 -> 2850 bytes 3 files changed, 140 insertions(+), 39 deletions(-) create mode 100644 test/render/test39.htm create mode 100644 test/render/test39.htm.png diff --git a/src/render_flex.cpp b/src/render_flex.cpp index f37c91162..ccc41b655 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -9,6 +9,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, std::shared_ptr el; int basis; // flex basis int min_width; + int max_width; int main_size; int grow; int shrink; @@ -24,6 +25,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, min_width(0), frozen(false), main_size(0), + max_width(0), scaled_flex_shrink_factor(0) {} }; @@ -56,7 +58,20 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, flex_item item(el); item.grow = (int) (item.el->css().get_flex_grow() * 1000.0); item.shrink = (int) (item.el->css().get_flex_shrink() * 1000.0); - item.min_width = el->render(0, 0, self_size.new_width(el->content_offset_width()), fmt_ctx); + if(item.el->css().get_min_width().is_predefined()) + { + item.min_width = el->render(0, 0, self_size.new_width(el->content_offset_width()), fmt_ctx); + } else + { + item.min_width = item.el->css().get_min_width().calc_percent(self_size.render_width) + el->content_offset_width(); + } + if(item.el->css().get_max_width().is_predefined()) + { + item.max_width = self_size.render_width; + } else + { + item.max_width = item.el->css().get_max_width().calc_percent(self_size.render_width) + el->content_offset_width(); + } if(item.el->css().get_flex_basis().is_predefined()) { switch (item.el->css().get_flex_basis().predef()) @@ -119,6 +134,9 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, lines.push_back(line); } + // Resolving Flexible Lengths + // REF: https://www.w3.org/TR/css-flexbox-1/#resolve-flexible-lengths + int el_y = 0; int ret_width = 0; for(auto& ln : lines) @@ -129,72 +147,113 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, ret_width += ln.basis; - // distribute free space to items + // Determine the used flex factor. Sum the outer hypothetical main sizes of all items on the line. + // If the sum is less than the flex container’s inner main size, use the flex grow factor for the + // rest of this algorithm; otherwise, use the flex shrink factor. int initial_free_space = self_size.render_width - ln.basis; + bool grow; + int total_flex_factor; if(initial_free_space < 0) { - if(ln.total_shrink > 0) + grow = false; + total_flex_factor = ln.total_shrink; + } else + { + grow = true; + total_flex_factor = ln.total_grow; + } + + if(total_flex_factor > 0) + { + bool processed = true; + while (processed) { - initial_free_space = -initial_free_space; - bool processed = true; - while (processed) + int sum_scaled_flex_shrink_factor = 0; + int sum_flex_factors = 0; + int remaining_free_space = self_size.render_width; + int total_not_frozen = 0; + for (auto &item: ln.items) { - int sum_scaled_flex_shrink_factor = 0; - int sum_flex_factors = 0; - int remaining_free_space = self_size.render_width; - int total_not_frozen = 0; - for (auto &item: ln.items) + if (!item.frozen) { - if (!item.frozen) + sum_scaled_flex_shrink_factor += item.scaled_flex_shrink_factor; + if(grow) { - sum_scaled_flex_shrink_factor += item.scaled_flex_shrink_factor; - sum_flex_factors += item.shrink; - remaining_free_space -= item.basis; - total_not_frozen++; + sum_flex_factors += item.grow; } else { - remaining_free_space -= item.main_size; + sum_flex_factors += item.shrink; } + remaining_free_space -= item.basis; + total_not_frozen++; + } else + { + remaining_free_space -= item.main_size; } - if (!total_not_frozen) break; - remaining_free_space = -remaining_free_space; - if (remaining_free_space) + } + // Check for flexible items. If all the flex items on the line are frozen, free space has + // been distributed; exit this loop. + if (!total_not_frozen) break; + + remaining_free_space = std::abs(remaining_free_space); + // c. Distribute free space proportional to the flex factors. + // If the remaining free space is zero + // Do nothing. + if (remaining_free_space) + { + int total_clamped = 0; + for (auto &item: ln.items) { - int total_clamped = 0; - for (auto &item: ln.items) + if (!item.frozen) { - if (!item.frozen) + if(!grow) { - // Distribute free space proportional to the flex factors. + // If using the flex shrink factor + // For every unfrozen item on the line, multiply its flex shrink factor by its + // inner flex base size, and note this as its scaled flex shrink factor. Find + // the ratio of the item’s scaled flex shrink factor to the sum of the scaled + // flex shrink factors of all unfrozen items on the line. Set the item’s target + // main size to its flex base size minus a fraction of the absolute value of the + // remaining free space proportional to the ratio. int scaled_flex_shrink_factor = item.basis * item.shrink; item.main_size = (int) ((float) item.basis - (float) remaining_free_space * (float) scaled_flex_shrink_factor / (float) sum_scaled_flex_shrink_factor); + // d. Fix min/max violations. Clamp each non-frozen item’s target main size by its used + // min and max main sizes and floor its content-box size at zero. If the item’s target + // main size was made smaller by this, it’s a max violation. If the item’s target main + // size was made larger by this, it’s a min violation. if (item.main_size <= item.min_width) { total_clamped++; item.main_size = item.min_width; item.frozen = true; } + } else + { + // If using the flex grow factor + // Find the ratio of the item’s flex grow factor to the sum of the flex grow + // factors of all unfrozen items on the line. Set the item’s target main size to + // its flex base size plus a fraction of the remaining free space proportional + // to the ratio. + item.main_size = (int) ((float) item.basis + + (float) remaining_free_space * (float) item.grow / + (float) total_flex_factor); + // d. Fix min/max violations. Clamp each non-frozen item’s target main size by its used + // min and max main sizes and floor its content-box size at zero. If the item’s target + // main size was made smaller by this, it’s a max violation. If the item’s target main + // size was made larger by this, it’s a min violation. + if (item.main_size >= self_size.render_width) + { + total_clamped++; + item.main_size = self_size.render_width; + item.frozen = true; + } } } - if (total_clamped == 0) processed = false; - } - } - } - } else - { - if(ln.total_grow > 0) - { - // Distribute free space by flex-grow - for (auto &item: ln.items) - { - if (item.grow > 0) - { - int add_space = (int) ((float) initial_free_space * (float) item.grow / (float) ln.total_grow); - item.main_size = item.basis + add_space; } + if (total_clamped == 0) processed = false; } } } diff --git a/test/render/test39.htm b/test/render/test39.htm new file mode 100644 index 000000000..6e417bb70 --- /dev/null +++ b/test/render/test39.htm @@ -0,0 +1,42 @@ + + +

+
block number 1
+
block number 2
+
hello my dear friend
+
+
+
block number 1
+
block number 2
+
hello my dear friend
+
+
+
block number 1
+
block number 2
+
hello my dear friend
+
+
+
block number 1
+
block number 2
+
hello my dear friend
+
diff --git a/test/render/test39.htm.png b/test/render/test39.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..5d518ffb8ab3fa08211f5ff41d3996df3a877866 GIT binary patch literal 2850 zcmai03se)w8cs!t#R65^@)Dv|ukE#fii$Nrib%l+#7Zl*2=P&|3K&s&D26?Xf=VSm zu0TbJf`X4iK#_^?;b2r$dt>@fx=j_hR{{PPGzw>?H z{BvYgc!<57s~v?xv0oOtbTx%C22d#PDaYE7mW_fxM#yH;s+HdcLkKC9?9nQlVr?iq zzZho<#ZJ6zY2df1@Adz&e^1dI=PWGh?)Jy!kGD_lm?{U?)=diiXz5rxJYtVr{c6YF zxmk=&c*xSxviqvn(@bM-t{iuDAIf%N2C$+TU7@aYB~c-%Mq;P)l4*;oz8v zhTt0gm!~1~Mo7CdLTZkDZM&wwOL~~SY^=U1FRJQOC3jRoRLSCDMFxzpqOZo%TjaXtP=#IOA1l0Bq z!mFK(?kcutOT~3+>kgCYr$3r{Tm~f{YkXHcf`*$N=)U^y+lZJU6Ci^sM1xAq>|S|7 z9hK%Ir^mIMC2NtL7OpX?z5W<%CB8J4N%ui{8-n>Pz77j^0+;}=4DFc!_h^`G=sU!v zE^#h*>jlCEe%m<@(Ik9L_{;Wy*=>TE8iA&Y8YKufAh#rTM9O7#aWo1DE(4^M@g$$( zv)7Ua z_nO_CAzpc0{&dSd)an0D=nJ)Z3G^`Hk!Jjx(SrnX=1BRt>(mKU5URmtOe;2n?tPg?(@H8awNH}zh&AG`jJZE41e#i8XH=N;w~f}K9| z@)@~bZFI_Pl#djZ4hQF}Y1j9i(~a08^1rHtM%K&qzpQzv!C0%_&{@@ za!hri3uw#*ncJr8cP&YmKD#M4!(&LLEBszf!`N&wYes;hF$p%z!v&pPQ0UlyA4t4~ z$ZVV=Hd5&;SB4|s3~Ns!&DVA7GLgzdNR3N;>pTNoZnPxdLfylRPV@~h#h53Q`{JA^ zvpW3?`G%paz4uXlvT?+dxb%?KwjN{uq@d{-0*;y)spgBmttx()+2r8~IBCQsL)WeS>;YvCYG(2~+u%0@UVGrxiflC8C%-5oyqLWlf&|Ci&K#>a+7)(wA1~}%44_qwY zUltXsEt%eI+!8eiZyzJv#djE{1r63fMxznR1)GSBdwTw~@Z4t;a7)f`-uqvInnxJ# z5WE;f1Yev?&(Ndm5zS*4SScJqPnLS}UnM#l(Zw=`5^cc%ae}|a5oph;c`-_KJR*OD zwbK;mh5bqQk^b-D&CN0%?yAtbf%4!387yXam!dbXs8bTlFekI1IaQ&Nur;8=x4bG|wZguwF5$UoLv!Femwlx9yc7 z$K+sVr!35U4Z(_h<~d71#KQ^+YB_*Lf2b45rK}l&W6vdo{<8DAcORuvQ*2)sdKI@w zKLCANu7PP+;-uUa+6(f)#yvU8O;P<&onQ;GL=}HdbW8k**84uxfYoV0LR>OFlMw?= z4e~_DMNwlKsTS_kqkCdf^vn_*>Ad$E@6c zO=~ksB0DUh_aGhLoQKwbf}?jCJ;*Ke@Z~j!x3*1;_vjI;xn9}N&&JZ(EpaYg*+4j; zqkYvR`}&1?d&4ay+pzUsx(BaQdAkNd-0*f>6%P9YGm%rM$BdJVj!0to_HiWMC>Veb z3<;f3we3NJ5;+N%I6+Uu->(puh1U=iACO1lwY#6cI9)aAG%2*b;!idbr7GAP5F<113_ z?ch3maaV&su$REE0t#OR%G7Sael$5uGi7P4$pJ%2wk?6WY5fhJompvklnLdGGO&we z;3(V3+|-X&lh>hLWPH{Xfjlb*byjZD7Lfmss;yitwmy$cv3j5CM6e6cj=R1Og(W48 z&}Q{?1@kW%(7Kr0-ll?PGc*TznvbFL|2mQUbBBMEU!-)1CPc*Bg<$PDO1^s|i+&VM z-hBk37rukDjwTm$euHD$gJZ~W*?vbE;M^*GKO5W9#AIyu@iyuF)oAcHH~N~ceqLU@ z=UHLh{$Em_x13^o?Dblu(ylQ}ZNY5cgj1}&9?7%ugu!W7Q2HfUtNzX`LN&T=n3gVk zWvS8+r}Ah8M8vP>FL!ipe0oXY7n74SIabzf9|bzS7^h;k)DAH`ve7$QEZ1Q+l=o^w z@;0~~J=3g^wnOoRSlE|Wc>ke|^FzfBMmlHLZ*DQj^6b<_pyrTVhzOeZ!qjx8FgHN! zYAR(}GJ^dsZkPpU7HF8z1*UeVsu?-A3l#YNB+kkmK+ZXs(1)(Sq15x}FssiDaooEw zP0O0{rx)OtH>R1qrN1sB7(%%h&%0HWp7@z+^BfPE{(B{YVd&wajje6$0CVm9v!WYF zdJq=i{=sou5UXZYj%x! Date: Tue, 7 Nov 2023 01:41:05 +0300 Subject: [PATCH 25/73] flex layout: small refactoring --- include/litehtml/render_flex.h | 21 ------ src/render_flex.cpp | 128 ++++++++++++++++----------------- 2 files changed, 63 insertions(+), 86 deletions(-) diff --git a/include/litehtml/render_flex.h b/include/litehtml/render_flex.h index d06b4cb66..5567e4b4f 100644 --- a/include/litehtml/render_flex.h +++ b/include/litehtml/render_flex.h @@ -7,27 +7,6 @@ namespace litehtml { class render_item_flex : public render_item_block { - struct flex_item - { - std::shared_ptr el; - int base_size; - int main_size; - int min_width; - int max_width; - int line; - - explicit flex_item(std::shared_ptr _el) : - el(std::move(_el)), - min_width(0), - max_width(0), - line(0), - base_size(0), - main_size(0) - {} - }; - protected: - std::list> m_flex_items; - int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; public: diff --git a/src/render_flex.cpp b/src/render_flex.cpp index ccc41b655..f70f834e3 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -2,75 +2,83 @@ #include "types.h" #include "render_flex.h" -int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) +namespace litehtml { struct flex_item { std::shared_ptr el; - int basis; // flex basis - int min_width; - int max_width; + int base_size; + int min_size; + int max_size; int main_size; int grow; int shrink; int scaled_flex_shrink_factor; bool frozen; flex_align_items align; - explicit flex_item(std::shared_ptr& _el) : - el(_el), - align(flex_align_items_auto), - grow(0), - basis(0), - shrink(0), - min_width(0), - frozen(false), - main_size(0), - max_width(0), - scaled_flex_shrink_factor(0) {} + + explicit flex_item(std::shared_ptr &_el) : + el(_el), + align(flex_align_items_auto), + grow(0), + base_size(0), + shrink(0), + min_size(0), + frozen(false), + main_size(0), + max_size(0), + scaled_flex_shrink_factor(0) + {} }; struct flex_line { std::list items; int top; - int height; // line height - int width; - int basis; + int cross_size; + int base_size; int total_grow; int total_shrink; + flex_line() : - height(0), - top(0), - total_grow(0), - width(0), - basis(0), - total_shrink(0){} + cross_size(0), + top(0), + total_grow(0), + base_size(0), + total_shrink(0) + {} + void clear() { items.clear(); - top = height = width = basis = total_shrink = total_grow = 0; + top = cross_size = base_size = total_shrink = total_grow = 0; } }; +} - std::list items; +int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) +{ + std::list lines; + flex_line line; for( auto& el : m_children) { flex_item item(el); item.grow = (int) (item.el->css().get_flex_grow() * 1000.0); item.shrink = (int) (item.el->css().get_flex_shrink() * 1000.0); + item.el->calc_outlines(self_size.render_width); if(item.el->css().get_min_width().is_predefined()) { - item.min_width = el->render(0, 0, self_size.new_width(el->content_offset_width()), fmt_ctx); + item.min_size = el->render(0, 0, self_size.new_width(el->content_offset_width()), fmt_ctx); } else { - item.min_width = item.el->css().get_min_width().calc_percent(self_size.render_width) + el->content_offset_width(); + item.min_size = item.el->css().get_min_width().calc_percent(self_size.render_width) + el->content_offset_width(); } if(item.el->css().get_max_width().is_predefined()) { - item.max_width = self_size.render_width; + item.max_size = self_size.render_width; } else { - item.max_width = item.el->css().get_max_width().calc_percent(self_size.render_width) + el->content_offset_width(); + item.max_size = item.el->css().get_max_width().calc_percent(self_size.render_width) + el->content_offset_width(); } if(item.el->css().get_flex_basis().is_predefined()) { @@ -79,22 +87,20 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, case flex_basis_auto: if(!item.el->css().get_width().is_predefined()) { - item.el->calc_outlines(self_size.render_width); - item.basis = item.el->css().get_width().calc_percent(self_size.render_width) + item.el->content_offset_width(); + item.base_size = item.el->css().get_width().calc_percent(self_size.render_width) + item.el->content_offset_width(); break; } case flex_basis_max_content: case flex_basis_fit_content: - item.basis = el->render(0, 0, self_size, fmt_ctx); + item.base_size = el->render(0, 0, self_size, fmt_ctx); break; case flex_basis_min_content: - item.basis = item.min_width; + item.base_size = item.min_size; break; } } else { - item.el->calc_outlines(self_size.render_width); - item.basis = item.el->css().get_flex_basis().calc_percent(self_size.render_width) + item.el->content_offset_width(); + item.base_size = item.el->css().get_flex_basis().calc_percent(self_size.render_width) + item.el->content_offset_width(); } if(el->css().get_flex_align_self() == flex_align_items_auto) { @@ -103,24 +109,19 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { item.align = el->css().get_flex_align_self(); } - item.main_size = item.basis; - item.scaled_flex_shrink_factor = item.basis * item.shrink; - items.push_back(item); - } + item.main_size = item.base_size; + item.scaled_flex_shrink_factor = item.base_size * item.shrink; - std::list lines; - flex_line line; - for(auto& item : items) - { - if(!line.items.empty() && css().get_flex_wrap() != flex_wrap_nowrap && line.basis + item.basis > self_size.render_width) + // Add flex item to line + if(!line.items.empty() && css().get_flex_wrap() != flex_wrap_nowrap && line.base_size + item.base_size > self_size.render_width) { lines.push_back(line); line.clear(); } - line.basis += item.basis; + line.base_size += item.base_size; line.total_grow += item.grow; line.total_shrink += item.shrink; - if(item.basis > item.min_width) + if(item.base_size > item.min_size) { item.frozen = false; } else @@ -129,6 +130,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } line.items.push_back(item); } + // Add the last line to the lines list if(!line.items.empty()) { lines.push_back(line); @@ -142,15 +144,15 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, for(auto& ln : lines) { ln.top = el_y; - ln.height = 0; + ln.cross_size = 0; int el_x = 0; - ret_width += ln.basis; + ret_width += ln.base_size; // Determine the used flex factor. Sum the outer hypothetical main sizes of all items on the line. // If the sum is less than the flex container’s inner main size, use the flex grow factor for the // rest of this algorithm; otherwise, use the flex shrink factor. - int initial_free_space = self_size.render_width - ln.basis; + int initial_free_space = self_size.render_width - ln.base_size; bool grow; int total_flex_factor; if(initial_free_space < 0) @@ -184,7 +186,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { sum_flex_factors += item.shrink; } - remaining_free_space -= item.basis; + remaining_free_space -= item.base_size; total_not_frozen++; } else { @@ -215,8 +217,8 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, // flex shrink factors of all unfrozen items on the line. Set the item’s target // main size to its flex base size minus a fraction of the absolute value of the // remaining free space proportional to the ratio. - int scaled_flex_shrink_factor = item.basis * item.shrink; - item.main_size = (int) ((float) item.basis - (float) remaining_free_space * + int scaled_flex_shrink_factor = item.base_size * item.shrink; + item.main_size = (int) ((float) item.base_size - (float) remaining_free_space * (float) scaled_flex_shrink_factor / (float) sum_scaled_flex_shrink_factor); @@ -224,10 +226,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, // min and max main sizes and floor its content-box size at zero. If the item’s target // main size was made smaller by this, it’s a max violation. If the item’s target main // size was made larger by this, it’s a min violation. - if (item.main_size <= item.min_width) + if (item.main_size <= item.min_size) { total_clamped++; - item.main_size = item.min_width; + item.main_size = item.min_size; item.frozen = true; } } else @@ -237,7 +239,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, // factors of all unfrozen items on the line. Set the item’s target main size to // its flex base size plus a fraction of the remaining free space proportional // to the ratio. - item.main_size = (int) ((float) item.basis + + item.main_size = (int) ((float) item.base_size + (float) remaining_free_space * (float) item.grow / (float) total_flex_factor); // d. Fix min/max violations. Clamp each non-frozen item’s target main size by its used @@ -264,10 +266,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.el->render(el_x, el_y, self_size.new_width(item.main_size), fmt_ctx, false); - ln.height = std::max(ln.height, item.el->height()); + ln.cross_size = std::max(ln.cross_size, item.el->height()); el_x += item.el->width(); } - el_y += ln.height; + el_y += ln.cross_size; } for(auto& ln : lines) { @@ -276,17 +278,17 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, switch (item.align) { case flex_align_items_flex_end: - item.el->pos().y = ln.top + ln.height - item.el->height() + item.el->content_offset_top(); + item.el->pos().y = ln.top + ln.cross_size - item.el->height() + item.el->content_offset_top(); break; case flex_align_items_center: - item.el->pos().y = ln.top + ln.height / 2 - item.el->height() /2 + item.el->content_offset_top(); + item.el->pos().y = ln.top + ln.cross_size / 2 - item.el->height() /2 + item.el->content_offset_top(); break; case flex_align_items_flex_start: item.el->pos().y = ln.top + item.el->content_offset_top(); break; default: item.el->pos().y = ln.top + item.el->content_offset_top(); - item.el->pos().height = ln.height - item.el->content_offset_height(); + item.el->pos().height = ln.cross_size - item.el->content_offset_height(); break; } } @@ -370,10 +372,6 @@ std::shared_ptr litehtml::render_item_flex::init() } convert_inlines(); children() = new_children; - for(const auto& el : children()) - { - m_flex_items.emplace_back(new flex_item(el)); - } return shared_from_this(); } From 871d08390a74cd210bc16011b066e86509c7e8c9 Mon Sep 17 00:00:00 2001 From: MichelCalonder Date: Fri, 8 Dec 2023 15:36:50 +0100 Subject: [PATCH 26/73] basic implementaion for css counters --- include/litehtml/html_tag.h | 12 ++++++++- include/litehtml/string_id.h | 3 +++ src/el_before_after.cpp | 1 + src/html_tag.cpp | 50 ++++++++++++++++++++++++++++++++++++ 4 files changed, 65 insertions(+), 1 deletion(-) diff --git a/include/litehtml/html_tag.h b/include/litehtml/html_tag.h index 71b9cb345..a1a0d6805 100644 --- a/include/litehtml/html_tag.h +++ b/include/litehtml/html_tag.h @@ -22,6 +22,7 @@ namespace litehtml friend class line_box; public: typedef std::shared_ptr ptr; + protected: string_id m_tag; string_id m_id; @@ -31,7 +32,10 @@ namespace litehtml string_map m_attrs; std::vector m_pseudo_classes; - void select_all(const css_selector& selector, elements_vector& res) override; + void select_all(const css_selector& selector, elements_vector& res) override; + + private: + std::map m_counter_values; public: explicit html_tag(const std::shared_ptr& doc); @@ -122,6 +126,12 @@ namespace litehtml string get_list_marker_text(int index); element::ptr get_element_before(const style& style, bool create); element::ptr get_element_after(const style& style, bool create); + string get_counter_value(const string& counter_name); + + private: + void handle_counter_properties(); + void increment_counter(const string& counter_name); + void reset_counter(const string& counter_name); }; /************************************************************************/ diff --git a/include/litehtml/string_id.h b/include/litehtml/string_id.h index 340ac7fbc..1a1dbdd13 100644 --- a/include/litehtml/string_id.h +++ b/include/litehtml/string_id.h @@ -287,6 +287,9 @@ STRING_ID( _flex_grow_, _flex_shrink_, _flex_basis_, + + _counter_reset_, + _counter_increment_, ); #undef STRING_ID extern const string_id empty_id; // _id("") diff --git a/src/el_before_after.cpp b/src/el_before_after.cpp index 4455642e8..655ea1bf3 100644 --- a/src/el_before_after.cpp +++ b/src/el_before_after.cpp @@ -155,6 +155,7 @@ void litehtml::el_before_after_base::add_function( const string& fnc, const stri break; // counter case 1: + add_text(get_counter_value(params)); break; // url case 2: diff --git a/src/html_tag.cpp b/src/html_tag.cpp index aed162de0..bfe282671 100644 --- a/src/html_tag.cpp +++ b/src/html_tag.cpp @@ -1531,9 +1531,59 @@ litehtml::element::ptr litehtml::html_tag::get_element_after(const style& style, return nullptr; } +litehtml::string litehtml::html_tag::get_counter_value(const string& counter_name) +{ + html_tag::ptr current = std::dynamic_pointer_cast(shared_from_this()); + while (current != nullptr) { + auto i = current->m_counter_values.find(counter_name); + if (i != current->m_counter_values.end()) { + return std::to_string(i->second); + } + current = std::dynamic_pointer_cast(current->parent()); + } + return "0"; +} + +void litehtml::html_tag::handle_counter_properties() +{ + const auto& reset_property = m_style.get_property(string_id::_counter_reset_); + if (reset_property.m_type != prop_type_invalid) { + reset_counter(reset_property.m_string); + return; + } + + const auto& inc_property = m_style.get_property(string_id::_counter_increment_); + if (inc_property.m_type != prop_type_invalid) { + increment_counter(inc_property.m_string); + return; + } +} + +void litehtml::html_tag::increment_counter(const string& counter_name) +{ + html_tag::ptr current = std::dynamic_pointer_cast(shared_from_this()); + while (current != nullptr) { + auto i = current->m_counter_values.find(counter_name); + if (i != current->m_counter_values.end()) { + current->m_counter_values[counter_name] = i->second + 1; + return; + } + current = std::dynamic_pointer_cast(current->parent()); + } + + // if counter is not found, initialize one on this element + m_counter_values[counter_name] = 1; +} + +void litehtml::html_tag::reset_counter(const string& counter_name) +{ + m_counter_values[counter_name] = 0; +} + void litehtml::html_tag::add_style(const style& style) { m_style.combine(style); + handle_counter_properties(); } void litehtml::html_tag::refresh_styles() From c6faa2e6c7b869ca0fcef54490a6e29403e9db2b Mon Sep 17 00:00:00 2001 From: MichelCalonder Date: Fri, 8 Dec 2023 19:33:26 +0100 Subject: [PATCH 27/73] fixed issue after merge (due to beautifying, type change from elements-vector to elements-list was not auto-merged) --- include/litehtml/element.h | 4 ++-- include/litehtml/html_tag.h | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/include/litehtml/element.h b/include/litehtml/element.h index e330b5c01..4a3bcad84 100644 --- a/include/litehtml/element.h +++ b/include/litehtml/element.h @@ -33,8 +33,8 @@ namespace litehtml std::list> m_renders; used_selector::vector m_used_styles; - virtual void select_all(const css_selector& selector, elements_list& res); - element::ptr _add_before_after(int type, const style& style); + virtual void select_all(const css_selector& selector, elements_list& res); + element::ptr _add_before_after(int type, const style& style); public: explicit element(const std::shared_ptr& doc); virtual ~element() = default; diff --git a/include/litehtml/html_tag.h b/include/litehtml/html_tag.h index f76d34f9a..e7a6df6c2 100644 --- a/include/litehtml/html_tag.h +++ b/include/litehtml/html_tag.h @@ -32,7 +32,7 @@ namespace litehtml string_map m_attrs; std::vector m_pseudo_classes; - void select_all(const css_selector& selector, elements_vector& res) override; + void select_all(const css_selector& selector, elements_list& res) override; private: std::map m_counter_values; @@ -86,7 +86,7 @@ namespace litehtml size_vector get_size_vector_property (string_id name, bool inherited, const size_vector& default_value, uint_ptr css_properties_member_offset) const override; string get_custom_property(string_id name, const string& default_value) const override; - elements_list& children(); + elements_list& children(); int select(const string& selector) override; int select(const css_selector& selector, bool apply_pseudo = true) override; From 28f72f8a323632dc540af8de1db67039776ad607 Mon Sep 17 00:00:00 2001 From: MichelCalonder Date: Wed, 13 Dec 2023 07:41:16 +0100 Subject: [PATCH 28/73] moved isnumber to html helper functions for later reuse --- include/litehtml/html.h | 4 +++- src/html.cpp | 11 +++++++++++ src/style.cpp | 14 +------------- 3 files changed, 15 insertions(+), 14 deletions(-) diff --git a/include/litehtml/html.h b/include/litehtml/html.h index b184ac30a..cbd0d26b7 100644 --- a/include/litehtml/html.h +++ b/include/litehtml/html.h @@ -36,7 +36,9 @@ namespace litehtml int t_strcasecmp(const char *s1, const char *s2); int t_strncasecmp(const char *s1, const char *s2, size_t n); - + + bool is_number(const string& string, const bool allow_dot = 1); + inline int t_isdigit(int c) { return (c >= '0' && c <= '9'); diff --git a/src/html.cpp b/src/html.cpp index 9695180a7..4c25b9f3d 100644 --- a/src/html.cpp +++ b/src/html.cpp @@ -277,3 +277,14 @@ litehtml::string litehtml::get_escaped_string(const string& in_str) } return ret; } + +bool litehtml::is_number(const string& string, const bool allow_dot) { + for (auto ch : string) + { + if (!(t_isdigit(ch) || (allow_dot && ch == '.'))) + { + return false; + } + } + return true; +} diff --git a/src/style.cpp b/src/style.cpp index 5642d36c4..3c1d37d29 100644 --- a/src/style.cpp +++ b/src/style.cpp @@ -992,18 +992,6 @@ void style::parse_font(const string& val, bool important) void style::parse_flex(const string& val, bool important) { - auto is_number = [](const string& val) - { - for (auto ch : val) - { - if ((ch < '0' || ch > '9') && ch != '.') - { - return false; - } - } - return true; - }; - css_length _auto = css_length::predef_value(flex_basis_auto); if (val == "initial") @@ -1046,7 +1034,7 @@ void style::parse_flex(const string& val, bool important) float grow = t_strtof(tokens[0]); add_parsed_property(_flex_grow_, property_value(grow, important)); - if (is_number(tokens[1])) + if (litehtml::is_number(tokens[1])) { float shrink = t_strtof(tokens[1]); add_parsed_property(_flex_shrink_, property_value(shrink, important)); From 391e71a6effc81d5310f50d5985734aa4440f135 Mon Sep 17 00:00:00 2001 From: MichelCalonder Date: Wed, 13 Dec 2023 07:42:41 +0100 Subject: [PATCH 29/73] started support int values for counter-reset and counter-increment --- include/litehtml/html_tag.h | 6 ++++-- src/html_tag.cpp | 40 ++++++++++++++++++++++++++++--------- src/style.cpp | 9 +++++++++ 3 files changed, 44 insertions(+), 11 deletions(-) diff --git a/include/litehtml/html_tag.h b/include/litehtml/html_tag.h index e7a6df6c2..9a1033e4f 100644 --- a/include/litehtml/html_tag.h +++ b/include/litehtml/html_tag.h @@ -10,6 +10,7 @@ #include "stylesheet.h" #include "line_box.h" #include "table.h" +#include "types.h" namespace litehtml { @@ -126,9 +127,10 @@ namespace litehtml string get_counter_value(const string& counter_name); private: + void parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const; void handle_counter_properties(); - void increment_counter(const string& counter_name); - void reset_counter(const string& counter_name); + void increment_counter(const string& counter_name, const int increment = 1); + void reset_counter(const string& counter_name, const int value = 0); }; /************************************************************************/ diff --git a/src/html_tag.cpp b/src/html_tag.cpp index fe7febdd9..2eb87b9f5 100644 --- a/src/html_tag.cpp +++ b/src/html_tag.cpp @@ -1561,40 +1561,62 @@ litehtml::string litehtml::html_tag::get_counter_value(const string& counter_nam return "0"; } +void litehtml::html_tag::parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const{ + int pos = 0; + while (pos < tokens.size()) { + string name = tokens[pos]; + int value = default_value; + if (pos < tokens.size() - 1 && litehtml::is_number(tokens[pos + 1], 0)) { + value = atoi(tokens[pos + 1].c_str()); + pos += 2; + } + else { + pos += 1; + } + handler(name, value); + } +} + void litehtml::html_tag::handle_counter_properties() { const auto& reset_property = m_style.get_property(string_id::_counter_reset_); - if (reset_property.m_type != prop_type_invalid) { - reset_counter(reset_property.m_string); + if (reset_property.m_type == prop_type_string_vector) { + auto reset_function = [&](const string&name, const int value) { + reset_counter(name, value); + }; + parse_counter_tokens(reset_property.m_string_vector, 0, reset_function); return; } const auto& inc_property = m_style.get_property(string_id::_counter_increment_); - if (inc_property.m_type != prop_type_invalid) { - increment_counter(inc_property.m_string); + if (inc_property.m_type == prop_type_string_vector) { + auto inc_function = [&](const string&name, const int value) { + increment_counter(name, value); + }; + parse_counter_tokens(inc_property.m_string_vector, 1, inc_function); return; } } -void litehtml::html_tag::increment_counter(const string& counter_name) +void litehtml::html_tag::increment_counter(const string& counter_name, const int increment) { html_tag::ptr current = std::dynamic_pointer_cast(shared_from_this()); while (current != nullptr) { auto i = current->m_counter_values.find(counter_name); if (i != current->m_counter_values.end()) { - current->m_counter_values[counter_name] = i->second + 1; + current->m_counter_values[counter_name] = i->second + increment; return; } current = std::dynamic_pointer_cast(current->parent()); } // if counter is not found, initialize one on this element - m_counter_values[counter_name] = 1; + m_counter_values[counter_name] = increment; } -void litehtml::html_tag::reset_counter(const string& counter_name) +void litehtml::html_tag::reset_counter(const string& counter_name, const int value) { - m_counter_values[counter_name] = 0; + m_counter_values[counter_name] = value; } void litehtml::html_tag::add_style(const style& style) diff --git a/src/style.cpp b/src/style.cpp index 3c1d37d29..2e462f486 100644 --- a/src/style.cpp +++ b/src/style.cpp @@ -536,6 +536,15 @@ void style::add_property(string_id name, const string& val, const string& baseur add_parsed_property(_flex_basis_, property_value(length, important)); break; + case _counter_increment_: + case _counter_reset_: + { + string_vector tokens; + split_string(val, tokens, " "); + add_parsed_property(name, property_value(tokens, important)); + break; + } + default: add_parsed_property(name, property_value(val, important)); } From 33b8699a3ccbb8156a52898bfce018b58f48dece Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Sun, 17 Dec 2023 16:46:49 +0300 Subject: [PATCH 30/73] flex layout: support for flex-direction: column --- include/litehtml/render_flex.h | 55 ++++ src/render_flex.cpp | 540 ++++++++++++++++++--------------- 2 files changed, 355 insertions(+), 240 deletions(-) diff --git a/include/litehtml/render_flex.h b/include/litehtml/render_flex.h index 5567e4b4f..885d4789f 100644 --- a/include/litehtml/render_flex.h +++ b/include/litehtml/render_flex.h @@ -7,6 +7,61 @@ namespace litehtml { class render_item_flex : public render_item_block { + struct flex_item + { + std::shared_ptr el; + int base_size; + int min_size; + int max_size; + int main_size; + int grow; + int shrink; + int scaled_flex_shrink_factor; + bool frozen; + flex_align_items align; + + explicit flex_item(std::shared_ptr &_el) : + el(_el), + align(flex_align_items_auto), + grow(0), + base_size(0), + shrink(0), + min_size(0), + frozen(false), + main_size(0), + max_size(0), + scaled_flex_shrink_factor(0) + {} + }; + + struct flex_line + { + std::list items; + int top; + int cross_size; + int base_size; + int total_grow; + int total_shrink; + + flex_line() : + cross_size(0), + top(0), + total_grow(0), + base_size(0), + total_shrink(0) + {} + + void clear() + { + items.clear(); + top = cross_size = base_size = total_shrink = total_grow = 0; + } + + void distribute_free_space(int container_main_size); + }; + + std::list get_lines(const containing_block_context &self_size, formatting_context *fmt_ctx, bool is_row_direction, + int container_main_size); int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; public: diff --git a/src/render_flex.cpp b/src/render_flex.cpp index f70f834e3..33cd0e327 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -2,61 +2,233 @@ #include "types.h" #include "render_flex.h" -namespace litehtml +int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) { - struct flex_item + bool is_row_direction = true; + int container_main_size = self_size.render_width; + if(css().get_flex_direction() == flex_direction_column || css().get_flex_direction() == flex_direction_column_reverse) { - std::shared_ptr el; - int base_size; - int min_size; - int max_size; - int main_size; - int grow; - int shrink; - int scaled_flex_shrink_factor; - bool frozen; - flex_align_items align; + is_row_direction = false; + container_main_size = self_size.height; + } + + // Split flex items to lines + std::list lines = get_lines(self_size, fmt_ctx, is_row_direction, container_main_size); - explicit flex_item(std::shared_ptr &_el) : - el(_el), - align(flex_align_items_auto), - grow(0), - base_size(0), - shrink(0), - min_size(0), - frozen(false), - main_size(0), - max_size(0), - scaled_flex_shrink_factor(0) - {} - }; + // Resolving Flexible Lengths + // REF: https://www.w3.org/TR/css-flexbox-1/#resolve-flexible-lengths - struct flex_line + int el_y = 0; + int el_x = 0; + int ret_width = 0; + for(auto& ln : lines) { - std::list items; - int top; - int cross_size; - int base_size; - int total_grow; - int total_shrink; + ln.cross_size = 0; + + if(is_row_direction) + { + ret_width += ln.base_size; + } - flex_line() : - cross_size(0), - top(0), - total_grow(0), - base_size(0), - total_shrink(0) - {} + ln.distribute_free_space(container_main_size); - void clear() + if(is_row_direction) { - items.clear(); - top = cross_size = base_size = total_shrink = total_grow = 0; + // render items into new size and find line cross_size + for (auto &item: ln.items) + { + item.el->render(el_x, + el_y, + self_size.new_width(item.main_size), fmt_ctx, false); + ln.cross_size = std::max(ln.cross_size, item.el->height()); + el_x += item.el->width(); + } + // Align items + for (auto &item: ln.items) + { + switch (item.align) + { + case flex_align_items_flex_end: + item.el->pos().y = el_y + ln.cross_size - item.el->height() + item.el->content_offset_top(); + break; + case flex_align_items_center: + item.el->pos().y = el_y + ln.cross_size / 2 - item.el->height() /2 + item.el->content_offset_top(); + break; + case flex_align_items_flex_start: + item.el->pos().y = el_y + item.el->content_offset_top(); + break; + default: + item.el->pos().y = el_y + item.el->content_offset_top(); + item.el->pos().height = ln.cross_size - item.el->content_offset_height(); + break; + } + } + el_y += ln.cross_size; + el_x = 0; + m_pos.height = el_y; + } else + { + for (auto &item: ln.items) + { + int el_ret_width = item.el->render(el_x, + el_y, + self_size, fmt_ctx, false); + item.el->render(el_x, + el_y, + self_size.new_width(el_ret_width), fmt_ctx, false); + ln.cross_size = std::max(ln.cross_size, item.el->width()); + el_y += item.el->height(); + } + for (auto &item: ln.items) + { + switch (item.align) + { + case flex_align_items_flex_end: + item.el->pos().x = el_x + ln.cross_size - item.el->width() + item.el->content_offset_left(); + break; + case flex_align_items_center: + item.el->pos().x = el_x + ln.cross_size / 2 - item.el->width() /2 + item.el->content_offset_left(); + break; + case flex_align_items_flex_start: + item.el->pos().x = el_x + item.el->content_offset_left(); + break; + default: + item.el->pos().x = el_x + item.el->content_offset_left(); + item.el->pos().width = ln.cross_size - item.el->content_offset_width(); + break; + } + } + el_x += ln.cross_size; + m_pos.height = std::max(m_pos.height, el_y); + el_y = 0; } - }; + } + // calculate the final position + m_pos.move_to(x, y); + m_pos.x += content_offset_left(); + m_pos.y += content_offset_top(); + + return ret_width + content_offset_width(); } -int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) +void +litehtml::render_item_flex::flex_line::distribute_free_space(int container_main_size) +{ + // Determine the used flex factor. Sum the outer hypothetical main sizes of all items on the line. + // If the sum is less than the flex container’s inner main size, use the flex grow factor for the + // rest of this algorithm; otherwise, use the flex shrink factor. + int initial_free_space = container_main_size - base_size; + bool grow; + int total_flex_factor; + if(initial_free_space < 0) + { + grow = false; + total_flex_factor = total_shrink; + } else + { + grow = true; + total_flex_factor = total_grow; + } + + if(total_flex_factor > 0) + { + bool processed = true; + while (processed) + { + int sum_scaled_flex_shrink_factor = 0; + int sum_flex_factors = 0; + int remaining_free_space = container_main_size; + int total_not_frozen = 0; + for (auto &item: items) + { + if (!item.frozen) + { + sum_scaled_flex_shrink_factor += item.scaled_flex_shrink_factor; + if(grow) + { + sum_flex_factors += item.grow; + } else + { + sum_flex_factors += item.shrink; + } + remaining_free_space -= item.base_size; + total_not_frozen++; + } else + { + remaining_free_space -= item.main_size; + } + } + // Check for flexible items. If all the flex items on the line are frozen, free space has + // been distributed; exit this loop. + if (!total_not_frozen) break; + + remaining_free_space = abs(remaining_free_space); + // c. Distribute free space proportional to the flex factors. + // If the remaining free space is zero + // Do nothing. + if (remaining_free_space) + { + int total_clamped = 0; + for (auto &item: items) + { + if (!item.frozen) + { + if(!grow) + { + // If using the flex shrink factor + // For every unfrozen item on the line, multiply its flex shrink factor by its + // inner flex base size, and note this as its scaled flex shrink factor. Find + // the ratio of the item’s scaled flex shrink factor to the sum of the scaled + // flex shrink factors of all unfrozen items on the line. Set the item’s target + // main size to its flex base size minus a fraction of the absolute value of the + // remaining free space proportional to the ratio. + int scaled_flex_shrink_factor = item.base_size * item.shrink; + item.main_size = (int) ((float) item.base_size - (float) remaining_free_space * + (float) scaled_flex_shrink_factor / + (float) sum_scaled_flex_shrink_factor); + + // d. Fix min/max violations. Clamp each non-frozen item’s target main size by its used + // min and max main sizes and floor its content-box size at zero. If the item’s target + // main size was made smaller by this, it’s a max violation. If the item’s target main + // size was made larger by this, it’s a min violation. + if (item.main_size <= item.min_size) + { + total_clamped++; + item.main_size = item.min_size; + item.frozen = true; + } + } else + { + // If using the flex grow factor + // Find the ratio of the item’s flex grow factor to the sum of the flex grow + // factors of all unfrozen items on the line. Set the item’s target main size to + // its flex base size plus a fraction of the remaining free space proportional + // to the ratio. + item.main_size = (int) ((float) item.base_size + + (float) remaining_free_space * (float) item.grow / + (float) total_flex_factor); + // d. Fix min/max violations. Clamp each non-frozen item’s target main size by its used + // min and max main sizes and floor its content-box size at zero. If the item’s target + // main size was made smaller by this, it’s a max violation. If the item’s target main + // size was made larger by this, it’s a min violation. + if (item.main_size >= container_main_size) + { + total_clamped++; + item.main_size = container_main_size; + item.frozen = true; + } + } + } + } + if (total_clamped == 0) processed = false; + } + } + } +} + +std::list litehtml::render_item_flex::get_lines(const litehtml::containing_block_context &self_size, + litehtml::formatting_context *fmt_ctx, + bool is_row_direction, int container_main_size) { std::list lines; flex_line line; @@ -66,42 +238,95 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.grow = (int) (item.el->css().get_flex_grow() * 1000.0); item.shrink = (int) (item.el->css().get_flex_shrink() * 1000.0); item.el->calc_outlines(self_size.render_width); - if(item.el->css().get_min_width().is_predefined()) - { - item.min_size = el->render(0, 0, self_size.new_width(el->content_offset_width()), fmt_ctx); - } else + if(is_row_direction) { - item.min_size = item.el->css().get_min_width().calc_percent(self_size.render_width) + el->content_offset_width(); - } - if(item.el->css().get_max_width().is_predefined()) - { - item.max_size = self_size.render_width; - } else - { - item.max_size = item.el->css().get_max_width().calc_percent(self_size.render_width) + el->content_offset_width(); - } - if(item.el->css().get_flex_basis().is_predefined()) - { - switch (item.el->css().get_flex_basis().predef()) + if (item.el->css().get_min_width().is_predefined()) { - case flex_basis_auto: - if(!item.el->css().get_width().is_predefined()) - { - item.base_size = item.el->css().get_width().calc_percent(self_size.render_width) + item.el->content_offset_width(); + item.min_size = el->render(0, 0, self_size.new_width(el->content_offset_width()), fmt_ctx); + } else + { + item.min_size = item.el->css().get_min_width().calc_percent(self_size.render_width) + + el->content_offset_width(); + } + if (item.el->css().get_max_width().is_predefined()) + { + item.max_size = self_size.render_width; + } else + { + item.max_size = item.el->css().get_max_width().calc_percent(self_size.render_width) + + el->content_offset_width(); + } + if (item.el->css().get_flex_basis().is_predefined()) + { + switch (item.el->css().get_flex_basis().predef()) + { + case flex_basis_auto: + if (!item.el->css().get_width().is_predefined()) + { + item.base_size = item.el->css().get_width().calc_percent(self_size.render_width) + + item.el->content_offset_width(); + break; + } + case flex_basis_max_content: + case flex_basis_fit_content: + item.base_size = el->render(0, 0, self_size, fmt_ctx); break; - } - case flex_basis_max_content: - case flex_basis_fit_content: - item.base_size = el->render(0, 0, self_size, fmt_ctx); - break; - case flex_basis_min_content: - item.base_size = item.min_size; - break; + case flex_basis_min_content: + item.base_size = item.min_size; + break; + } + } else + { + item.base_size = item.el->css().get_flex_basis().calc_percent(self_size.render_width) + + item.el->content_offset_width(); } } else { - item.base_size = item.el->css().get_flex_basis().calc_percent(self_size.render_width) + item.el->content_offset_width(); + if (item.el->css().get_min_height().is_predefined()) + { + el->render(0, 0, self_size.new_width(self_size.render_width), fmt_ctx); + item.min_size = el->height(); + } else + { + item.min_size = item.el->css().get_min_height().calc_percent(self_size.height) + + el->content_offset_height(); + } + if (item.el->css().get_max_height().is_predefined()) + { + item.max_size = self_size.height; + } else + { + item.max_size = item.el->css().get_max_height().calc_percent(self_size.height) + + el->content_offset_width(); + } + + if (item.el->css().get_flex_basis().is_predefined()) + { + switch (item.el->css().get_flex_basis().predef()) + { + case flex_basis_auto: + if (!item.el->css().get_height().is_predefined()) + { + item.base_size = item.el->css().get_height().calc_percent(self_size.height) + + item.el->content_offset_height(); + break; + } + case flex_basis_max_content: + case flex_basis_fit_content: + el->render(0, 0, self_size, fmt_ctx); + item.base_size = el->height(); + break; + case flex_basis_min_content: + item.base_size = item.min_size; + break; + } + } else + { + item.base_size = item.el->css().get_flex_basis().calc_percent(self_size.height) + + item.el->content_offset_height(); + } } + if(el->css().get_flex_align_self() == flex_align_items_auto) { item.align = css().get_flex_align_items(); @@ -113,7 +338,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.scaled_flex_shrink_factor = item.base_size * item.shrink; // Add flex item to line - if(!line.items.empty() && css().get_flex_wrap() != flex_wrap_nowrap && line.base_size + item.base_size > self_size.render_width) + if(!line.items.empty() && css().get_flex_wrap() != flex_wrap_nowrap && line.base_size + item.base_size > container_main_size) { lines.push_back(line); line.clear(); @@ -135,172 +360,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { lines.push_back(line); } - - // Resolving Flexible Lengths - // REF: https://www.w3.org/TR/css-flexbox-1/#resolve-flexible-lengths - - int el_y = 0; - int ret_width = 0; - for(auto& ln : lines) - { - ln.top = el_y; - ln.cross_size = 0; - int el_x = 0; - - ret_width += ln.base_size; - - // Determine the used flex factor. Sum the outer hypothetical main sizes of all items on the line. - // If the sum is less than the flex container’s inner main size, use the flex grow factor for the - // rest of this algorithm; otherwise, use the flex shrink factor. - int initial_free_space = self_size.render_width - ln.base_size; - bool grow; - int total_flex_factor; - if(initial_free_space < 0) - { - grow = false; - total_flex_factor = ln.total_shrink; - } else - { - grow = true; - total_flex_factor = ln.total_grow; - } - - if(total_flex_factor > 0) - { - bool processed = true; - while (processed) - { - int sum_scaled_flex_shrink_factor = 0; - int sum_flex_factors = 0; - int remaining_free_space = self_size.render_width; - int total_not_frozen = 0; - for (auto &item: ln.items) - { - if (!item.frozen) - { - sum_scaled_flex_shrink_factor += item.scaled_flex_shrink_factor; - if(grow) - { - sum_flex_factors += item.grow; - } else - { - sum_flex_factors += item.shrink; - } - remaining_free_space -= item.base_size; - total_not_frozen++; - } else - { - remaining_free_space -= item.main_size; - } - } - // Check for flexible items. If all the flex items on the line are frozen, free space has - // been distributed; exit this loop. - if (!total_not_frozen) break; - - remaining_free_space = std::abs(remaining_free_space); - // c. Distribute free space proportional to the flex factors. - // If the remaining free space is zero - // Do nothing. - if (remaining_free_space) - { - int total_clamped = 0; - for (auto &item: ln.items) - { - if (!item.frozen) - { - if(!grow) - { - // If using the flex shrink factor - // For every unfrozen item on the line, multiply its flex shrink factor by its - // inner flex base size, and note this as its scaled flex shrink factor. Find - // the ratio of the item’s scaled flex shrink factor to the sum of the scaled - // flex shrink factors of all unfrozen items on the line. Set the item’s target - // main size to its flex base size minus a fraction of the absolute value of the - // remaining free space proportional to the ratio. - int scaled_flex_shrink_factor = item.base_size * item.shrink; - item.main_size = (int) ((float) item.base_size - (float) remaining_free_space * - (float) scaled_flex_shrink_factor / - (float) sum_scaled_flex_shrink_factor); - - // d. Fix min/max violations. Clamp each non-frozen item’s target main size by its used - // min and max main sizes and floor its content-box size at zero. If the item’s target - // main size was made smaller by this, it’s a max violation. If the item’s target main - // size was made larger by this, it’s a min violation. - if (item.main_size <= item.min_size) - { - total_clamped++; - item.main_size = item.min_size; - item.frozen = true; - } - } else - { - // If using the flex grow factor - // Find the ratio of the item’s flex grow factor to the sum of the flex grow - // factors of all unfrozen items on the line. Set the item’s target main size to - // its flex base size plus a fraction of the remaining free space proportional - // to the ratio. - item.main_size = (int) ((float) item.base_size + - (float) remaining_free_space * (float) item.grow / - (float) total_flex_factor); - // d. Fix min/max violations. Clamp each non-frozen item’s target main size by its used - // min and max main sizes and floor its content-box size at zero. If the item’s target - // main size was made smaller by this, it’s a max violation. If the item’s target main - // size was made larger by this, it’s a min violation. - if (item.main_size >= self_size.render_width) - { - total_clamped++; - item.main_size = self_size.render_width; - item.frozen = true; - } - } - } - } - if (total_clamped == 0) processed = false; - } - } - } - - // render items into new width - for(auto& item : ln.items) - { - item.el->render(el_x, - el_y, - self_size.new_width(item.main_size), fmt_ctx, false); - ln.cross_size = std::max(ln.cross_size, item.el->height()); - el_x += item.el->width(); - } - el_y += ln.cross_size; - } - for(auto& ln : lines) - { - for(auto& item : ln.items) - { - switch (item.align) - { - case flex_align_items_flex_end: - item.el->pos().y = ln.top + ln.cross_size - item.el->height() + item.el->content_offset_top(); - break; - case flex_align_items_center: - item.el->pos().y = ln.top + ln.cross_size / 2 - item.el->height() /2 + item.el->content_offset_top(); - break; - case flex_align_items_flex_start: - item.el->pos().y = ln.top + item.el->content_offset_top(); - break; - default: - item.el->pos().y = ln.top + item.el->content_offset_top(); - item.el->pos().height = ln.cross_size - item.el->content_offset_height(); - break; - } - } - } - - // calculate the final position - m_pos.move_to(x, y); - m_pos.x += content_offset_left(); - m_pos.y += content_offset_top(); - m_pos.height = el_y; - - return ret_width + content_offset_width(); + return lines; } std::shared_ptr litehtml::render_item_flex::init() From 3331260d606ef5b3514064a3e106e59db4a5d2aa Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Tue, 19 Dec 2023 01:31:47 +0300 Subject: [PATCH 31/73] flex layout: distribute free cross size to lines --- src/render_flex.cpp | 75 +++++++++++++++++++++++++++++++++++---------- 1 file changed, 59 insertions(+), 16 deletions(-) diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 33cd0e327..32680c285 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -20,6 +20,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, int el_y = 0; int el_x = 0; + int sum_cross_size = 0; int ret_width = 0; for(auto& ln : lines) { @@ -43,7 +44,59 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, ln.cross_size = std::max(ln.cross_size, item.el->height()); el_x += item.el->width(); } - // Align items + sum_cross_size += ln.cross_size; + el_x = 0; + } else + { + for (auto &item: ln.items) + { + int el_ret_width = item.el->render(el_x, + el_y, + self_size, fmt_ctx, false); + item.el->render(el_x, + el_y, + self_size.new_width(el_ret_width), fmt_ctx, false); + ln.cross_size = std::max(ln.cross_size, item.el->width()); + el_y += item.el->height(); + } + sum_cross_size += ln.cross_size; + el_y = 0; + } + } + + int free_cross_size = 0; + int add_cross_size = 0; + if(sum_cross_size) + { + if (is_row_direction) + { + if (self_size.height.type != containing_block_context::cbc_value_type_auto) + { + free_cross_size = self_size.height; + if (src_el()->css().get_box_sizing() == box_sizing_border_box) + { + free_cross_size -= box_sizing_height(); + } + } + } else + { + free_cross_size = self_size.render_width; + } + free_cross_size -= sum_cross_size; + add_cross_size = (int) ((float) free_cross_size / (float) lines.size()); + } + + // Find line cross size and align items + el_x = el_y = 0; + for(auto& ln : lines) + { + if(free_cross_size > 0 && add_cross_size > 0) + { + ln.cross_size += add_cross_size; + free_cross_size -= add_cross_size; + } + if(is_row_direction) + { for (auto &item: ln.items) { switch (item.align) @@ -64,21 +117,9 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } } el_y += ln.cross_size; - el_x = 0; m_pos.height = el_y; } else { - for (auto &item: ln.items) - { - int el_ret_width = item.el->render(el_x, - el_y, - self_size, fmt_ctx, false); - item.el->render(el_x, - el_y, - self_size.new_width(el_ret_width), fmt_ctx, false); - ln.cross_size = std::max(ln.cross_size, item.el->width()); - el_y += item.el->height(); - } for (auto &item: ln.items) { switch (item.align) @@ -94,15 +135,17 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, break; default: item.el->pos().x = el_x + item.el->content_offset_left(); - item.el->pos().width = ln.cross_size - item.el->content_offset_width(); + item.el->render(el_x, + item.el->pos().y - item.el->content_offset_top(), + self_size.new_width(ln.cross_size), fmt_ctx, false); break; } + m_pos.height = item.el->bottom(); } el_x += ln.cross_size; - m_pos.height = std::max(m_pos.height, el_y); - el_y = 0; } } + // calculate the final position m_pos.move_to(x, y); m_pos.x += content_offset_left(); From a81c9272a37804136f2944806f602c4f1bf476c3 Mon Sep 17 00:00:00 2001 From: Charlie Wolf Date: Tue, 19 Dec 2023 11:15:04 -0800 Subject: [PATCH 32/73] add litehtml specific testing options in cmake --- CMakeLists.txt | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/CMakeLists.txt b/CMakeLists.txt index 58a598881..34bbfa30b 100644 --- a/CMakeLists.txt +++ b/CMakeLists.txt @@ -1,8 +1,14 @@ cmake_minimum_required(VERSION 3.11) project(litehtml LANGUAGES C CXX) -include(CTest) -enable_testing() + + +option(LITEHTML_BUILD_TESTING "enable testing for litehtml" ON) + +if(LITEHTML_BUILD_TESTING) + include(CTest) + enable_testing() +endif() # Soname # MAJOR is incremented when symbols are removed or changed in an incompatible way @@ -183,7 +189,7 @@ install(EXPORT litehtmlTargets FILE litehtmlTargets.cmake DESTINATION lib${LIB_S # Tests -if (BUILD_TESTING) +if (LITEHTML_BUILD_TESTING) option(EXTERNAL_GTEST "Use external GoogleTest instead of fetching from GitHub" OFF) if (EXTERNAL_GTEST) From efe03ce82764bc82a5936308561486b95eff11d3 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Wed, 20 Dec 2023 01:16:57 +0300 Subject: [PATCH 33/73] Some fixes * fixed possible stuck in flex rendering * fixed crash in font css parsing * some fixes in render_item::get_element_by_point --- src/css_properties.cpp | 4 ++-- src/element.cpp | 2 ++ src/render_flex.cpp | 20 +++++++++++++++----- src/render_item.cpp | 27 ++++++++++++--------------- src/style.cpp | 16 +++++++++------- 5 files changed, 40 insertions(+), 29 deletions(-) diff --git a/src/css_properties.cpp b/src/css_properties.cpp index 99b6cd92b..7122e4ba9 100644 --- a/src/css_properties.cpp +++ b/src/css_properties.cpp @@ -391,7 +391,7 @@ void litehtml::css_properties::compute_background(const element* el, const docum void litehtml::css_properties::compute_flex(const element* el, const document::ptr& doc) { - if (m_display == display_flex) + if (m_display == display_flex || m_display == display_inline_flex) { m_flex_direction = (flex_direction) el->get_enum_property(_flex_direction_, false, flex_direction_row, offset(m_flex_direction)); m_flex_wrap = (flex_wrap) el->get_enum_property(_flex_wrap_, false, flex_wrap_nowrap, offset(m_flex_wrap)); @@ -401,7 +401,7 @@ void litehtml::css_properties::compute_flex(const element* el, const document::p m_flex_align_content = (flex_align_content) el->get_enum_property(_align_content_, false, flex_align_content_stretch, offset(m_flex_align_content)); } auto parent = el->parent(); - if (parent && parent->css().m_display == display_flex) + if (parent && (parent->css().m_display == display_flex || parent->css().m_display == display_inline_flex)) { m_flex_grow = el->get_number_property(_flex_grow_, false, 0, offset(m_flex_grow)); m_flex_shrink = el->get_number_property(_flex_shrink_, false, 1, offset(m_flex_shrink)); diff --git a/src/element.cpp b/src/element.cpp index 1d0a509b1..3d65d8b88 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -276,6 +276,8 @@ bool element::is_block_formatting_context() const { if( m_css.get_display() == display_inline_block || m_css.get_display() == display_table_cell || + m_css.get_display() == display_inline_flex || + m_css.get_display() == display_flex || m_css.get_display() == display_table_caption || is_root() || m_css.get_float() != float_none || diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 32680c285..3550a35a8 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -56,6 +56,8 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.el->render(el_x, el_y, self_size.new_width(el_ret_width), fmt_ctx, false); + // TODO: must be rendered into the specified height + item.el->pos().height = item.main_size - item.el->content_offset_height(); ln.cross_size = std::max(ln.cross_size, item.el->width()); el_y += item.el->height(); } @@ -81,6 +83,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } else { free_cross_size = self_size.render_width; + ret_width = sum_cross_size; } free_cross_size -= sum_cross_size; add_cross_size = (int) ((float) free_cross_size / (float) lines.size()); @@ -112,6 +115,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, break; default: item.el->pos().y = el_y + item.el->content_offset_top(); + // TODO: must be rendered into the specified height item.el->pos().height = ln.cross_size - item.el->content_offset_height(); break; } @@ -138,6 +142,8 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.el->render(el_x, item.el->pos().y - item.el->content_offset_top(), self_size.new_width(ln.cross_size), fmt_ctx, false); + // TODO: must be rendered into the specified height + item.el->pos().height = item.main_size - item.el->content_offset_height(); break; } m_pos.height = item.el->bottom(); @@ -151,7 +157,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, m_pos.x += content_offset_left(); m_pos.y += content_offset_top(); - return ret_width + content_offset_width(); + return ret_width; } void @@ -209,7 +215,10 @@ litehtml::render_item_flex::flex_line::distribute_free_space(int container_main_ // c. Distribute free space proportional to the flex factors. // If the remaining free space is zero // Do nothing. - if (remaining_free_space) + if (!remaining_free_space) + { + processed = false; + } else { int total_clamped = 0; for (auto &item: items) @@ -322,6 +331,7 @@ std::list litehtml::render_item_flex::get { item.base_size = item.el->css().get_flex_basis().calc_percent(self_size.render_width) + item.el->content_offset_width(); + item.base_size = std::max(item.base_size, item.min_size); } } else { @@ -389,13 +399,13 @@ std::list litehtml::render_item_flex::get line.base_size += item.base_size; line.total_grow += item.grow; line.total_shrink += item.shrink; - if(item.base_size > item.min_size) + //if(item.base_size > item.min_size) { item.frozen = false; - } else + } /*else { item.frozen = true; - } + }*/ line.items.push_back(item); } // Add the last line to the lines list diff --git a/src/render_item.cpp b/src/render_item.cpp index 4eb25757d..6e153d32f 100644 --- a/src/render_item.cpp +++ b/src/render_item.cpp @@ -679,7 +679,7 @@ void litehtml::render_item::draw_children(uint_ptr hdc, int x, int y, const posi if (el->src_el()->is_inline() && el->src_el()->css().get_float() == float_none && !el->src_el()->is_positioned()) { el->src_el()->draw(hdc, pos.x, pos.y, clip, el); - if (el->src_el()->css().get_display() == display_inline_block) + if (el->src_el()->css().get_display() == display_inline_block || el->src_el()->css().get_display() == display_inline_flex) { el->draw_stacking_context(hdc, pos.x, pos.y, clip, false); process = false; @@ -816,7 +816,7 @@ std::shared_ptr litehtml::render_item::get_child_by_point(in } else { if( el->src_el()->css().get_float() == float_none && - el->src_el()->css().get_display() != display_inline_block) + el->src_el()->css().get_display() != display_inline_block && el->src_el()->css().get_display() != display_inline_flex) { element::ptr child = el->get_child_by_point(el_pos.x, el_pos.y, client_x, client_y, flag, zindex); if(child) @@ -845,25 +845,23 @@ std::shared_ptr litehtml::render_item::get_element_by_point(i z_indexes[i->src_el()->css().get_z_index()]; } - for(const auto& zindex : z_indexes) + for(auto iter = z_indexes.rbegin(); iter != z_indexes.rend(); iter++) { - if(zindex.first > 0) + if(iter->first > 0) { - ret = get_child_by_point(x, y, client_x, client_y, draw_positioned, zindex.first); - break; + ret = get_child_by_point(x, y, client_x, client_y, draw_positioned, iter->first); + if(ret) return ret; } } - if(ret) return ret; for(const auto& z_index : z_indexes) { if(z_index.first == 0) { ret = get_child_by_point(x, y, client_x, client_y, draw_positioned, z_index.first); - break; + if(ret) return ret; } } - if(ret) return ret; ret = get_child_by_point(x, y, client_x, client_y, draw_inlines, 0); if(ret) return ret; @@ -875,15 +873,14 @@ std::shared_ptr litehtml::render_item::get_element_by_point(i if(ret) return ret; - for(const auto& z_index : z_indexes) - { - if(z_index.first < 0) + for(auto iter = z_indexes.rbegin(); iter != z_indexes.rend(); iter++) + { + if(iter->first < 0) { - ret = get_child_by_point(x, y, client_x, client_y, draw_positioned, z_index.first); - break; + ret = get_child_by_point(x, y, client_x, client_y, draw_positioned, iter->first); + if(ret) return ret; } } - if(ret) return ret; if(src_el()->css().get_position() == element_position_fixed) { diff --git a/src/style.cpp b/src/style.cpp index e32e7613d..7c4024758 100644 --- a/src/style.cpp +++ b/src/style.cpp @@ -972,14 +972,16 @@ void style::parse_font(const string& val, bool important) { string_vector szlh; split_string(token, szlh, "/"); - - auto size = css_length::from_string(szlh[0], font_size_strings, -1); - add_parsed_property(_font_size_, property_value(size, important)); - - if(szlh.size() == 2) + if(!szlh.empty()) { - auto height = css_length::from_string(szlh[1], "normal", -1); - add_parsed_property(_line_height_, property_value(height, important)); + auto size = css_length::from_string(szlh[0], font_size_strings, -1); + add_parsed_property(_font_size_, property_value(size, important)); + + if (szlh.size() == 2) + { + auto height = css_length::from_string(szlh[1], "normal", -1); + add_parsed_property(_line_height_, property_value(height, important)); + } } } else { From 08bf1aa685882b8018e104cf2c7560b338a2636e Mon Sep 17 00:00:00 2001 From: MichelCalonder Date: Wed, 20 Dec 2023 06:51:15 +0100 Subject: [PATCH 34/73] moved m_counter_values and corresponding functions to element.h --- include/litehtml/element.h | 11 ++++++++ include/litehtml/html_tag.h | 8 +----- src/element.cpp | 50 +++++++++++++++++++++++++++++++++++++ src/html_tag.cpp | 48 ----------------------------------- 4 files changed, 62 insertions(+), 55 deletions(-) diff --git a/include/litehtml/element.h b/include/litehtml/element.h index 4a3bcad84..3da9ed9fe 100644 --- a/include/litehtml/element.h +++ b/include/litehtml/element.h @@ -35,6 +35,10 @@ namespace litehtml virtual void select_all(const css_selector& selector, elements_list& res); element::ptr _add_before_after(int type, const style& style); + + private: + std::map m_counter_values; + public: explicit element(const std::shared_ptr& doc); virtual ~element() = default; @@ -142,6 +146,13 @@ namespace litehtml { return _add_before_after(1, style); } + + string get_counter_value(const string& counter_name); + void increment_counter(const string& counter_name, const int increment = 1); + void reset_counter(const string& counter_name, const int value = 0); + + private: + void parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const; }; ////////////////////////////////////////////////////////////////////////// diff --git a/include/litehtml/html_tag.h b/include/litehtml/html_tag.h index 9a1033e4f..bae21ddc5 100644 --- a/include/litehtml/html_tag.h +++ b/include/litehtml/html_tag.h @@ -35,9 +35,6 @@ namespace litehtml void select_all(const css_selector& selector, elements_list& res) override; - private: - std::map m_counter_values; - public: explicit html_tag(const std::shared_ptr& doc); // constructor for anonymous wrapper boxes @@ -124,13 +121,10 @@ namespace litehtml string get_list_marker_text(int index); element::ptr get_element_before(const style& style, bool create); element::ptr get_element_after(const style& style, bool create); - string get_counter_value(const string& counter_name); private: - void parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const; void handle_counter_properties(); - void increment_counter(const string& counter_name, const int increment = 1); - void reset_counter(const string& counter_name, const int value = 0); + }; /************************************************************************/ diff --git a/src/element.cpp b/src/element.cpp index 1d0a509b1..64cd414a9 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -288,6 +288,56 @@ bool element::is_block_formatting_context() const return false; } +litehtml::string litehtml::element::get_counter_value(const string& counter_name) +{ + element::ptr current = shared_from_this(); + while (current != nullptr) { + auto i = current->m_counter_values.find(counter_name); + if (i != current->m_counter_values.end()) { + return std::to_string(i->second); + } + current = current->parent(); + } + return "0"; +} + +void litehtml::element::parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const { + int pos = 0; + while (pos < tokens.size()) { + string name = tokens[pos]; + int value = default_value; + if (pos < tokens.size() - 1 && litehtml::is_number(tokens[pos + 1], 0)) { + value = atoi(tokens[pos + 1].c_str()); + pos += 2; + } + else { + pos += 1; + } + handler(name, value); + } +} + +void litehtml::element::increment_counter(const string& counter_name, const int increment) +{ + element::ptr current = shared_from_this(); + while (current != nullptr) { + auto i = current->m_counter_values.find(counter_name); + if (i != current->m_counter_values.end()) { + current->m_counter_values[counter_name] = i->second + increment; + return; + } + current = current->parent(); + } + + // if counter is not found, initialize one on this element + m_counter_values[counter_name] = increment; +} + +void litehtml::element::reset_counter(const string& counter_name, const int value) +{ + m_counter_values[counter_name] = value; +} + const background* element::get_background(bool own_only) LITEHTML_RETURN_FUNC(nullptr) void element::add_style( const style& style) LITEHTML_EMPTY_FUNC void element::select_all(const css_selector& selector, elements_list& res) LITEHTML_EMPTY_FUNC diff --git a/src/html_tag.cpp b/src/html_tag.cpp index 2eb87b9f5..b27d6eb6d 100644 --- a/src/html_tag.cpp +++ b/src/html_tag.cpp @@ -1548,34 +1548,6 @@ litehtml::element::ptr litehtml::html_tag::get_element_after(const style& style, return nullptr; } -litehtml::string litehtml::html_tag::get_counter_value(const string& counter_name) -{ - html_tag::ptr current = std::dynamic_pointer_cast(shared_from_this()); - while (current != nullptr) { - auto i = current->m_counter_values.find(counter_name); - if (i != current->m_counter_values.end()) { - return std::to_string(i->second); - } - current = std::dynamic_pointer_cast(current->parent()); - } - return "0"; -} - -void litehtml::html_tag::parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const{ - int pos = 0; - while (pos < tokens.size()) { - string name = tokens[pos]; - int value = default_value; - if (pos < tokens.size() - 1 && litehtml::is_number(tokens[pos + 1], 0)) { - value = atoi(tokens[pos + 1].c_str()); - pos += 2; - } - else { - pos += 1; - } - handler(name, value); - } -} void litehtml::html_tag::handle_counter_properties() { @@ -1598,26 +1570,6 @@ void litehtml::html_tag::handle_counter_properties() } } -void litehtml::html_tag::increment_counter(const string& counter_name, const int increment) -{ - html_tag::ptr current = std::dynamic_pointer_cast(shared_from_this()); - while (current != nullptr) { - auto i = current->m_counter_values.find(counter_name); - if (i != current->m_counter_values.end()) { - current->m_counter_values[counter_name] = i->second + increment; - return; - } - current = std::dynamic_pointer_cast(current->parent()); - } - - // if counter is not found, initialize one on this element - m_counter_values[counter_name] = increment; -} - -void litehtml::html_tag::reset_counter(const string& counter_name, const int value) -{ - m_counter_values[counter_name] = value; -} void litehtml::html_tag::add_style(const style& style) { From 95434551e94ac1beff3fee266fe8d7bafe757673 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Wed, 20 Dec 2023 13:50:06 +0300 Subject: [PATCH 35/73] tests: support for subfolders in rendering test --- test/render_test.cpp | 34 +++++++++++++++++++++++++--------- 1 file changed, 25 insertions(+), 9 deletions(-) diff --git a/test/render_test.cpp b/test/render_test.cpp index 62538f019..d041dd869 100644 --- a/test/render_test.cpp +++ b/test/render_test.cpp @@ -13,14 +13,14 @@ using namespace std; vector find_htm_files(); void test(string filename); -const char* test_dir = "../test/render/"; // ctest is run from litehtml/build +const char* test_dir = "../test/render"; // ctest is run from litehtml/build //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ using render_test = testing::TestWithParam; TEST_P(render_test, _) { - test(test_dir + GetParam()); + test(string(test_dir) + "/" + GetParam()); } INSTANTIATE_TEST_SUITE_P(, render_test, testing::ValuesIn(find_htm_files())); @@ -28,19 +28,35 @@ INSTANTIATE_TEST_SUITE_P(, render_test, testing::ValuesIn(find_htm_files())); void error(const char* msg) { puts(msg); exit(1); } -vector find_htm_files() +void read_dir(const string& subdir, vector& files) { - DIR* dir = opendir(test_dir); - if (!dir) error("Cannot read test directory"); - vector ret; + string full_path = string(test_dir) + "/" + subdir; + DIR* dir = opendir(full_path.c_str()); + if (!dir) error(full_path.c_str()); while (dirent* ent = readdir(dir)) { - if (ent->d_type != DT_REG) continue; // if not regular file string name = ent->d_name; - if (name[0] != '-' && name.size() > 4 && name.substr(name.size() - 4) == ".htm") - ret.push_back(name); + if (ent->d_type == DT_DIR) + { + if(name != "." && name != "..") + { + read_dir(subdir + "/" + name, files); + } + } else + { + if (ent->d_type != DT_REG) continue; // if not regular file + if (name[0] != '-' && name.size() > 4 && + (name.substr(name.size() - 4) == ".htm" || name.substr(name.size() - 5) == ".html")) + files.push_back(subdir + "/" + name); + } } closedir(dir); +} + +vector find_htm_files() +{ + vector ret; + read_dir("", ret); sort(ret.begin(), ret.end()); return ret; } From 90b3dff03c1c57e75753c7b829b5699b823f74ab Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Thu, 21 Dec 2023 02:24:11 +0300 Subject: [PATCH 36/73] added support for start, end values for align_items css property --- include/litehtml/types.h | 5 ++++- src/css_properties.cpp | 2 +- src/render_flex.cpp | 28 +++++++++++++++++++++++++--- 3 files changed, 30 insertions(+), 5 deletions(-) diff --git a/include/litehtml/types.h b/include/litehtml/types.h index 50eaf1c40..af1de44eb 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -859,13 +859,16 @@ namespace litehtml flex_justify_content_space_around }; -#define flex_align_items_strings "flex-start;flex-end;center;baseline;stretch;auto" +#define flex_align_items_strings "normal;flex-start;flex-end;center;start;end;baseline;stretch;auto" enum flex_align_items { + flex_align_items_flex_normal, flex_align_items_flex_start, flex_align_items_flex_end, flex_align_items_center, + flex_align_items_start, + flex_align_items_end, flex_align_items_baseline, flex_align_items_stretch, flex_align_items_auto // used for align-self property only diff --git a/src/css_properties.cpp b/src/css_properties.cpp index 7122e4ba9..3db200711 100644 --- a/src/css_properties.cpp +++ b/src/css_properties.cpp @@ -397,7 +397,7 @@ void litehtml::css_properties::compute_flex(const element* el, const document::p m_flex_wrap = (flex_wrap) el->get_enum_property(_flex_wrap_, false, flex_wrap_nowrap, offset(m_flex_wrap)); m_flex_justify_content = (flex_justify_content) el->get_enum_property(_justify_content_, false, flex_justify_content_flex_start, offset(m_flex_justify_content)); - m_flex_align_items = (flex_align_items) el->get_enum_property(_align_items_, false, flex_align_items_stretch, offset(m_flex_align_items)); + m_flex_align_items = (flex_align_items) el->get_enum_property(_align_items_, false, flex_align_items_flex_normal, offset(m_flex_align_items)); m_flex_align_content = (flex_align_content) el->get_enum_property(_align_content_, false, flex_align_content_stretch, offset(m_flex_align_content)); } auto parent = el->parent(); diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 3550a35a8..da417166b 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -5,11 +5,29 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) { bool is_row_direction = true; + bool reverse = false; int container_main_size = self_size.render_width; - if(css().get_flex_direction() == flex_direction_column || css().get_flex_direction() == flex_direction_column_reverse) + + switch (css().get_flex_direction()) { - is_row_direction = false; - container_main_size = self_size.height; + case flex_direction_column: + is_row_direction = false; + reverse = false; + container_main_size = self_size.height; + break; + case flex_direction_column_reverse: + is_row_direction = false; + reverse = true; + container_main_size = self_size.height; + break; + case flex_direction_row: + is_row_direction = true; + reverse = false; + break; + case flex_direction_row_reverse: + is_row_direction = true; + reverse = true; + break; } // Split flex items to lines @@ -105,12 +123,14 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, switch (item.align) { case flex_align_items_flex_end: + case flex_align_items_end: item.el->pos().y = el_y + ln.cross_size - item.el->height() + item.el->content_offset_top(); break; case flex_align_items_center: item.el->pos().y = el_y + ln.cross_size / 2 - item.el->height() /2 + item.el->content_offset_top(); break; case flex_align_items_flex_start: + case flex_align_items_start: item.el->pos().y = el_y + item.el->content_offset_top(); break; default: @@ -129,11 +149,13 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, switch (item.align) { case flex_align_items_flex_end: + case flex_align_items_end: item.el->pos().x = el_x + ln.cross_size - item.el->width() + item.el->content_offset_left(); break; case flex_align_items_center: item.el->pos().x = el_x + ln.cross_size / 2 - item.el->width() /2 + item.el->content_offset_left(); break; + case flex_align_items_start: case flex_align_items_flex_start: item.el->pos().x = el_x + item.el->content_offset_left(); break; From ff6aa5fcc5280ae22a7ea9bff645fb0b41872211 Mon Sep 17 00:00:00 2001 From: MichelCalonder Date: Thu, 21 Dec 2023 18:42:48 +0100 Subject: [PATCH 37/73] included siblings in search so exapmple 2 (H1/H2, not nested) works too --- include/litehtml/element.h | 6 ++-- src/element.cpp | 66 +++++++++++++++++++++++++++++--------- 2 files changed, 54 insertions(+), 18 deletions(-) diff --git a/include/litehtml/element.h b/include/litehtml/element.h index 3da9ed9fe..e9cfbafd6 100644 --- a/include/litehtml/element.h +++ b/include/litehtml/element.h @@ -37,7 +37,7 @@ namespace litehtml element::ptr _add_before_after(int type, const style& style); private: - std::map m_counter_values; + std::map m_counter_values; public: explicit element(const std::shared_ptr& doc); @@ -152,7 +152,9 @@ namespace litehtml void reset_counter(const string& counter_name, const int value = 0); private: - void parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const; + std::vector get_siblings_before() const; + bool find_counter(const string& counter_name, std::map::iterator& map_iterator); + void parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const; }; ////////////////////////////////////////////////////////////////////////// diff --git a/src/element.cpp b/src/element.cpp index 64cd414a9..310b5e59d 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -290,17 +290,55 @@ bool element::is_block_formatting_context() const litehtml::string litehtml::element::get_counter_value(const string& counter_name) { + std::map::iterator i; + if (find_counter(counter_name, i)) + { + return std::to_string(i->second); + } + return "0"; +} + +bool litehtml::element::find_counter(const string& counter_name, std::map::iterator& map_iterator) { element::ptr current = shared_from_this(); - while (current != nullptr) { - auto i = current->m_counter_values.find(counter_name); - if (i != current->m_counter_values.end()) { - return std::to_string(i->second); + + // search upwards + while (current != nullptr) + { + map_iterator = current->m_counter_values.find(counter_name); + if (map_iterator != current->m_counter_values.end()) { + return true; + } + + // on each level, search previous siblings too + std::vector siblings = current->get_siblings_before(); + std::reverse(siblings.begin(), siblings.end()); + for (const element::ptr& sibling : siblings) { + map_iterator = sibling->m_counter_values.find(counter_name); + if (map_iterator != sibling->m_counter_values.end()) { + return true; + } } current = current->parent(); } - return "0"; + + return false; } +std::vector litehtml::element::get_siblings_before() const +{ + std::vector siblings; + if (parent() != nullptr) { + for (const element::ptr& sybling : parent()->children()) { + if (sybling == shared_from_this()) { + break; + } + siblings.push_back(sybling); + } + } + return siblings; +} + + void litehtml::element::parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const { int pos = 0; while (pos < tokens.size()) { @@ -319,18 +357,14 @@ void litehtml::element::parse_counter_tokens(const string_vector& tokens, const void litehtml::element::increment_counter(const string& counter_name, const int increment) { - element::ptr current = shared_from_this(); - while (current != nullptr) { - auto i = current->m_counter_values.find(counter_name); - if (i != current->m_counter_values.end()) { - current->m_counter_values[counter_name] = i->second + increment; - return; - } - current = current->parent(); + std::map::iterator i; + if (find_counter(counter_name, i)) { + i->second = i->second + increment; + } + else { + // if counter is not found, initialize one on this element + m_counter_values[counter_name] = increment; } - - // if counter is not found, initialize one on this element - m_counter_values[counter_name] = increment; } void litehtml::element::reset_counter(const string& counter_name, const int value) From 709855c1dc8277a3af21243e6c062641f774f452 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Thu, 21 Dec 2023 23:53:36 +0300 Subject: [PATCH 38/73] fix test container base path --- containers/test/test_container.cpp | 2 +- test/render_test.cpp | 11 ++++++++++- 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/containers/test/test_container.cpp b/containers/test/test_container.cpp index c712fb1c8..c3e2a8b61 100644 --- a/containers/test/test_container.cpp +++ b/containers/test/test_container.cpp @@ -84,7 +84,7 @@ void test_container::draw_list_marker(uint_ptr hdc, const list_marker& marker) void test_container::import_css(string& text, const string& url, string& baseurl) { - baseurl = basedir + url; + baseurl = basedir + "/" + url; text = readfile(baseurl); } diff --git a/test/render_test.cpp b/test/render_test.cpp index d041dd869..d4f7213e6 100644 --- a/test/render_test.cpp +++ b/test/render_test.cpp @@ -85,7 +85,16 @@ void test(string filename) string html = readfile(filename); int width = 800, height = 1600; // image will be cropped to content_width/content_height - test_container container(width, height, test_dir); + auto last_slash_pos = filename.find_last_of('/'); + string base_path; + if(last_slash_pos != string::npos) + { + base_path = filename.substr(0, last_slash_pos); + } else + { + base_path = test_dir; + } + test_container container(width, height, base_path); auto doc = document::createFromString(html.c_str(), &container); doc->render(width); From d764b9fa642c20ddfc64d4c65e93d32954a1cdfc Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Fri, 22 Dec 2023 01:23:38 +0300 Subject: [PATCH 39/73] added support row-reverse and column-reverse for flex-direction --- include/litehtml/render_flex.h | 8 +++--- src/render_flex.cpp | 47 +++++++++++++++++++++++++++++++++- 2 files changed, 51 insertions(+), 4 deletions(-) diff --git a/include/litehtml/render_flex.h b/include/litehtml/render_flex.h index 885d4789f..c2bf03174 100644 --- a/include/litehtml/render_flex.h +++ b/include/litehtml/render_flex.h @@ -38,7 +38,8 @@ namespace litehtml { std::list items; int top; - int cross_size; + int main_size; // sum of all items main size + int cross_size; // sum of all items cross size int base_size; int total_grow; int total_shrink; @@ -48,13 +49,14 @@ namespace litehtml top(0), total_grow(0), base_size(0), - total_shrink(0) + total_shrink(0), + main_size(0) {} void clear() { items.clear(); - top = cross_size = base_size = total_shrink = total_grow = 0; + top = cross_size = main_size = base_size = total_shrink = total_grow = 0; } void distribute_free_space(int container_main_size); diff --git a/src/render_flex.cpp b/src/render_flex.cpp index da417166b..8d59224d6 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -14,11 +14,19 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, is_row_direction = false; reverse = false; container_main_size = self_size.height; + if (css().get_box_sizing() == box_sizing_border_box) + { + container_main_size -= box_sizing_height(); + } break; case flex_direction_column_reverse: is_row_direction = false; reverse = true; container_main_size = self_size.height; + if (css().get_box_sizing() == box_sizing_border_box) + { + container_main_size -= box_sizing_height(); + } break; case flex_direction_row: is_row_direction = true; @@ -43,6 +51,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, for(auto& ln : lines) { ln.cross_size = 0; + ln.main_size =0; if(is_row_direction) { @@ -56,6 +65,8 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, // render items into new size and find line cross_size for (auto &item: ln.items) { + ln.main_size += item.main_size; + item.el->render(el_x, el_y, self_size.new_width(item.main_size), fmt_ctx, false); @@ -68,6 +79,8 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { for (auto &item: ln.items) { + ln.main_size += item.main_size; + int el_ret_width = item.el->render(el_x, el_y, self_size, fmt_ctx, false); @@ -118,8 +131,18 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } if(is_row_direction) { + el_x = reverse ? container_main_size : 0; for (auto &item: ln.items) { + if(!reverse) + { + item.el->pos().x = el_x + item.el->content_offset_left(); + el_x += item.el->width(); + } else + { + el_x -= item.el->width(); + item.el->pos().x = el_x + item.el->content_offset_left(); + } switch (item.align) { case flex_align_items_flex_end: @@ -144,8 +167,30 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, m_pos.height = el_y; } else { + if(!reverse) + { + el_y = 0; + } else + { + if(self_size.height.type == containing_block_context::cbc_value_type_auto) + { + el_y = ln.main_size; + } else + { + el_y = self_size.height; + } + } for (auto &item: ln.items) { + if(!reverse) + { + item.el->pos().y = el_y + item.el->content_offset_top(); + el_y += item.el->height(); + } else + { + el_y -= item.el->height(); + item.el->pos().y = el_y + item.el->content_offset_top(); + } switch (item.align) { case flex_align_items_flex_end: @@ -168,7 +213,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.el->pos().height = item.main_size - item.el->content_offset_height(); break; } - m_pos.height = item.el->bottom(); + m_pos.height = std::max(m_pos.height, item.el->bottom()); } el_x += ln.cross_size; } From 86f2634ddfb40987dfdcb3843b2a9143b8dd4f83 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Fri, 22 Dec 2023 01:57:14 +0300 Subject: [PATCH 40/73] added support for flex-wrap: wrap-reverse --- src/render_flex.cpp | 34 +++++++++++++++++++++++++++++++--- 1 file changed, 31 insertions(+), 3 deletions(-) diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 8d59224d6..f3354e392 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -117,11 +117,25 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, ret_width = sum_cross_size; } free_cross_size -= sum_cross_size; + sum_cross_size += free_cross_size; add_cross_size = (int) ((float) free_cross_size / (float) lines.size()); } // Find line cross size and align items el_x = el_y = 0; + bool is_wrap_reverse = css().get_flex_wrap() == flex_wrap_wrap_reverse; + + if(is_wrap_reverse) + { + if(is_row_direction) + { + el_y = sum_cross_size; + } else + { + el_x = sum_cross_size; + } + } + for(auto& ln : lines) { if(free_cross_size > 0 && add_cross_size > 0) @@ -132,6 +146,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, if(is_row_direction) { el_x = reverse ? container_main_size : 0; + if(is_wrap_reverse) + { + el_y -= ln.cross_size; + } for (auto &item: ln.items) { if(!reverse) @@ -162,9 +180,12 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.el->pos().height = ln.cross_size - item.el->content_offset_height(); break; } + m_pos.height = std::max(m_pos.height, item.el->bottom()); + } + if(!is_wrap_reverse) + { + el_y += ln.cross_size; } - el_y += ln.cross_size; - m_pos.height = el_y; } else { if(!reverse) @@ -180,6 +201,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, el_y = self_size.height; } } + if(is_wrap_reverse) + { + el_x -= ln.cross_size; + } for (auto &item: ln.items) { if(!reverse) @@ -215,7 +240,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } m_pos.height = std::max(m_pos.height, item.el->bottom()); } - el_x += ln.cross_size; + if(!is_wrap_reverse) + { + el_x += ln.cross_size; + } } } From 4b633c6487ffea61fe34b78325dd436b67f9717f Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Fri, 22 Dec 2023 02:34:09 +0300 Subject: [PATCH 41/73] container_linux: don't draw background image with zero size --- containers/linux/container_linux.cpp | 2 ++ 1 file changed, 2 insertions(+) diff --git a/containers/linux/container_linux.cpp b/containers/linux/container_linux.cpp index 77954eb3a..5c17d424b 100644 --- a/containers/linux/container_linux.cpp +++ b/containers/linux/container_linux.cpp @@ -314,6 +314,8 @@ void container_linux::draw_background( litehtml::uint_ptr hdc, const std::vector { const auto& bg = bgvec[i]; + if(bg.image_size.height == 0 || bg.image_size.width == 0) continue; + cairo_rectangle(cr, bg.clip_box.x, bg.clip_box.y, bg.clip_box.width, bg.clip_box.height); cairo_clip(cr); From 5eaf3afbd36af82bdd5d8b2c03a749cd8892816c Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Sat, 23 Dec 2023 02:32:23 +0300 Subject: [PATCH 42/73] flex: added support for the justify-content property --- src/render_flex.cpp | 121 +++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 119 insertions(+), 2 deletions(-) diff --git a/src/render_flex.cpp b/src/render_flex.cpp index f3354e392..f2da0b8a2 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -2,6 +2,85 @@ #include "types.h" #include "render_flex.h" +namespace litehtml +{ + class flex_justify_content_spread + { + flex_justify_content m_type; + int m_num_items; + int m_free_space; + public: + flex_justify_content_spread(flex_justify_content type, int num_items, int free_space) : + m_type(type), m_num_items(num_items), m_free_space(0) + { + set_free_space(free_space); + } + + void set_free_space(int free_space) + { + m_free_space = free_space; + switch (m_type) + { + + case flex_justify_content_space_between: + // If the leftover free-space is negative or there is only a single flex item on the line, this + // value is identical to flex-start. + if(m_num_items == 1 || m_free_space < 0) m_type = flex_justify_content_flex_start; + break; + case flex_justify_content_space_around: + // If the leftover free-space is negative or there is only a single flex item on the line, this + // value is identical to center + if(m_num_items == 1 || m_free_space < 0) m_type = flex_justify_content_center; + break; + default: + break; + } + } + + int start() + { + switch (m_type) + { + case flex_justify_content_flex_end: + return m_free_space; + case flex_justify_content_center: + return m_free_space / 2; + case flex_justify_content_space_between: + case flex_justify_content_space_around: + default: + // using flex-start b y default + return 0; + } + } + + int before_item() + { + switch (m_type) + { + case flex_justify_content_space_between: + return 0; + case flex_justify_content_space_around: + return m_free_space / (m_num_items * 2); + default: + return 0; + } + } + + int after_item() + { + switch (m_type) + { + case flex_justify_content_space_between: + return m_free_space / (m_num_items - 1); + case flex_justify_content_space_around: + return m_free_space / (m_num_items * 2); + default: + return 0; + } + } + }; +} + int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) { bool is_row_direction = true; @@ -143,21 +222,34 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, ln.cross_size += add_cross_size; free_cross_size -= add_cross_size; } + flex_justify_content_spread content_spread(css().get_flex_justify_content(), + (int) ln.items.size(), + container_main_size - ln.main_size); if(is_row_direction) { - el_x = reverse ? container_main_size : 0; if(is_wrap_reverse) { el_y -= ln.cross_size; } + if(reverse) + { + el_x = container_main_size - content_spread.start(); + } else + { + el_x = content_spread.start(); + } for (auto &item: ln.items) { if(!reverse) { + // justify content [before_item] + el_x += content_spread.before_item(); item.el->pos().x = el_x + item.el->content_offset_left(); el_x += item.el->width(); } else { + // justify content [before_item] + el_x -= content_spread.before_item(); el_x -= item.el->width(); item.el->pos().x = el_x + item.el->content_offset_left(); } @@ -181,6 +273,14 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, break; } m_pos.height = std::max(m_pos.height, item.el->bottom()); + // justify content [after_item] + if(!reverse) + { + el_x += content_spread.after_item(); + } else + { + el_x -= content_spread.after_item(); + } } if(!is_wrap_reverse) { @@ -190,16 +290,19 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { if(!reverse) { - el_y = 0; + el_y = content_spread.start(); } else { if(self_size.height.type == containing_block_context::cbc_value_type_auto) { + content_spread.set_free_space(0); el_y = ln.main_size; } else { + content_spread.set_free_space(self_size.height - ln.main_size); el_y = self_size.height; } + el_y -= content_spread.start(); } if(is_wrap_reverse) { @@ -209,10 +312,16 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { if(!reverse) { + // justify content [before_item] + el_y += content_spread.before_item(); + item.el->pos().y = el_y + item.el->content_offset_top(); el_y += item.el->height(); } else { + // justify content [before_item] + el_y -= content_spread.before_item(); + el_y -= item.el->height(); item.el->pos().y = el_y + item.el->content_offset_top(); } @@ -239,6 +348,14 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, break; } m_pos.height = std::max(m_pos.height, item.el->bottom()); + // justify content [after_item] + if(!reverse) + { + el_y += content_spread.after_item(); + } else + { + el_y -= content_spread.after_item(); + } } if(!is_wrap_reverse) { From bf940939d8da6fb9b7390cbc2db90dde9a7ce0a4 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Sat, 23 Dec 2023 03:49:38 +0300 Subject: [PATCH 43/73] flex: added order property support --- include/litehtml/css_properties.h | 17 ++++++++++++- include/litehtml/element.h | 1 + include/litehtml/html_tag.h | 1 + include/litehtml/render_flex.h | 11 +++++++++ include/litehtml/string_id.h | 1 + src/css_properties.cpp | 2 ++ src/element.cpp | 1 + src/html_tag.cpp | 5 ++++ src/render_flex.cpp | 40 +++++++++++++++++++++++-------- src/style.cpp | 4 ++++ 10 files changed, 72 insertions(+), 11 deletions(-) diff --git a/include/litehtml/css_properties.h b/include/litehtml/css_properties.h index c0c9be49d..a5609a9b1 100644 --- a/include/litehtml/css_properties.h +++ b/include/litehtml/css_properties.h @@ -72,6 +72,8 @@ namespace litehtml caption_side m_caption_side; + int m_order; + private: void compute_font(const element* el, const std::shared_ptr& doc); void compute_background(const element* el, const std::shared_ptr& doc); @@ -120,7 +122,8 @@ namespace litehtml m_flex_justify_content(flex_justify_content_flex_start), m_flex_align_items(flex_align_items_stretch), m_flex_align_self(flex_align_items_auto), - m_flex_align_content(flex_align_content_stretch) + m_flex_align_content(flex_align_content_stretch), + m_order(0) {} void compute(const element* el, const std::shared_ptr& doc); @@ -252,6 +255,9 @@ namespace litehtml flex_align_items get_flex_align_items() const; flex_align_items get_flex_align_self() const; flex_align_content get_flex_align_content() const; + + int get_order() const; + void set_order(int order); }; inline element_position css_properties::get_position() const @@ -653,6 +659,15 @@ namespace litehtml m_caption_side = side; } + inline int css_properties::get_order() const + { + return m_order; + } + + inline void css_properties::set_order(int order) + { + m_order = order; + } } #endif //LITEHTML_CSS_PROPERTIES_H diff --git a/include/litehtml/element.h b/include/litehtml/element.h index e330b5c01..1dae223f6 100644 --- a/include/litehtml/element.h +++ b/include/litehtml/element.h @@ -99,6 +99,7 @@ namespace litehtml virtual void draw(uint_ptr hdc, int x, int y, const position *clip, const std::shared_ptr& ri); virtual void draw_background(uint_ptr hdc, int x, int y, const position *clip, const std::shared_ptr &ri); virtual int get_enum_property (string_id name, bool inherited, int default_value, uint_ptr css_properties_member_offset) const; + virtual int get_int_property (string_id name, bool inherited, int default_value, uint_ptr css_properties_member_offset) const; virtual css_length get_length_property(string_id name, bool inherited, css_length default_value, uint_ptr css_properties_member_offset) const; virtual web_color get_color_property (string_id name, bool inherited, web_color default_value, uint_ptr css_properties_member_offset) const; virtual string get_string_property(string_id name, bool inherited, const string& default_value, uint_ptr css_properties_member_offset) const; diff --git a/include/litehtml/html_tag.h b/include/litehtml/html_tag.h index 9148031b2..b7fe78f4b 100644 --- a/include/litehtml/html_tag.h +++ b/include/litehtml/html_tag.h @@ -72,6 +72,7 @@ namespace litehtml template const Type& get_property_impl (string_id name, bool inherited, const Type& default_value, uint_ptr css_properties_member_offset) const; int get_enum_property (string_id name, bool inherited, int default_value, uint_ptr css_properties_member_offset) const override; + int get_int_property (string_id name, bool inherited, int default_value, uint_ptr css_properties_member_offset) const override; css_length get_length_property(string_id name, bool inherited, css_length default_value, uint_ptr css_properties_member_offset) const override; web_color get_color_property (string_id name, bool inherited, web_color default_value, uint_ptr css_properties_member_offset) const override; string get_string_property(string_id name, bool inherited, const string& default_value, uint_ptr css_properties_member_offset) const override; diff --git a/include/litehtml/render_flex.h b/include/litehtml/render_flex.h index c2bf03174..7307c7d27 100644 --- a/include/litehtml/render_flex.h +++ b/include/litehtml/render_flex.h @@ -18,6 +18,8 @@ namespace litehtml int shrink; int scaled_flex_shrink_factor; bool frozen; + int order; + int src_order; flex_align_items align; explicit flex_item(std::shared_ptr &_el) : @@ -30,8 +32,17 @@ namespace litehtml frozen(false), main_size(0), max_size(0), + order(0), + src_order(0), scaled_flex_shrink_factor(0) {} + + bool operator<(const flex_item& b) const + { + if(order < b.order) return true; + if(order == b.order) return src_order < b.src_order; + return false; + } }; struct flex_line diff --git a/include/litehtml/string_id.h b/include/litehtml/string_id.h index 60d30f5e4..20d8275af 100644 --- a/include/litehtml/string_id.h +++ b/include/litehtml/string_id.h @@ -289,6 +289,7 @@ STRING_ID( _flex_basis_, _caption_side_, + _order_, ); #undef STRING_ID extern const string_id empty_id; // _id("") diff --git a/src/css_properties.cpp b/src/css_properties.cpp index 3db200711..1dc16dab0 100644 --- a/src/css_properties.cpp +++ b/src/css_properties.cpp @@ -240,6 +240,8 @@ void litehtml::css_properties::compute(const element* el, const document::ptr& d doc->container()->load_image(m_list_style_image.c_str(), m_list_style_image_baseurl.c_str(), true); } + m_order = el->get_int_property(_order_, false, 0, offset(m_order)); + compute_background(el, doc); compute_flex(el, doc); } diff --git a/src/element.cpp b/src/element.cpp index 3d65d8b88..435c20f9a 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -334,6 +334,7 @@ bool element::is_replaced() const LITEHTML_RETURN_FUNC(false) void element::draw(uint_ptr hdc, int x, int y, const position *clip, const std::shared_ptr &ri) LITEHTML_EMPTY_FUNC void element::draw_background(uint_ptr hdc, int x, int y, const position *clip, const std::shared_ptr &ri) LITEHTML_EMPTY_FUNC int element::get_enum_property (string_id name, bool inherited, int defval, uint_ptr css_properties_member_offset) const LITEHTML_RETURN_FUNC(0) +int element::get_int_property (string_id name, bool inherited, int defval, uint_ptr css_properties_member_offset) const LITEHTML_RETURN_FUNC(0) css_length element::get_length_property (string_id name, bool inherited, css_length defval, uint_ptr css_properties_member_offset) const LITEHTML_RETURN_FUNC(0) web_color element::get_color_property (string_id name, bool inherited, web_color defval, uint_ptr css_properties_member_offset) const LITEHTML_RETURN_FUNC(web_color()) string element::get_string_property (string_id name, bool inherited, const string& defval, uint_ptr css_properties_member_offset) const LITEHTML_RETURN_FUNC("") diff --git a/src/html_tag.cpp b/src/html_tag.cpp index 0b978f56a..30828b2b0 100644 --- a/src/html_tag.cpp +++ b/src/html_tag.cpp @@ -367,6 +367,11 @@ int litehtml::html_tag::get_enum_property(string_id name, bool inherited, int de return get_property_impl(name, inherited, default_value, css_properties_member_offset); } +int litehtml::html_tag::get_int_property(string_id name, bool inherited, int default_value, uint_ptr css_properties_member_offset) const +{ + return get_property_impl(name, inherited, default_value, css_properties_member_offset); +} + litehtml::css_length litehtml::html_tag::get_length_property(string_id name, bool inherited, css_length default_value, uint_ptr css_properties_member_offset) const { return get_property_impl(name, inherited, default_value, css_properties_member_offset); diff --git a/src/render_flex.cpp b/src/render_flex.cpp index f2da0b8a2..acafbf5de 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -496,13 +496,29 @@ std::list litehtml::render_item_flex::get { std::list lines; flex_line line; + std::list items; + int src_order = 0; + bool sort_required = false; + def_value prev_order(0); + for( auto& el : m_children) { flex_item item(el); item.grow = (int) (item.el->css().get_flex_grow() * 1000.0); item.shrink = (int) (item.el->css().get_flex_shrink() * 1000.0); item.el->calc_outlines(self_size.render_width); - if(is_row_direction) + item.order = item.el->css().get_order(); + item.src_order = src_order++; + + if(prev_order.is_default()) + { + prev_order = item.order; + } else if(!sort_required && item.order != prev_order) + { + sort_required = true; + } + + if (is_row_direction) { if (item.el->css().get_min_width().is_predefined()) { @@ -592,7 +608,7 @@ std::list litehtml::render_item_flex::get } } - if(el->css().get_flex_align_self() == flex_align_items_auto) + if (el->css().get_flex_align_self() == flex_align_items_auto) { item.align = css().get_flex_align_items(); } else @@ -601,8 +617,19 @@ std::list litehtml::render_item_flex::get } item.main_size = item.base_size; item.scaled_flex_shrink_factor = item.base_size * item.shrink; + item.frozen = false; - // Add flex item to line + items.push_back(item); + } + + if(sort_required) + { + items.sort(); + } + + // Add flex items to lines + for(auto& item : items) + { if(!line.items.empty() && css().get_flex_wrap() != flex_wrap_nowrap && line.base_size + item.base_size > container_main_size) { lines.push_back(line); @@ -611,13 +638,6 @@ std::list litehtml::render_item_flex::get line.base_size += item.base_size; line.total_grow += item.grow; line.total_shrink += item.shrink; - //if(item.base_size > item.min_size) - { - item.frozen = false; - } /*else - { - item.frozen = true; - }*/ line.items.push_back(item); } // Add the last line to the lines list diff --git a/src/style.cpp b/src/style.cpp index 7c4024758..f491231d8 100644 --- a/src/style.cpp +++ b/src/style.cpp @@ -536,6 +536,10 @@ void style::add_property(string_id name, const string& val, const string& baseur add_parsed_property(_flex_basis_, property_value(length, important)); break; + case _order_: // + add_parsed_property(name, property_value(atoi(val.c_str()), important)); + break; + default: add_parsed_property(name, property_value(val, important)); } From ce7d5a16fc4a5eb6c1fbe4ba7411b1ceafa46bef Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Sat, 23 Dec 2023 17:31:09 +0300 Subject: [PATCH 44/73] flex: added support for align-content property --- include/litehtml/types.h | 4 +- src/render_flex.cpp | 154 ++++++++++++++++++++++++++++++++++----- test/render_test.cpp | 5 +- 3 files changed, 141 insertions(+), 22 deletions(-) diff --git a/include/litehtml/types.h b/include/litehtml/types.h index af1de44eb..44b8f964f 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -874,12 +874,14 @@ namespace litehtml flex_align_items_auto // used for align-self property only }; -#define flex_align_content_strings "flex-start;flex-end;center;space-between;space-around;stretch" +#define flex_align_content_strings "flex-start;start;flex-end;end;center;space-between;space-around;stretch" enum flex_align_content { flex_align_content_flex_start, + flex_align_content_start, flex_align_content_flex_end, + flex_align_content_end, flex_align_content_center, flex_align_content_space_between, flex_align_content_space_around, diff --git a/src/render_flex.cpp b/src/render_flex.cpp index acafbf5de..776417b39 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -79,6 +79,107 @@ namespace litehtml } } }; + + class flex_align_content_spread + { + flex_align_content m_type; + int m_num_lines; + int m_free_space; + flex_wrap m_wrap; + public: + flex_align_content_spread(flex_align_content type, flex_wrap wrap, int num_lines, int free_space) : + m_type(type), m_num_lines(num_lines), m_free_space(0), m_wrap(wrap) + { + if(m_wrap == flex_wrap_nowrap) + { + m_type = flex_align_content_stretch; + } + set_free_space(free_space); + } + + void set_free_space(int free_space) + { + m_free_space = free_space; + switch (m_type) + { + + case flex_align_content_space_between: + // If the leftover free-space is negative or there is only a single flex line in the flex + // container, this value is identical to flex-start. + if(m_num_lines == 1 || m_free_space < 0) m_type = flex_align_content_flex_start; + break; + case flex_align_content_space_around: + // If the leftover free-space is negative this value is identical to center. + if(m_num_lines == 1 || m_free_space < 0) m_type = flex_align_content_center; + break; + default: + break; + } + } + + int start() + { + switch (m_type) + { + case flex_align_content_flex_end: + case flex_align_content_end: + return m_free_space; + case flex_align_content_center: + return m_free_space / 2; + case flex_align_content_stretch: + case flex_align_content_space_between: + case flex_align_content_space_around: + default: + // using stretch by default + return 0; + } + } + + int add_line_size() + { + switch (m_type) + { + + case flex_align_content_flex_start: + case flex_align_content_flex_end: + case flex_align_content_start: + case flex_align_content_end: + case flex_align_content_center: + case flex_align_content_space_between: + case flex_align_content_space_around: + return 0; + case flex_align_content_stretch: + default: + return m_free_space / m_num_lines; + } + } + + int before_line() + { + switch (m_type) + { + case flex_align_content_space_between: + return 0; + case flex_align_content_space_around: + return m_free_space / (m_num_lines * 2); + default: + return 0; + } + } + + int after_line() + { + switch (m_type) + { + case flex_align_content_space_between: + return m_free_space / (m_num_lines - 1); + case flex_align_content_space_around: + return m_free_space / (m_num_lines * 2); + default: + return 0; + } + } + }; } int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) @@ -177,51 +278,56 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } int free_cross_size = 0; - int add_cross_size = 0; if(sum_cross_size) { if (is_row_direction) { if (self_size.height.type != containing_block_context::cbc_value_type_auto) { - free_cross_size = self_size.height; + int height = self_size.height; if (src_el()->css().get_box_sizing() == box_sizing_border_box) { - free_cross_size -= box_sizing_height(); + height -= box_sizing_height(); } + free_cross_size = height - sum_cross_size; } } else { - free_cross_size = self_size.render_width; + free_cross_size = self_size.render_width - sum_cross_size; ret_width = sum_cross_size; } - free_cross_size -= sum_cross_size; - sum_cross_size += free_cross_size; - add_cross_size = (int) ((float) free_cross_size / (float) lines.size()); } // Find line cross size and align items el_x = el_y = 0; bool is_wrap_reverse = css().get_flex_wrap() == flex_wrap_wrap_reverse; + flex_align_content_spread lines_spread(css().get_flex_align_content(), css().get_flex_wrap(), (int) lines.size(), free_cross_size); + if(is_wrap_reverse) { if(is_row_direction) { - el_y = sum_cross_size; + el_y = sum_cross_size - lines_spread.start(); + } else + { + el_x = sum_cross_size - lines_spread.start(); + } + } else + { + if(is_row_direction) + { + el_y = lines_spread.start(); } else { - el_x = sum_cross_size; + el_x = lines_spread.start(); } } for(auto& ln : lines) { - if(free_cross_size > 0 && add_cross_size > 0) - { - ln.cross_size += add_cross_size; - free_cross_size -= add_cross_size; - } + ln.cross_size += lines_spread.add_line_size(); + flex_justify_content_spread content_spread(css().get_flex_justify_content(), (int) ln.items.size(), container_main_size - ln.main_size); @@ -229,7 +335,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { if(is_wrap_reverse) { - el_y -= ln.cross_size; + el_y -= ln.cross_size - lines_spread.before_line(); + } else + { + el_y += lines_spread.before_line(); } if(reverse) { @@ -284,7 +393,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } if(!is_wrap_reverse) { - el_y += ln.cross_size; + el_y += ln.cross_size + lines_spread.after_line(); + } else + { + el_y -= lines_spread.after_line(); } } else { @@ -306,7 +418,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } if(is_wrap_reverse) { - el_x -= ln.cross_size; + el_x -= ln.cross_size - lines_spread.before_line(); + } else + { + el_x += lines_spread.before_line(); } for (auto &item: ln.items) { @@ -359,7 +474,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } if(!is_wrap_reverse) { - el_x += ln.cross_size; + el_x += ln.cross_size + lines_spread.after_line(); + } else + { + el_x -= lines_spread.after_line(); } } } diff --git a/test/render_test.cpp b/test/render_test.cpp index d4f7213e6..4c5c7aadc 100644 --- a/test/render_test.cpp +++ b/test/render_test.cpp @@ -38,13 +38,12 @@ void read_dir(const string& subdir, vector& files) string name = ent->d_name; if (ent->d_type == DT_DIR) { - if(name != "." && name != "..") + if(name != "." && name != ".." && name[0] != '-') { read_dir(subdir + "/" + name, files); } - } else + } else if (ent->d_type == DT_REG) { - if (ent->d_type != DT_REG) continue; // if not regular file if (name[0] != '-' && name.size() > 4 && (name.substr(name.size() - 4) == ".htm" || name.substr(name.size() - 5) == ".html")) files.push_back(subdir + "/" + name); From 6922a8497dc8a8fceaff70a71cca487863d27354 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Mon, 25 Dec 2023 01:15:43 +0300 Subject: [PATCH 45/73] flex: fixed rendering issues --- include/litehtml/render_flex.h | 2 +- src/render_flex.cpp | 82 ++++++++++++++++++++-------------- 2 files changed, 50 insertions(+), 34 deletions(-) diff --git a/include/litehtml/render_flex.h b/include/litehtml/render_flex.h index 7307c7d27..897e1dbbb 100644 --- a/include/litehtml/render_flex.h +++ b/include/litehtml/render_flex.h @@ -74,7 +74,7 @@ namespace litehtml }; std::list get_lines(const containing_block_context &self_size, formatting_context *fmt_ctx, bool is_row_direction, - int container_main_size); + int container_main_size, bool single_line); int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; public: diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 776417b39..d97dc62f0 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -193,20 +193,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, case flex_direction_column: is_row_direction = false; reverse = false; - container_main_size = self_size.height; - if (css().get_box_sizing() == box_sizing_border_box) - { - container_main_size -= box_sizing_height(); - } break; case flex_direction_column_reverse: is_row_direction = false; reverse = true; - container_main_size = self_size.height; - if (css().get_box_sizing() == box_sizing_border_box) - { - container_main_size -= box_sizing_height(); - } break; case flex_direction_row: is_row_direction = true; @@ -218,8 +208,29 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, break; } + bool single_line = css().get_flex_wrap() == flex_wrap_nowrap; + bool fit_container = false; + + if(!is_row_direction) + { + if(self_size.height.type != containing_block_context::cbc_value_type_auto) + { + container_main_size = self_size.height; + if (css().get_box_sizing() == box_sizing_border_box) + { + container_main_size -= box_sizing_height(); + } + } else + { + // Direction columns, height is auto - always in single line + container_main_size = 0; + single_line = true; + fit_container = true; + } + } + // Split flex items to lines - std::list lines = get_lines(self_size, fmt_ctx, is_row_direction, container_main_size); + std::list lines = get_lines(self_size, fmt_ctx, is_row_direction, container_main_size, single_line); // Resolving Flexible Lengths // REF: https://www.w3.org/TR/css-flexbox-1/#resolve-flexible-lengths @@ -238,7 +249,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, ret_width += ln.base_size; } - ln.distribute_free_space(container_main_size); + if(!fit_container) + { + ln.distribute_free_space(container_main_size); + } if(is_row_direction) { @@ -267,8 +281,6 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.el->render(el_x, el_y, self_size.new_width(el_ret_width), fmt_ctx, false); - // TODO: must be rendered into the specified height - item.el->pos().height = item.main_size - item.el->content_offset_height(); ln.cross_size = std::max(ln.cross_size, item.el->width()); el_y += item.el->height(); } @@ -278,24 +290,21 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } int free_cross_size = 0; - if(sum_cross_size) + if (is_row_direction) { - if (is_row_direction) + if (self_size.height.type != containing_block_context::cbc_value_type_auto) { - if (self_size.height.type != containing_block_context::cbc_value_type_auto) + int height = self_size.height; + if (src_el()->css().get_box_sizing() == box_sizing_border_box) { - int height = self_size.height; - if (src_el()->css().get_box_sizing() == box_sizing_border_box) - { - height -= box_sizing_height(); - } - free_cross_size = height - sum_cross_size; + height -= box_sizing_height(); } - } else - { - free_cross_size = self_size.render_width - sum_cross_size; - ret_width = sum_cross_size; + free_cross_size = height - sum_cross_size; } + } else + { + free_cross_size = self_size.render_width - sum_cross_size; + ret_width = sum_cross_size; } // Find line cross size and align items @@ -377,8 +386,11 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, break; default: item.el->pos().y = el_y + item.el->content_offset_top(); - // TODO: must be rendered into the specified height - item.el->pos().height = ln.cross_size - item.el->content_offset_height(); + if(item.el->css().get_height().is_predefined()) + { + // TODO: must be rendered into the specified height + item.el->pos().height = ln.cross_size - item.el->content_offset_height(); + } break; } m_pos.height = std::max(m_pos.height, item.el->bottom()); @@ -458,8 +470,11 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.el->render(el_x, item.el->pos().y - item.el->content_offset_top(), self_size.new_width(ln.cross_size), fmt_ctx, false); - // TODO: must be rendered into the specified height - item.el->pos().height = item.main_size - item.el->content_offset_height(); + if(item.el->css().get_width().is_predefined()) + { + // TODO: must be rendered into the specified height + item.el->pos().height = item.main_size - item.el->content_offset_height(); + } break; } m_pos.height = std::max(m_pos.height, item.el->bottom()); @@ -610,7 +625,8 @@ litehtml::render_item_flex::flex_line::distribute_free_space(int container_main_ std::list litehtml::render_item_flex::get_lines(const litehtml::containing_block_context &self_size, litehtml::formatting_context *fmt_ctx, - bool is_row_direction, int container_main_size) + bool is_row_direction, int container_main_size, + bool single_line) { std::list lines; flex_line line; @@ -748,7 +764,7 @@ std::list litehtml::render_item_flex::get // Add flex items to lines for(auto& item : items) { - if(!line.items.empty() && css().get_flex_wrap() != flex_wrap_nowrap && line.base_size + item.base_size > container_main_size) + if(!line.items.empty() && !single_line && line.base_size + item.base_size > container_main_size) { lines.push_back(line); line.clear(); From 85da5869cb5f7a297809ab9ef1557eb6319e24e6 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Mon, 25 Dec 2023 01:16:42 +0300 Subject: [PATCH 46/73] Added tests for Flexible Box Layout All tests are copied from: http://test.csswg.org/suites/css-flexbox-1_dev/nightly-unstable/html/toc.htm Prefixes: "-" - test is using features that litehtml doesn't support yet "--" - all featured should be supported but test failed because of flex rendering implementation issues --- test/render/flex/--align-baseline.htm | 30 ++++ test/render/flex/--align-self-001.htm | 45 +++++ test/render/flex/--align-self-002.htm | 45 +++++ test/render/flex/--align-self-003.htm | 52 ++++++ test/render/flex/--align-self-005.htm | 46 +++++ test/render/flex/--align-self-006.htm | 52 ++++++ test/render/flex/--align-self-007.htm | 47 +++++ test/render/flex/--align-self-008.htm | 46 +++++ test/render/flex/--align-self-009.htm | 53 ++++++ test/render/flex/--align-self-010.htm | 53 ++++++ test/render/flex/--align-self-013.htm | 46 +++++ test/render/flex/--auto-height-with-flex.htm | 14 ++ .../render/flex/--css-box-justify-content.htm | 38 ++++ test/render/flex/--display-flex-001.htm | 36 ++++ test/render/flex/--flex-002.htm | 57 ++++++ test/render/flex/--flex-003.htm | 58 +++++++ test/render/flex/--flex-004.htm | 58 +++++++ test/render/flex/--flex-basis-002.htm | 47 +++++ test/render/flex/--flex-basis-003.htm | 47 +++++ test/render/flex/--flex-basis-004.htm | 49 ++++++ test/render/flex/--flex-basis-005.htm | 34 ++++ test/render/flex/--flex-basis-006.htm | 34 ++++ test/render/flex/--flex-basis-010.htm | 36 ++++ test/render/flex/--flex-basis-011.htm | 30 ++++ .../flex/--flex-direction-row-001-visual.htm | 29 ++++ ...-flex-direction-row-reverse-001-visual.htm | 29 ++++ .../flex/--flex-flexitem-childmargin.htm | 52 ++++++ .../--flex-flexitem-percentage-prescation.htm | 37 ++++ test/render/flex/--flex-flow-004.htm | 40 +++++ test/render/flex/--flex-flow-007.htm | 39 +++++ test/render/flex/--flex-flow-010.htm | 39 +++++ test/render/flex/--flex-grow-001.htm | 46 +++++ test/render/flex/--flex-grow-002.htm | 50 ++++++ test/render/flex/--flex-grow-007.htm | 49 ++++++ test/render/flex/--flex-inline.htm | 33 ++++ .../--flex-minimum-height-flex-items-003.htm | 54 ++++++ .../--flex-minimum-height-flex-items-011.htm | 54 ++++++ test/render/flex/--flex-shrink-001.htm | 47 +++++ test/render/flex/--flex-shrink-002.htm | 47 +++++ test/render/flex/--flex-shrink-003.htm | 44 +++++ test/render/flex/--flex-shrink-004.htm | 48 +++++ test/render/flex/--flex-shrink-005.htm | 47 +++++ test/render/flex/--flex-shrink-006.htm | 51 ++++++ test/render/flex/--flex-shrink-007.htm | 44 +++++ test/render/flex/--flex-shrink-008.htm | 49 ++++++ .../flex/--flexbox-abspos-child-001a.htm | 57 ++++++ .../flex/--flexbox-abspos-child-001b.htm | 58 +++++++ .../flex/--flexbox-abspos-child-002.htm | 65 +++++++ ...flexbox-align-self-baseline-horiz-001a.htm | 72 ++++++++ ...flexbox-align-self-baseline-horiz-001b.htm | 75 ++++++++ ...-flexbox-align-self-baseline-horiz-002.htm | 92 ++++++++++ ...-flexbox-align-self-baseline-horiz-003.htm | 94 ++++++++++ ...-flexbox-align-self-baseline-horiz-004.htm | 58 +++++++ ...-flexbox-align-self-baseline-horiz-005.htm | 58 +++++++ ...-flexbox-align-self-baseline-horiz-007.htm | 46 +++++ .../--flexbox-align-self-horiz-001-block.htm | 99 +++++++++++ .../--flexbox-align-self-horiz-001-table.htm | 101 +++++++++++ .../flex/--flexbox-align-self-horiz-003.htm | 99 +++++++++++ .../flex/--flexbox-align-self-horiz-004.htm | 86 +++++++++ .../flex/--flexbox-align-self-horiz-005.htm | 106 +++++++++++ .../flex/--flexbox-align-self-vert-001.htm | 94 ++++++++++ .../flex/--flexbox-align-self-vert-003.htm | 70 ++++++++ .../flex/--flexbox-align-self-vert-004.htm | 81 +++++++++ ...baseline-align-self-baseline-horiz-001.htm | 64 +++++++ ...-baseline-align-self-baseline-vert-001.htm | 68 ++++++++ ...flexbox-baseline-multi-item-horiz-001a.htm | 47 +++++ ...flexbox-baseline-multi-item-horiz-001b.htm | 49 ++++++ ...-flexbox-baseline-multi-item-vert-001a.htm | 57 ++++++ ...-flexbox-baseline-multi-item-vert-001b.htm | 59 +++++++ ...-flexbox-baseline-multi-line-horiz-001.htm | 76 ++++++++ ...-flexbox-baseline-multi-line-horiz-002.htm | 76 ++++++++ ...-flexbox-baseline-multi-line-horiz-003.htm | 76 ++++++++ ...--flexbox-baseline-multi-line-vert-001.htm | 77 ++++++++ ...--flexbox-baseline-multi-line-vert-002.htm | 78 +++++++++ .../--flexbox-baseline-single-item-001a.htm | 55 ++++++ .../--flexbox-baseline-single-item-001b.htm | 56 ++++++ .../flex/--flexbox-basic-block-vert-001.htm | 68 ++++++++ .../--flexbox-break-request-horiz-002a.htm | 110 ++++++++++++ .../--flexbox-break-request-horiz-002b.htm | 110 ++++++++++++ .../--flexbox-break-request-vert-002a.htm | 111 ++++++++++++ .../--flexbox-break-request-vert-002b.htm | 111 ++++++++++++ .../--flexbox-collapsed-item-baseline-001.htm | 57 ++++++ .../--flexbox-collapsed-item-horiz-001.htm | 101 +++++++++++ .../--flexbox-collapsed-item-horiz-002.htm | 114 ++++++++++++ .../--flexbox-collapsed-item-horiz-003.htm | 59 +++++++ .../--flexbox-flex-basis-content-001a.htm | 86 +++++++++ .../--flexbox-flex-basis-content-001b.htm | 86 +++++++++ .../--flexbox-flex-basis-content-002a.htm | 87 ++++++++++ .../--flexbox-flex-basis-content-002b.htm | 87 ++++++++++ .../--flexbox-flex-basis-content-003a.htm | 124 +++++++++++++ .../--flexbox-flex-basis-content-003b.htm | 125 +++++++++++++ .../--flexbox-flex-basis-content-004a.htm | 130 ++++++++++++++ test/render/flex/--flexbox-flex-flow-001.htm | 129 ++++++++++++++ test/render/flex/--flexbox-flex-flow-002.htm | 129 ++++++++++++++ .../flex/--flexbox-flex-wrap-default.htm | 43 +++++ .../flex/--flexbox-flex-wrap-horiz-001.htm | 100 +++++++++++ .../flex/--flexbox-flex-wrap-nowrap.htm | 44 +++++ .../flex/--flexbox-flex-wrap-vert-001.htm | 102 +++++++++++ .../flex/--flexbox-flex-wrap-vert-002.htm | 64 +++++++ .../flex/--flexbox-gap-position-absolute.htm | 30 ++++ ...flexbox-items-as-stacking-contexts-001.htm | 116 +++++++++++++ .../--flexbox-justify-content-horiz-001a.htm | 141 +++++++++++++++ .../--flexbox-justify-content-horiz-001b.htm | 147 ++++++++++++++++ .../--flexbox-justify-content-horiz-002.htm | 154 ++++++++++++++++ .../--flexbox-justify-content-horiz-003.htm | 149 ++++++++++++++++ .../--flexbox-justify-content-horiz-004.htm | 160 +++++++++++++++++ .../--flexbox-justify-content-horiz-005.htm | 140 +++++++++++++++ .../--flexbox-justify-content-horiz-006.htm | 142 +++++++++++++++ .../--flexbox-justify-content-vert-001a.htm | 143 +++++++++++++++ .../--flexbox-justify-content-vert-001b.htm | 144 +++++++++++++++ .../--flexbox-justify-content-vert-002.htm | 156 +++++++++++++++++ .../--flexbox-justify-content-vert-003.htm | 152 ++++++++++++++++ .../--flexbox-justify-content-vert-004.htm | 163 +++++++++++++++++ .../--flexbox-justify-content-vert-005.htm | 146 ++++++++++++++++ .../--flexbox-justify-content-vert-006.htm | 143 +++++++++++++++ .../flex/--flexbox-margin-auto-horiz-001.htm | 85 +++++++++ .../flex/--flexbox-margin-auto-horiz-002.htm | 70 ++++++++ test/render/flex/--flexbox-mbp-horiz-004.htm | 72 ++++++++ .../flex/--flexbox-min-height-auto-001.htm | 105 +++++++++++ .../flex/--flexbox-min-height-auto-003.htm | 60 +++++++ .../flex/--flexbox-min-height-auto-004.htm | 66 +++++++ .../flex/--flexbox-min-width-auto-001.htm | 103 +++++++++++ .../flex/--flexbox-min-width-auto-003.htm | 58 +++++++ .../flex/--flexbox-min-width-auto-004.htm | 64 +++++++ .../flex/--flexbox-overflow-horiz-001.htm | 58 +++++++ .../flex/--flexbox-overflow-horiz-002.htm | 54 ++++++ .../flex/--flexbox-overflow-horiz-003.htm | 51 ++++++ .../flex/--flexbox-overflow-horiz-004.htm | 51 ++++++ .../flex/--flexbox-overflow-horiz-005.htm | 53 ++++++ .../flex/--flexbox-overflow-vert-001.htm | 58 +++++++ .../flex/--flexbox-overflow-vert-002.htm | 54 ++++++ .../flex/--flexbox-overflow-vert-003.htm | 51 ++++++ .../flex/--flexbox-overflow-vert-004.htm | 51 ++++++ .../flex/--flexbox-overflow-vert-005.htm | 53 ++++++ .../flex/--flexbox-paint-ordering-001.htm | 92 ++++++++++ .../flex/--flexbox-paint-ordering-002.htm | 164 ++++++++++++++++++ test/render/flex/--flexbox-root-node-001a.htm | 26 +++ test/render/flex/--flexbox-root-node-001b.htm | 24 +++ .../flex/--flexbox-single-line-clamp-1.htm | 36 ++++ .../flex/--flexbox-single-line-clamp-3.htm | 42 +++++ .../flex/--flexbox-sizing-horiz-001.htm | 86 +++++++++ .../flex/--flexbox-sizing-horiz-002.htm | 63 +++++++ .../render/flex/--flexbox-sizing-vert-001.htm | 100 +++++++++++ .../render/flex/--flexbox-sizing-vert-002.htm | 64 +++++++ .../--flexbox-with-pseudo-elements-003.htm | 69 ++++++++ .../flex/--flexbox_align-content-stretch.htm | 41 +++++ .../flex/--flexbox_align-items-baseline.htm | 47 +++++ .../flex/--flexbox_align-self-baseline.htm | 43 +++++ test/render/flex/--flexbox_block.htm | 19 ++ .../flex/--flexbox_direction-row-reverse.htm | 36 ++++ test/render/flex/--flexbox_fbfc.htm | 35 ++++ test/render/flex/--flexbox_fbfc2.htm | 33 ++++ .../flex/--flexbox_flex-0-0-0-unitless.htm | 40 +++++ test/render/flex/--flexbox_flex-0-0-0.htm | 40 +++++ .../flex/--flexbox_flex-0-0-N-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-0-0-N.htm | 40 +++++ .../--flexbox_flex-0-0-Npercent-shrink.htm | 40 +++++ .../flex/--flexbox_flex-0-0-Npercent.htm | 40 +++++ test/render/flex/--flexbox_flex-0-0.htm | 40 +++++ .../flex/--flexbox_flex-0-1-0-unitless.htm | 40 +++++ test/render/flex/--flexbox_flex-0-1-0.htm | 40 +++++ .../flex/--flexbox_flex-0-1-N-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-0-1-N.htm | 40 +++++ .../--flexbox_flex-0-1-Npercent-shrink.htm | 40 +++++ .../flex/--flexbox_flex-0-1-Npercent.htm | 40 +++++ .../flex/--flexbox_flex-0-1-auto-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-0-1.htm | 40 +++++ .../flex/--flexbox_flex-0-N-0-unitless.htm | 40 +++++ test/render/flex/--flexbox_flex-0-N-0.htm | 40 +++++ .../flex/--flexbox_flex-0-N-N-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-0-N-N.htm | 40 +++++ .../--flexbox_flex-0-N-Npercent-shrink.htm | 40 +++++ .../flex/--flexbox_flex-0-N-Npercent.htm | 40 +++++ .../flex/--flexbox_flex-0-N-auto-shrink.htm | 40 +++++ .../flex/--flexbox_flex-0-N-auto.htm.png | Bin 0 -> 603 bytes test/render/flex/--flexbox_flex-0-N.htm | 40 +++++ test/render/flex/--flexbox_flex-0-auto.htm | 45 +++++ .../flex/--flexbox_flex-1-0-0-unitless.htm | 40 +++++ test/render/flex/--flexbox_flex-1-0-0.htm | 40 +++++ .../flex/--flexbox_flex-1-0-N-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-1-0-N.htm | 40 +++++ .../--flexbox_flex-1-0-Npercent-shrink.htm | 40 +++++ .../flex/--flexbox_flex-1-0-Npercent.htm | 40 +++++ test/render/flex/--flexbox_flex-1-0-auto.htm | 40 +++++ test/render/flex/--flexbox_flex-1-0.htm | 40 +++++ .../flex/--flexbox_flex-1-1-0-unitless.htm | 40 +++++ test/render/flex/--flexbox_flex-1-1-0.htm | 40 +++++ .../flex/--flexbox_flex-1-1-N-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-1-1-N.htm | 40 +++++ .../--flexbox_flex-1-1-Npercent-shrink.htm | 40 +++++ .../flex/--flexbox_flex-1-1-Npercent.htm | 40 +++++ .../flex/--flexbox_flex-1-1-auto-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-1-1-auto.htm | 40 +++++ test/render/flex/--flexbox_flex-1-1.htm | 40 +++++ .../flex/--flexbox_flex-1-N-0-unitless.htm | 40 +++++ test/render/flex/--flexbox_flex-1-N-0.htm | 40 +++++ .../flex/--flexbox_flex-1-N-N-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-1-N-N.htm | 40 +++++ .../--flexbox_flex-1-N-Npercent-shrink.htm | 40 +++++ .../flex/--flexbox_flex-1-N-Npercent.htm | 40 +++++ .../flex/--flexbox_flex-1-N-auto-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-1-N-auto.htm | 40 +++++ test/render/flex/--flexbox_flex-1-N.htm | 40 +++++ .../flex/--flexbox_flex-N-0-0-unitless.htm | 40 +++++ test/render/flex/--flexbox_flex-N-0-0.htm | 40 +++++ .../flex/--flexbox_flex-N-0-N-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-N-0-N.htm | 40 +++++ .../--flexbox_flex-N-0-Npercent-shrink.htm | 40 +++++ .../flex/--flexbox_flex-N-0-Npercent.htm | 40 +++++ test/render/flex/--flexbox_flex-N-0-auto.htm | 40 +++++ test/render/flex/--flexbox_flex-N-0.htm | 40 +++++ .../flex/--flexbox_flex-N-1-0-unitless.htm | 40 +++++ test/render/flex/--flexbox_flex-N-1-0.htm | 40 +++++ .../flex/--flexbox_flex-N-1-N-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-N-1-N.htm | 40 +++++ .../--flexbox_flex-N-1-Npercent-shrink.htm | 40 +++++ .../flex/--flexbox_flex-N-1-Npercent.htm | 40 +++++ .../flex/--flexbox_flex-N-1-auto-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-N-1-auto.htm | 40 +++++ test/render/flex/--flexbox_flex-N-1.htm | 40 +++++ .../flex/--flexbox_flex-N-N-0-unitless.htm | 40 +++++ test/render/flex/--flexbox_flex-N-N-0.htm | 40 +++++ .../flex/--flexbox_flex-N-N-N-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-N-N-N.htm | 40 +++++ .../--flexbox_flex-N-N-Npercent-shrink.htm | 40 +++++ .../flex/--flexbox_flex-N-N-Npercent.htm | 40 +++++ .../flex/--flexbox_flex-N-N-auto-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-N-N-auto.htm | 40 +++++ test/render/flex/--flexbox_flex-N-N.htm | 40 +++++ test/render/flex/--flexbox_flex-auto.htm | 46 +++++ .../flex/--flexbox_flex-basis-shrink.htm | 40 +++++ test/render/flex/--flexbox_flex-basis.htm | 42 +++++ .../--flexbox_flex-formatting-interop.htm | 41 +++++ test/render/flex/--flexbox_flex-initial.htm | 45 +++++ .../--flexbox_flex-natural-mixed-basis.htm | 39 +++++ ...exbox_flex-natural-variable-auto-basis.htm | 39 +++++ ...exbox_flex-natural-variable-zero-basis.htm | 39 +++++ test/render/flex/--flexbox_flex-natural.htm | 50 ++++++ .../--flexbox_flex-none-wrappable-content.htm | 26 +++ test/render/flex/--flexbox_inline-abspos.htm | 20 +++ test/render/flex/--flexbox_inline-float.htm | 20 +++ test/render/flex/--flexbox_inline.htm | 20 +++ .../flex/--flexbox_justifycontent-center.htm | 40 +++++ .../--flexbox_justifycontent-flex-end.htm | 40 +++++ .../--flexbox_justifycontent-flex-start.htm | 40 +++++ ...lexbox_justifycontent-spacearound-only.htm | 35 ++++ .../--flexbox_justifycontent-spacearound.htm | 40 +++++ .../--flexbox_justifycontent-spacebetween.htm | 40 +++++ test/render/flex/--flexbox_margin-auto.htm | 33 ++++ test/render/flex/--flexbox_margin-left-ex.htm | 33 ++++ .../--flexbox_order-abspos-space-around.htm | 39 +++++ .../--flexbox_order-noninteger-invalid.htm | 44 +++++ .../--flexbox_rowspan-overflow-automatic.htm | 69 ++++++++ .../flex/--flexbox_rowspan-overflow.htm | 68 ++++++++ test/render/flex/--flexbox_rowspan.htm | 68 ++++++++ .../flex/--flexbox_stf-table-singleline-2.htm | 41 +++++ .../flex/--flexbox_stf-table-singleline.htm | 38 ++++ .../flex/--flexbox_table-fixed-layout.htm | 58 +++++++ test/render/flex/--flexbox_wrap-long.htm | 37 ++++ ...multi-line-wrap-reverse-column-reverse.htm | 74 ++++++++ .../--multiline-reverse-wrap-baseline.htm | 61 +++++++ .../render/flex/--multiline-shrink-to-fit.htm | 77 ++++++++ .../flex/--negative-flex-margins-crash.htm | 26 +++ test/render/flex/--percentage-heights-006.htm | 48 +++++ test/render/flex/--percentage-heights-007.htm | 47 +++++ test/render/flex/--percentage-heights-008.htm | 39 +++++ test/render/flex/--percentage-heights-009.htm | 42 +++++ test/render/flex/--percentage-heights-010.htm | 18 ++ test/render/flex/--space-evenly-001.htm | 40 +++++ .../--table-as-item-fixed-min-width-2.htm | 23 +++ .../--table-as-item-fixed-min-width-3.htm | 25 +++ .../flex/--table-as-item-flex-cross-size.htm | 17 ++ ...--table-as-item-inflexible-in-column-1.htm | 19 ++ ...--table-as-item-inflexible-in-column-2.htm | 22 +++ .../--table-as-item-inflexible-in-row-1.htm | 19 ++ .../--table-as-item-inflexible-in-row-2.htm | 22 +++ .../flex/--table-as-item-narrow-content.htm | 18 ++ .../flex/--table-as-item-specified-height.htm | 20 +++ .../flex/--table-as-item-specified-width.htm | 21 +++ .../--table-as-item-stretch-cross-size-2.htm | 18 ++ .../--table-as-item-stretch-cross-size-3.htm | 30 ++++ .../--table-as-item-stretch-cross-size.htm | 17 ++ test/render/flex/-align-content-001.htm | 42 +++++ test/render/flex/-align-content-002.htm | 41 +++++ test/render/flex/-align-content-003.htm | 41 +++++ test/render/flex/-align-content-004.htm | 43 +++++ test/render/flex/-align-content-005.htm | 41 +++++ test/render/flex/-align-items-001.htm | 39 +++++ test/render/flex/-align-items-002.htm | 40 +++++ test/render/flex/-align-items-003.htm | 40 +++++ .../-contain-layout-suppress-baseline-002.htm | 75 ++++++++ .../flex/-content-height-with-scrollbars.htm | 47 +++++ test/render/flex/-cross-axis-scrollbar.htm | 147 ++++++++++++++++ test/render/flex/-css-box-justify-content.htm | 34 ++++ .../-css-flexbox-row-reverse-wrap-reverse.htm | 47 +++++ .../flex/-css-flexbox-row-reverse-wrap.htm | 47 +++++ test/render/flex/-css-flexbox-row-reverse.htm | 56 ++++++ .../flex/-css-flexbox-row-wrap-reverse.htm | 46 +++++ test/render/flex/-css-flexbox-row-wrap.htm | 47 +++++ test/render/flex/-css-flexbox-row.htm | 56 ++++++ test/render/flex/-css-flexbox-test1.htm | 54 ++++++ test/render/flex/-direction-upright-002.htm | 142 +++++++++++++++ test/render/flex/-flex-002.htm | 53 ++++++ test/render/flex/-flex-003.htm | 54 ++++++ test/render/flex/-flex-004.htm | 54 ++++++ test/render/flex/-flex-aspect-ratio-019.htm | 18 ++ test/render/flex/-flex-aspect-ratio-020.htm | 18 ++ test/render/flex/-flex-aspect-ratio-021.htm | 18 ++ test/render/flex/-flex-aspect-ratio-022.htm | 18 ++ .../flex/-flex-direction-row-002-visual.htm | 45 +++++ .../flex/-flex-direction-row-vertical.htm | 51 ++++++ .../-flex-minimum-height-flex-items-022.htm | 15 ++ .../-flex-minimum-width-flex-items-001.htm | 44 +++++ .../-flex-minimum-width-flex-items-003.htm | 45 +++++ .../-flex-minimum-width-flex-items-009.htm | 32 ++++ .../flex/-flexbox-abspos-child-001b.htm | 54 ++++++ .../render/flex/-flexbox-abspos-child-002.htm | 61 +++++++ ...-flexbox-align-self-baseline-horiz-006.htm | 56 ++++++ ...-flexbox-align-self-baseline-horiz-008.htm | 57 ++++++ .../flex/-flexbox-align-self-horiz-002.htm | 100 +++++++++++ .../flex/-flexbox-align-self-vert-002.htm | 96 ++++++++++ .../flex/-flexbox-align-self-vert-rtl-001.htm | 97 +++++++++++ .../flex/-flexbox-align-self-vert-rtl-002.htm | 82 +++++++++ .../flex/-flexbox-align-self-vert-rtl-003.htm | 72 ++++++++ .../flex/-flexbox-align-self-vert-rtl-004.htm | 90 ++++++++++ .../flex/-flexbox-align-self-vert-rtl-005.htm | 94 ++++++++++ .../flex/-flexbox-anonymous-items-001.htm | 25 +++ .../flex/-flexbox-basic-block-horiz-001v.htm | 75 ++++++++ .../flex/-flexbox-basic-block-vert-001v.htm | 77 ++++++++ .../flex/-flexbox-flex-basis-content-004b.htm | 131 ++++++++++++++ .../flex/-flexbox-flex-wrap-default.htm | 39 +++++ .../flex/-flexbox-flex-wrap-vert-001.htm | 98 +++++++++++ .../flex/-flexbox-flex-wrap-vert-002.htm | 60 +++++++ .../flex/-flexbox-flex-wrap-wrap-reverse.htm | 60 +++++++ .../-flexbox-justify-content-wmvert-001.htm | 144 +++++++++++++++ .../-flexbox-mbp-horiz-001-rtl-reverse.htm | 75 ++++++++ .../flex/-flexbox-mbp-horiz-001-rtl.htm | 73 ++++++++ test/render/flex/-flexbox-mbp-horiz-002v.htm | 87 ++++++++++ test/render/flex/-flexbox-mbp-horiz-003v.htm | 81 +++++++++ .../flex/-flexbox-min-width-auto-002a.htm | 66 +++++++ .../flex/-flexbox-min-width-auto-002b.htm | 66 +++++++ .../flex/-flexbox-min-width-auto-002c.htm | 68 ++++++++ .../flex/-flexbox-min-width-auto-005.htm | 38 ++++ .../flex/-flexbox-min-width-auto-006.htm | 45 +++++ .../flex/-flexbox-overflow-horiz-001.htm.htm | 54 ++++++ .../-flexbox-whitespace-handling-001a.htm | 54 ++++++ .../-flexbox-whitespace-handling-001b.htm | 42 +++++ .../render/flex/-flexbox-writing-mode-001.htm | 81 +++++++++ .../render/flex/-flexbox-writing-mode-002.htm | 81 +++++++++ .../render/flex/-flexbox-writing-mode-003.htm | 81 +++++++++ .../render/flex/-flexbox-writing-mode-004.htm | 81 +++++++++ .../render/flex/-flexbox-writing-mode-005.htm | 81 +++++++++ .../render/flex/-flexbox-writing-mode-006.htm | 81 +++++++++ .../render/flex/-flexbox-writing-mode-007.htm | 78 +++++++++ .../render/flex/-flexbox-writing-mode-008.htm | 78 +++++++++ .../render/flex/-flexbox-writing-mode-009.htm | 78 +++++++++ .../render/flex/-flexbox-writing-mode-010.htm | 87 ++++++++++ .../render/flex/-flexbox-writing-mode-011.htm | 88 ++++++++++ .../render/flex/-flexbox-writing-mode-012.htm | 89 ++++++++++ .../render/flex/-flexbox-writing-mode-013.htm | 88 ++++++++++ .../render/flex/-flexbox-writing-mode-014.htm | 87 ++++++++++ .../render/flex/-flexbox-writing-mode-015.htm | 88 ++++++++++ .../render/flex/-flexbox-writing-mode-016.htm | 147 ++++++++++++++++ ...xbox_align-items-stretch-writing-modes.htm | 62 +++++++ .../flex/-flexbox_columns-flexitems-2.htm | 32 ++++ .../flex/-flexbox_columns-flexitems.htm | 30 ++++ test/render/flex/-flexbox_rtl-direction.htm | 38 ++++ .../render/flex/-flexbox_rtl-flow-reverse.htm | 38 ++++ test/render/flex/-flexbox_rtl-flow.htm | 38 ++++ test/render/flex/-flexbox_rtl-order.htm | 57 ++++++ ...l_lays_out_contents_from_top_to_bottom.htm | 64 +++++++ test/render/flex/-justify-content-001.htm | 41 +++++ test/render/flex/-justify-content-002.htm | 38 ++++ test/render/flex/-justify-content-003.htm | 37 ++++ test/render/flex/-justify-content-004.htm | 41 +++++ test/render/flex/-justify-content-005.htm | 41 +++++ .../-nested-orthogonal-flexbox-relayout.htm | 34 ++++ .../flex/-percentage-size-subitems-001.htm | 98 +++++++++++ .../-table-as-item-stretch-cross-size-5.htm | 43 +++++ test/render/flex/abspos-autopos-htb-ltr.htm | 39 +++++ .../flex/abspos-autopos-htb-ltr.htm.png | Bin 0 -> 583 bytes test/render/flex/abspos-autopos-htb-rtl.htm | 39 +++++ .../flex/abspos-autopos-htb-rtl.htm.png | Bin 0 -> 583 bytes test/render/flex/abspos-autopos-vlr-ltr.htm | 39 +++++ .../flex/abspos-autopos-vlr-ltr.htm.png | Bin 0 -> 583 bytes test/render/flex/abspos-autopos-vlr-rtl.htm | 39 +++++ .../flex/abspos-autopos-vlr-rtl.htm.png | Bin 0 -> 583 bytes test/render/flex/abspos-autopos-vrl-ltr.htm | 39 +++++ .../flex/abspos-autopos-vrl-ltr.htm.png | Bin 0 -> 583 bytes test/render/flex/abspos-autopos-vrl-rtl.htm | 39 +++++ .../flex/abspos-autopos-vrl-rtl.htm.png | Bin 0 -> 583 bytes test/render/flex/align-content-006.htm | 40 +++++ test/render/flex/align-content-006.htm.png | Bin 0 -> 516 bytes test/render/flex/align-content_center.htm | 31 ++++ test/render/flex/align-content_center.htm.png | Bin 0 -> 1828 bytes test/render/flex/align-content_flex-end.htm | 31 ++++ .../flex/align-content_flex-end.htm.png | Bin 0 -> 1810 bytes test/render/flex/align-content_flex-start.htm | 32 ++++ .../flex/align-content_flex-start.htm.png | Bin 0 -> 1828 bytes .../flex/align-content_space-around.htm | 31 ++++ .../flex/align-content_space-around.htm.png | Bin 0 -> 2800 bytes .../flex/align-content_space-between.htm | 31 ++++ .../flex/align-content_space-between.htm.png | Bin 0 -> 2561 bytes test/render/flex/align-content_stretch.htm | 31 ++++ .../render/flex/align-content_stretch.htm.png | Bin 0 -> 2278 bytes test/render/flex/align-items-004.htm | 53 ++++++ test/render/flex/align-items-004.htm.png | Bin 0 -> 516 bytes test/render/flex/align-items-005.htm | 39 +++++ test/render/flex/align-items-005.htm.png | Bin 0 -> 516 bytes test/render/flex/align-items-006.htm | 42 +++++ test/render/flex/align-items-006.htm.png | Bin 0 -> 516 bytes test/render/flex/align-self-004.htm | 39 +++++ test/render/flex/align-self-004.htm.png | Bin 0 -> 577 bytes test/render/flex/align-self-011.htm | 39 +++++ test/render/flex/align-self-011.htm.png | Bin 0 -> 577 bytes test/render/flex/align-self-012.htm | 40 +++++ test/render/flex/align-self-012.htm.png | Bin 0 -> 577 bytes test/render/flex/anonymous-block.htm | 17 ++ test/render/flex/anonymous-block.htm.png | Bin 0 -> 564 bytes ...-height-column-with-border-and-padding.htm | 17 ++ ...ght-column-with-border-and-padding.htm.png | Bin 0 -> 828 bytes .../flex/contain-layout-baseline-002.htm | 39 +++++ .../flex/contain-layout-baseline-002.htm.png | Bin 0 -> 577 bytes test/render/flex/flex-001.htm | 40 +++++ test/render/flex/flex-001.htm.png | Bin 0 -> 992 bytes .../render/flex/flex-align-content-center.htm | 45 +++++ .../flex/flex-align-content-center.htm.png | Bin 0 -> 771 bytes test/render/flex/flex-align-content-end.htm | 45 +++++ .../flex/flex-align-content-end.htm.png | Bin 0 -> 1050 bytes .../flex/flex-align-content-space-around.htm | 45 +++++ .../flex-align-content-space-around.htm.png | Bin 0 -> 1050 bytes .../flex/flex-align-content-space-between.htm | 45 +++++ .../flex-align-content-space-between.htm.png | Bin 0 -> 1046 bytes test/render/flex/flex-align-content-start.htm | 45 +++++ .../flex/flex-align-content-start.htm.png | Bin 0 -> 1057 bytes test/render/flex/flex-base.htm | 35 ++++ test/render/flex/flex-base.htm.png | Bin 0 -> 586 bytes test/render/flex/flex-basis-001.htm | 39 +++++ test/render/flex/flex-basis-001.htm.png | Bin 0 -> 577 bytes test/render/flex/flex-basis-007.htm | 40 +++++ test/render/flex/flex-basis-007.htm.png | Bin 0 -> 577 bytes test/render/flex/flex-basis-008.htm | 39 +++++ test/render/flex/flex-basis-008.htm.png | Bin 0 -> 577 bytes test/render/flex/flex-box-wrap.htm | 51 ++++++ test/render/flex/flex-box-wrap.htm.png | Bin 0 -> 886 bytes test/render/flex/flex-container-margin.htm | 34 ++++ .../render/flex/flex-container-margin.htm.png | Bin 0 -> 223 bytes .../flex/flex-direction-column-001-visual.htm | 29 ++++ .../flex-direction-column-001-visual.htm.png | Bin 0 -> 1810 bytes ...ex-direction-column-reverse-001-visual.htm | 29 ++++ ...irection-column-reverse-001-visual.htm.png | Bin 0 -> 2024 bytes ...ex-direction-column-reverse-002-visual.htm | 43 +++++ ...irection-column-reverse-002-visual.htm.png | Bin 0 -> 406 bytes .../flex/flex-direction-column-reverse.htm | 42 +++++ .../flex-direction-column-reverse.htm.png | Bin 0 -> 1041 bytes test/render/flex/flex-direction-column.htm | 42 +++++ .../render/flex/flex-direction-column.htm.png | Bin 0 -> 980 bytes .../flex-direction-row-reverse-002-visual.htm | 42 +++++ ...x-direction-row-reverse-002-visual.htm.png | Bin 0 -> 374 bytes .../flex/flex-direction-row-reverse.htm | 40 +++++ .../flex/flex-direction-row-reverse.htm.png | Bin 0 -> 929 bytes test/render/flex/flex-direction.htm | 58 +++++++ test/render/flex/flex-direction.htm.png | Bin 0 -> 2837 bytes test/render/flex/flex-flow-001.htm | 39 +++++ test/render/flex/flex-flow-001.htm.png | Bin 0 -> 1079 bytes test/render/flex/flex-flow-002.htm | 40 +++++ test/render/flex/flex-flow-002.htm.png | Bin 0 -> 1024 bytes test/render/flex/flex-flow-003.htm | 41 +++++ test/render/flex/flex-flow-003.htm.png | Bin 0 -> 1024 bytes test/render/flex/flex-flow-005.htm | 41 +++++ test/render/flex/flex-flow-005.htm.png | Bin 0 -> 1024 bytes test/render/flex/flex-flow-006.htm | 41 +++++ test/render/flex/flex-flow-006.htm.png | Bin 0 -> 1024 bytes test/render/flex/flex-flow-008.htm | 41 +++++ test/render/flex/flex-flow-008.htm.png | Bin 0 -> 1024 bytes test/render/flex/flex-flow-009.htm | 41 +++++ test/render/flex/flex-flow-009.htm.png | Bin 0 -> 1024 bytes test/render/flex/flex-flow-011.htm | 41 +++++ test/render/flex/flex-flow-011.htm.png | Bin 0 -> 1024 bytes test/render/flex/flex-flow-012.htm | 41 +++++ test/render/flex/flex-flow-012.htm.png | Bin 0 -> 1024 bytes test/render/flex/flex-grow-003.htm | 49 ++++++ test/render/flex/flex-grow-003.htm.png | Bin 0 -> 577 bytes test/render/flex/flex-grow-004.htm | 49 ++++++ test/render/flex/flex-grow-004.htm.png | Bin 0 -> 577 bytes test/render/flex/flex-grow-005.htm | 43 +++++ test/render/flex/flex-grow-005.htm.png | Bin 0 -> 577 bytes test/render/flex/flex-grow-006.htm | 42 +++++ test/render/flex/flex-grow-006.htm.png | Bin 0 -> 586 bytes test/render/flex/flex-margin-no-collapse.htm | 58 +++++++ .../flex/flex-margin-no-collapse.htm.png | Bin 0 -> 754 bytes .../flex-minimum-height-flex-items-001.htm | 52 ++++++ ...flex-minimum-height-flex-items-001.htm.png | Bin 0 -> 577 bytes .../flex-minimum-height-flex-items-002.htm | 50 ++++++ ...flex-minimum-height-flex-items-002.htm.png | Bin 0 -> 610 bytes .../flex-minimum-width-flex-items-002.htm | 48 +++++ .../flex-minimum-width-flex-items-002.htm.png | Bin 0 -> 577 bytes test/render/flex/flex-order.htm | 40 +++++ test/render/flex/flex-order.htm.png | Bin 0 -> 197 bytes .../flexbox-align-items-center-nested-001.htm | 52 ++++++ ...xbox-align-items-center-nested-001.htm.png | Bin 0 -> 121 bytes .../flexbox-align-self-stretch-vert-001.htm | 52 ++++++ ...lexbox-align-self-stretch-vert-001.htm.png | Bin 0 -> 144 bytes .../flexbox-align-self-stretch-vert-002.htm | 38 ++++ ...lexbox-align-self-stretch-vert-002.htm.png | Bin 0 -> 146 bytes .../flex/flexbox-anonymous-items-001.htm | 29 ++++ .../flex/flexbox-anonymous-items-001.htm.png | Bin 0 -> 145 bytes .../flex/flexbox-baseline-empty-001a.htm | 49 ++++++ .../flex/flexbox-baseline-empty-001a.htm.png | Bin 0 -> 180 bytes .../flex/flexbox-baseline-empty-001b.htm | 50 ++++++ .../flex/flexbox-baseline-empty-001b.htm.png | Bin 0 -> 180 bytes .../flex/flexbox-basic-block-horiz-001.htm | 67 +++++++ .../flexbox-basic-block-horiz-001.htm.png | Bin 0 -> 473 bytes .../flex/flexbox-basic-block-vert-001.htm.png | Bin 0 -> 333 bytes .../flex/flexbox-break-request-horiz-001a.htm | 111 ++++++++++++ .../flexbox-break-request-horiz-001a.htm.png | Bin 0 -> 337 bytes .../flex/flexbox-break-request-horiz-001b.htm | 111 ++++++++++++ .../flexbox-break-request-horiz-001b.htm.png | Bin 0 -> 337 bytes .../flex/flexbox-break-request-vert-001a.htm | 112 ++++++++++++ .../flexbox-break-request-vert-001a.htm.png | Bin 0 -> 508 bytes .../flex/flexbox-break-request-vert-001b.htm | 112 ++++++++++++ .../flexbox-break-request-vert-001b.htm.png | Bin 0 -> 508 bytes .../flexbox-flex-direction-column-reverse.htm | 61 +++++++ ...xbox-flex-direction-column-reverse.htm.png | Bin 0 -> 1202 bytes .../flex/flexbox-flex-direction-column.htm | 60 +++++++ .../flexbox-flex-direction-column.htm.png | Bin 0 -> 1202 bytes .../flex/flexbox-flex-direction-default.htm | 59 +++++++ .../flexbox-flex-direction-default.htm.png | Bin 0 -> 1202 bytes .../flexbox-flex-direction-row-reverse.htm | 61 +++++++ ...flexbox-flex-direction-row-reverse.htm.png | Bin 0 -> 1202 bytes .../flex/flexbox-flex-direction-row.htm | 60 +++++++ .../flex/flexbox-flex-direction-row.htm.png | Bin 0 -> 1202 bytes .../render/flex/flexbox-flex-wrap-flexing.htm | 40 +++++ .../flex/flexbox-flex-wrap-flexing.htm.png | Bin 0 -> 568 bytes .../flex/flexbox-flex-wrap-horiz-002.htm | 64 +++++++ .../flex/flexbox-flex-wrap-horiz-002.htm.png | Bin 0 -> 211 bytes test/render/flex/flexbox-flex-wrap-wrap.htm | 60 +++++++ .../flex/flexbox-flex-wrap-wrap.htm.png | Bin 0 -> 1202 bytes ...flexbox-items-as-stacking-contexts-002.htm | 73 ++++++++ ...box-items-as-stacking-contexts-002.htm.png | Bin 0 -> 724 bytes ...flexbox-items-as-stacking-contexts-003.htm | 73 ++++++++ ...box-items-as-stacking-contexts-003.htm.png | Bin 0 -> 168 bytes .../flex/flexbox-mbp-horiz-001-reverse.htm | 73 ++++++++ .../flexbox-mbp-horiz-001-reverse.htm.png | Bin 0 -> 442 bytes test/render/flex/flexbox-mbp-horiz-001.htm | 71 ++++++++ .../render/flex/flexbox-mbp-horiz-001.htm.png | Bin 0 -> 440 bytes test/render/flex/flexbox-mbp-horiz-002a.htm | 75 ++++++++ .../flex/flexbox-mbp-horiz-002a.htm.png | Bin 0 -> 457 bytes test/render/flex/flexbox-mbp-horiz-002b.htm | 82 +++++++++ .../flex/flexbox-mbp-horiz-002b.htm.png | Bin 0 -> 457 bytes .../flex/flexbox-mbp-horiz-003-reverse.htm | 77 ++++++++ .../flexbox-mbp-horiz-003-reverse.htm.png | Bin 0 -> 372 bytes test/render/flex/flexbox-mbp-horiz-003.htm | 76 ++++++++ .../render/flex/flexbox-mbp-horiz-003.htm.png | Bin 0 -> 368 bytes .../render/flex/flexbox-order-from-lowest.htm | 39 +++++ .../flex/flexbox-order-from-lowest.htm.png | Bin 0 -> 496 bytes .../flex/flexbox-order-only-flexitems.htm | 40 +++++ .../flex/flexbox-order-only-flexitems.htm.png | Bin 0 -> 492 bytes .../flex/flexbox-paint-ordering-003.htm | 55 ++++++ .../flex/flexbox-paint-ordering-003.htm.png | Bin 0 -> 141 bytes .../flex/flexbox-single-line-clamp-2.htm | 43 +++++ .../flex/flexbox-single-line-clamp-2.htm.png | Bin 0 -> 415 bytes test/render/flex/flexbox-table-fixup-001.htm | 64 +++++++ .../flex/flexbox-table-fixup-001.htm.png | Bin 0 -> 297 bytes .../flex/flexbox-whitespace-handling-002.htm | 55 ++++++ .../flexbox-whitespace-handling-002.htm.png | Bin 0 -> 910 bytes .../flex/flexbox-with-pseudo-elements-001.htm | 58 +++++++ .../flexbox-with-pseudo-elements-001.htm.png | Bin 0 -> 535 bytes .../flex/flexbox-with-pseudo-elements-002.htm | 81 +++++++++ .../flexbox-with-pseudo-elements-002.htm.png | Bin 0 -> 685 bytes test/render/flex/flexbox_absolute-atomic.htm | 33 ++++ .../flex/flexbox_absolute-atomic.htm.png | Bin 0 -> 237 bytes .../flex/flexbox_align-content-center.htm | 41 +++++ .../flex/flexbox_align-content-center.htm.png | Bin 0 -> 353 bytes .../flex/flexbox_align-content-flexend.htm | 41 +++++ .../flexbox_align-content-flexend.htm.png | Bin 0 -> 352 bytes .../flex/flexbox_align-content-flexstart.htm | 41 +++++ .../flexbox_align-content-flexstart.htm.png | Bin 0 -> 352 bytes .../flexbox_align-content-spacearound.htm | 41 +++++ .../flexbox_align-content-spacearound.htm.png | Bin 0 -> 354 bytes .../flexbox_align-content-spacebetween.htm | 41 +++++ ...flexbox_align-content-spacebetween.htm.png | Bin 0 -> 354 bytes .../flex/flexbox_align-content-stretch-2.htm | 40 +++++ .../flexbox_align-content-stretch-2.htm.png | Bin 0 -> 349 bytes .../flex/flexbox_align-items-center-2.htm | 46 +++++ .../flex/flexbox_align-items-center-2.htm.png | Bin 0 -> 393 bytes .../flex/flexbox_align-items-center.htm | 40 +++++ .../flex/flexbox_align-items-center.htm.png | Bin 0 -> 396 bytes .../flex/flexbox_align-items-flexend-2.htm | 45 +++++ .../flexbox_align-items-flexend-2.htm.png | Bin 0 -> 375 bytes .../flex/flexbox_align-items-flexend.htm | 39 +++++ .../flex/flexbox_align-items-flexend.htm.png | Bin 0 -> 396 bytes .../flex/flexbox_align-items-flexstart-2.htm | 45 +++++ .../flexbox_align-items-flexstart-2.htm.png | Bin 0 -> 397 bytes .../flex/flexbox_align-items-flexstart.htm | 39 +++++ .../flexbox_align-items-flexstart.htm.png | Bin 0 -> 398 bytes .../flex/flexbox_align-items-stretch-2.htm | 36 ++++ .../flexbox_align-items-stretch-2.htm.png | Bin 0 -> 149 bytes .../flex/flexbox_align-items-stretch.htm | 44 +++++ .../flex/flexbox_align-items-stretch.htm.png | Bin 0 -> 382 bytes test/render/flex/flexbox_align-self-auto.htm | 42 +++++ .../flex/flexbox_align-self-auto.htm.png | Bin 0 -> 396 bytes .../render/flex/flexbox_align-self-center.htm | 43 +++++ .../flex/flexbox_align-self-center.htm.png | Bin 0 -> 388 bytes .../flex/flexbox_align-self-flexend.htm | 42 +++++ .../flex/flexbox_align-self-flexend.htm.png | Bin 0 -> 392 bytes .../flex/flexbox_align-self-flexstart.htm | 42 +++++ .../flex/flexbox_align-self-flexstart.htm.png | Bin 0 -> 390 bytes .../flex/flexbox_align-self-stretch.htm | 44 +++++ .../flex/flexbox_align-self-stretch.htm.png | Bin 0 -> 387 bytes test/render/flex/flexbox_box-clear.htm | 34 ++++ test/render/flex/flexbox_box-clear.htm.png | Bin 0 -> 896 bytes test/render/flex/flexbox_columns.htm | 30 ++++ test/render/flex/flexbox_columns.htm.png | Bin 0 -> 103 bytes .../flex/flexbox_direction-column-reverse.htm | 36 ++++ .../flexbox_direction-column-reverse.htm.png | Bin 0 -> 588 bytes test/render/flex/flexbox_direction-column.htm | 33 ++++ .../flex/flexbox_direction-column.htm.png | Bin 0 -> 562 bytes test/render/flex/flexbox_display.htm | 29 ++++ test/render/flex/flexbox_display.htm.png | Bin 0 -> 559 bytes test/render/flex/flexbox_first-line.htm | 40 +++++ test/render/flex/flexbox_first-line.htm.png | Bin 0 -> 978 bytes .../flexbox_flex-0-0-1-unitless-basis.htm | 40 +++++ .../flexbox_flex-0-0-1-unitless-basis.htm.png | Bin 0 -> 603 bytes .../flexbox_flex-0-0-N-unitless-basis.htm | 40 +++++ .../flexbox_flex-0-0-N-unitless-basis.htm.png | Bin 0 -> 603 bytes .../flex/flexbox_flex-0-0-auto-shrink.htm | 40 +++++ .../flex/flexbox_flex-0-0-auto-shrink.htm.png | Bin 0 -> 424 bytes test/render/flex/flexbox_flex-0-0-auto.htm | 40 +++++ .../render/flex/flexbox_flex-0-0-auto.htm.png | Bin 0 -> 603 bytes .../flexbox_flex-0-1-1-unitless-basis.htm | 40 +++++ .../flexbox_flex-0-1-1-unitless-basis.htm.png | Bin 0 -> 603 bytes .../flexbox_flex-0-1-N-unitless-basis.htm | 40 +++++ .../flexbox_flex-0-1-N-unitless-basis.htm.png | Bin 0 -> 603 bytes test/render/flex/flexbox_flex-0-1-auto.htm | 40 +++++ .../render/flex/flexbox_flex-0-1-auto.htm.png | Bin 0 -> 603 bytes test/render/flex/flexbox_flex-0-N-auto.htm | 40 +++++ .../render/flex/flexbox_flex-0-N-auto.htm.png | Bin 0 -> 603 bytes .../flex/flexbox_flex-1-0-auto-shrink.htm | 40 +++++ .../flex/flexbox_flex-1-0-auto-shrink.htm.png | Bin 0 -> 424 bytes .../flex/flexbox_flex-N-0-auto-shrink.htm | 40 +++++ .../flex/flexbox_flex-N-0-auto-shrink.htm.png | Bin 0 -> 426 bytes test/render/flex/flexbox_flex-initial-2.htm | 45 +++++ .../flex/flexbox_flex-initial-2.htm.png | Bin 0 -> 581 bytes .../flexbox_flex-natural-mixed-basis-auto.htm | 42 +++++ ...xbox_flex-natural-mixed-basis-auto.htm.png | Bin 0 -> 396 bytes test/render/flex/flexbox_flex-none.htm | 46 +++++ test/render/flex/flexbox_flex-none.htm.png | Bin 0 -> 529 bytes ...exbox_flow-column-reverse-wrap-reverse.htm | 36 ++++ ...x_flow-column-reverse-wrap-reverse.htm.png | Bin 0 -> 322 bytes .../flex/flexbox_flow-column-reverse-wrap.htm | 36 ++++ .../flexbox_flow-column-reverse-wrap.htm.png | Bin 0 -> 324 bytes .../flex/flexbox_flow-column-wrap-reverse.htm | 35 ++++ .../flexbox_flow-column-wrap-reverse.htm.png | Bin 0 -> 326 bytes test/render/flex/flexbox_flow-column-wrap.htm | 35 ++++ .../flex/flexbox_flow-column-wrap.htm.png | Bin 0 -> 327 bytes .../flex/flexbox_flow-row-wrap-reverse.htm | 34 ++++ .../flexbox_flow-row-wrap-reverse.htm.png | Bin 0 -> 315 bytes test/render/flex/flexbox_flow-row-wrap.htm | 34 ++++ .../render/flex/flexbox_flow-row-wrap.htm.png | Bin 0 -> 315 bytes test/render/flex/flexbox_generated-flex.htm | 27 +++ .../flex/flexbox_generated-flex.htm.png | Bin 0 -> 241 bytes .../flex/flexbox_generated-nested-flex.htm | 27 +++ .../flexbox_generated-nested-flex.htm.png | Bin 0 -> 241 bytes test/render/flex/flexbox_generated.htm | 32 ++++ test/render/flex/flexbox_generated.htm.png | Bin 0 -> 251 bytes .../render/flex/flexbox_item-bottom-float.htm | 34 ++++ .../flex/flexbox_item-bottom-float.htm.png | Bin 0 -> 163 bytes test/render/flex/flexbox_item-clear.htm | 34 ++++ test/render/flex/flexbox_item-clear.htm.png | Bin 0 -> 684 bytes test/render/flex/flexbox_item-float.htm | 32 ++++ test/render/flex/flexbox_item-float.htm.png | Bin 0 -> 224 bytes test/render/flex/flexbox_item-top-float.htm | 33 ++++ .../flex/flexbox_item-top-float.htm.png | Bin 0 -> 163 bytes .../flex/flexbox_item-vertical-align.htm | 38 ++++ .../flex/flexbox_item-vertical-align.htm.png | Bin 0 -> 208 bytes ...ox_justifycontent-spacearound-negative.htm | 39 +++++ ...ustifycontent-spacearound-negative.htm.png | Bin 0 -> 359 bytes ...x_justifycontent-spacebetween-negative.htm | 39 +++++ ...stifycontent-spacebetween-negative.htm.png | Bin 0 -> 361 bytes ...exbox_justifycontent-spacebetween-only.htm | 35 ++++ ...x_justifycontent-spacebetween-only.htm.png | Bin 0 -> 233 bytes .../flex/flexbox_margin-auto-overflow.htm | 35 ++++ .../flex/flexbox_margin-auto-overflow.htm.png | Bin 0 -> 348 bytes test/render/flex/flexbox_margin.htm | 22 +++ test/render/flex/flexbox_margin.htm.png | Bin 0 -> 122 bytes test/render/flex/flexbox_nested-flex.htm | 28 +++ test/render/flex/flexbox_nested-flex.htm.png | Bin 0 -> 241 bytes test/render/flex/flexbox_object.htm | 26 +++ test/render/flex/flexbox_object.htm.png | Bin 0 -> 388 bytes test/render/flex/flexbox_order-box.htm | 43 +++++ test/render/flex/flexbox_order-box.htm.png | Bin 0 -> 426 bytes .../flexbox_order-noninteger-invalid.htm.png | Bin 0 -> 92 bytes test/render/flex/flexbox_order.htm | 54 ++++++ test/render/flex/flexbox_order.htm.png | Bin 0 -> 436 bytes test/render/flex/flexbox_stf-abspos.htm | 38 ++++ test/render/flex/flexbox_stf-abspos.htm.png | Bin 0 -> 116 bytes test/render/flex/flexbox_stf-fixpos.htm | 38 ++++ test/render/flex/flexbox_stf-fixpos.htm.png | Bin 0 -> 78 bytes test/render/flex/flexbox_stf-float.htm | 38 ++++ test/render/flex/flexbox_stf-float.htm.png | Bin 0 -> 116 bytes test/render/flex/flexbox_stf-inline-block.htm | 38 ++++ .../flex/flexbox_stf-inline-block.htm.png | Bin 0 -> 116 bytes .../render/flex/flexbox_stf-table-caption.htm | 38 ++++ .../flex/flexbox_stf-table-caption.htm.png | Bin 0 -> 81 bytes test/render/flex/flexbox_stf-table-cell.htm | 38 ++++ .../flex/flexbox_stf-table-cell.htm.png | Bin 0 -> 116 bytes .../flex/flexbox_stf-table-row-group.htm | 38 ++++ .../flex/flexbox_stf-table-row-group.htm.png | Bin 0 -> 116 bytes test/render/flex/flexbox_stf-table-row.htm | 38 ++++ .../render/flex/flexbox_stf-table-row.htm.png | Bin 0 -> 116 bytes test/render/flex/flexbox_stf-table.htm | 38 ++++ test/render/flex/flexbox_stf-table.htm.png | Bin 0 -> 116 bytes ...xbox_visibility-collapse-line-wrapping.htm | 40 +++++ ..._visibility-collapse-line-wrapping.htm.png | Bin 0 -> 395 bytes .../flex/flexbox_visibility-collapse.htm | 34 ++++ .../flex/flexbox_visibility-collapse.htm.png | Bin 0 -> 318 bytes test/render/flex/flexbox_width-overflow.htm | 30 ++++ .../flex/flexbox_width-overflow.htm.png | Bin 0 -> 80 bytes test/render/flex/flexbox_wrap-reverse.htm | 34 ++++ test/render/flex/flexbox_wrap-reverse.htm.png | Bin 0 -> 315 bytes test/render/flex/flexbox_wrap.htm | 34 ++++ test/render/flex/flexbox_wrap.htm.png | Bin 0 -> 315 bytes test/render/flex/flexible-box-float.htm | 46 +++++ .../flex/flexible-box-float.htm.chrome.png | Bin 0 -> 14012 bytes test/render/flex/flexible-box-float.htm.png | Bin 0 -> 815 bytes test/render/flex/flexible-order.htm | 70 ++++++++ test/render/flex/flexible-order.htm.png | Bin 0 -> 184 bytes ...able-with-infinite-max-intrinsic-width.htm | 21 +++ ...-with-infinite-max-intrinsic-width.htm.png | Bin 0 -> 575 bytes test/render/flex/justify-content_center.htm | 45 +++++ .../flex/justify-content_center.htm.png | Bin 0 -> 2927 bytes test/render/flex/justify-content_flex-end.htm | 44 +++++ .../flex/justify-content_flex-end.htm.png | Bin 0 -> 2104 bytes .../flex/justify-content_flex-start.htm | 44 +++++ .../flex/justify-content_flex-start.htm.png | Bin 0 -> 2087 bytes .../flex/justify-content_space-around.htm | 44 +++++ .../flex/justify-content_space-around.htm.png | Bin 0 -> 3050 bytes .../justify-content_space-between-001.htm | 44 +++++ .../justify-content_space-between-001.htm.png | Bin 0 -> 2933 bytes .../layout-algorithm_algo-cross-line-001.htm | 36 ++++ ...yout-algorithm_algo-cross-line-001.htm.png | Bin 0 -> 783 bytes .../layout-algorithm_algo-cross-line-002.htm | 37 ++++ ...yout-algorithm_algo-cross-line-002.htm.png | Bin 0 -> 783 bytes .../multi-line-wrap-reverse-row-reverse.htm | 68 ++++++++ ...ulti-line-wrap-reverse-row-reverse.htm.png | Bin 0 -> 362 bytes .../multi-line-wrap-with-column-reverse.htm | 67 +++++++ ...ulti-line-wrap-with-column-reverse.htm.png | Bin 0 -> 627 bytes .../flex/multi-line-wrap-with-row-reverse.htm | 64 +++++++ .../multi-line-wrap-with-row-reverse.htm.png | Bin 0 -> 384 bytes test/render/flex/negative-margins-001.htm | 51 ++++++ test/render/flex/negative-margins-001.htm.png | Bin 0 -> 587 bytes test/render/flex/order-001.htm | 42 +++++ test/render/flex/order-001.htm.png | Bin 0 -> 992 bytes .../render/flex/order-with-column-reverse.htm | 44 +++++ .../flex/order-with-column-reverse.htm.png | Bin 0 -> 545 bytes test/render/flex/order-with-row-reverse.htm | 42 +++++ .../flex/order-with-row-reverse.htm.png | Bin 0 -> 555 bytes test/render/flex/padding-overflow-crash.htm | 15 ++ .../flex/padding-overflow-crash.htm.png | Bin 0 -> 561 bytes test/render/flex/percentage-heights-004.htm | 66 +++++++ .../flex/percentage-heights-004.htm.png | Bin 0 -> 1083 bytes test/render/flex/support/a-green.css | 1 + test/render/flex/support/b-green.css | 1 + test/render/flex/support/c-red.css | 1 + test/render/flex/support/flexbox.css | 143 +++++++++++++++ test/render/flex/support/import-green.css | 1 + test/render/flex/support/import-red.css | 1 + test/render/flex/support/test-style.css | 18 ++ .../flex/table-as-item-auto-min-width.htm | 16 ++ .../flex/table-as-item-auto-min-width.htm.png | Bin 0 -> 577 bytes .../flex/table-as-item-fixed-min-width.htm | 21 +++ .../table-as-item-fixed-min-width.htm.png | Bin 0 -> 577 bytes .../flex/table-as-item-narrow-content-2.htm | 19 ++ .../table-as-item-narrow-content-2.htm.png | Bin 0 -> 575 bytes .../table-as-item-percent-width-cell-001.htm | 41 +++++ ...ble-as-item-percent-width-cell-001.htm.png | Bin 0 -> 236 bytes .../table-as-item-stretch-cross-size-4.htm | 34 ++++ ...table-as-item-stretch-cross-size-4.htm.png | Bin 0 -> 577 bytes ...able-with-infinite-max-intrinsic-width.htm | 19 ++ ...-with-infinite-max-intrinsic-width.htm.png | Bin 0 -> 584 bytes ...zero-content-size-with-scrollbar-crash.htm | 11 ++ ...-content-size-with-scrollbar-crash.htm.png | Bin 0 -> 89 bytes 783 files changed, 30694 insertions(+) create mode 100644 test/render/flex/--align-baseline.htm create mode 100644 test/render/flex/--align-self-001.htm create mode 100644 test/render/flex/--align-self-002.htm create mode 100644 test/render/flex/--align-self-003.htm create mode 100644 test/render/flex/--align-self-005.htm create mode 100644 test/render/flex/--align-self-006.htm create mode 100644 test/render/flex/--align-self-007.htm create mode 100644 test/render/flex/--align-self-008.htm create mode 100644 test/render/flex/--align-self-009.htm create mode 100644 test/render/flex/--align-self-010.htm create mode 100644 test/render/flex/--align-self-013.htm create mode 100644 test/render/flex/--auto-height-with-flex.htm create mode 100644 test/render/flex/--css-box-justify-content.htm create mode 100644 test/render/flex/--display-flex-001.htm create mode 100644 test/render/flex/--flex-002.htm create mode 100644 test/render/flex/--flex-003.htm create mode 100644 test/render/flex/--flex-004.htm create mode 100644 test/render/flex/--flex-basis-002.htm create mode 100644 test/render/flex/--flex-basis-003.htm create mode 100644 test/render/flex/--flex-basis-004.htm create mode 100644 test/render/flex/--flex-basis-005.htm create mode 100644 test/render/flex/--flex-basis-006.htm create mode 100644 test/render/flex/--flex-basis-010.htm create mode 100644 test/render/flex/--flex-basis-011.htm create mode 100644 test/render/flex/--flex-direction-row-001-visual.htm create mode 100644 test/render/flex/--flex-direction-row-reverse-001-visual.htm create mode 100644 test/render/flex/--flex-flexitem-childmargin.htm create mode 100644 test/render/flex/--flex-flexitem-percentage-prescation.htm create mode 100644 test/render/flex/--flex-flow-004.htm create mode 100644 test/render/flex/--flex-flow-007.htm create mode 100644 test/render/flex/--flex-flow-010.htm create mode 100644 test/render/flex/--flex-grow-001.htm create mode 100644 test/render/flex/--flex-grow-002.htm create mode 100644 test/render/flex/--flex-grow-007.htm create mode 100644 test/render/flex/--flex-inline.htm create mode 100644 test/render/flex/--flex-minimum-height-flex-items-003.htm create mode 100644 test/render/flex/--flex-minimum-height-flex-items-011.htm create mode 100644 test/render/flex/--flex-shrink-001.htm create mode 100644 test/render/flex/--flex-shrink-002.htm create mode 100644 test/render/flex/--flex-shrink-003.htm create mode 100644 test/render/flex/--flex-shrink-004.htm create mode 100644 test/render/flex/--flex-shrink-005.htm create mode 100644 test/render/flex/--flex-shrink-006.htm create mode 100644 test/render/flex/--flex-shrink-007.htm create mode 100644 test/render/flex/--flex-shrink-008.htm create mode 100644 test/render/flex/--flexbox-abspos-child-001a.htm create mode 100644 test/render/flex/--flexbox-abspos-child-001b.htm create mode 100644 test/render/flex/--flexbox-abspos-child-002.htm create mode 100644 test/render/flex/--flexbox-align-self-baseline-horiz-001a.htm create mode 100644 test/render/flex/--flexbox-align-self-baseline-horiz-001b.htm create mode 100644 test/render/flex/--flexbox-align-self-baseline-horiz-002.htm create mode 100644 test/render/flex/--flexbox-align-self-baseline-horiz-003.htm create mode 100644 test/render/flex/--flexbox-align-self-baseline-horiz-004.htm create mode 100644 test/render/flex/--flexbox-align-self-baseline-horiz-005.htm create mode 100644 test/render/flex/--flexbox-align-self-baseline-horiz-007.htm create mode 100644 test/render/flex/--flexbox-align-self-horiz-001-block.htm create mode 100644 test/render/flex/--flexbox-align-self-horiz-001-table.htm create mode 100644 test/render/flex/--flexbox-align-self-horiz-003.htm create mode 100644 test/render/flex/--flexbox-align-self-horiz-004.htm create mode 100644 test/render/flex/--flexbox-align-self-horiz-005.htm create mode 100644 test/render/flex/--flexbox-align-self-vert-001.htm create mode 100644 test/render/flex/--flexbox-align-self-vert-003.htm create mode 100644 test/render/flex/--flexbox-align-self-vert-004.htm create mode 100644 test/render/flex/--flexbox-baseline-align-self-baseline-horiz-001.htm create mode 100644 test/render/flex/--flexbox-baseline-align-self-baseline-vert-001.htm create mode 100644 test/render/flex/--flexbox-baseline-multi-item-horiz-001a.htm create mode 100644 test/render/flex/--flexbox-baseline-multi-item-horiz-001b.htm create mode 100644 test/render/flex/--flexbox-baseline-multi-item-vert-001a.htm create mode 100644 test/render/flex/--flexbox-baseline-multi-item-vert-001b.htm create mode 100644 test/render/flex/--flexbox-baseline-multi-line-horiz-001.htm create mode 100644 test/render/flex/--flexbox-baseline-multi-line-horiz-002.htm create mode 100644 test/render/flex/--flexbox-baseline-multi-line-horiz-003.htm create mode 100644 test/render/flex/--flexbox-baseline-multi-line-vert-001.htm create mode 100644 test/render/flex/--flexbox-baseline-multi-line-vert-002.htm create mode 100644 test/render/flex/--flexbox-baseline-single-item-001a.htm create mode 100644 test/render/flex/--flexbox-baseline-single-item-001b.htm create mode 100644 test/render/flex/--flexbox-basic-block-vert-001.htm create mode 100644 test/render/flex/--flexbox-break-request-horiz-002a.htm create mode 100644 test/render/flex/--flexbox-break-request-horiz-002b.htm create mode 100644 test/render/flex/--flexbox-break-request-vert-002a.htm create mode 100644 test/render/flex/--flexbox-break-request-vert-002b.htm create mode 100644 test/render/flex/--flexbox-collapsed-item-baseline-001.htm create mode 100644 test/render/flex/--flexbox-collapsed-item-horiz-001.htm create mode 100644 test/render/flex/--flexbox-collapsed-item-horiz-002.htm create mode 100644 test/render/flex/--flexbox-collapsed-item-horiz-003.htm create mode 100644 test/render/flex/--flexbox-flex-basis-content-001a.htm create mode 100644 test/render/flex/--flexbox-flex-basis-content-001b.htm create mode 100644 test/render/flex/--flexbox-flex-basis-content-002a.htm create mode 100644 test/render/flex/--flexbox-flex-basis-content-002b.htm create mode 100644 test/render/flex/--flexbox-flex-basis-content-003a.htm create mode 100644 test/render/flex/--flexbox-flex-basis-content-003b.htm create mode 100644 test/render/flex/--flexbox-flex-basis-content-004a.htm create mode 100644 test/render/flex/--flexbox-flex-flow-001.htm create mode 100644 test/render/flex/--flexbox-flex-flow-002.htm create mode 100644 test/render/flex/--flexbox-flex-wrap-default.htm create mode 100644 test/render/flex/--flexbox-flex-wrap-horiz-001.htm create mode 100644 test/render/flex/--flexbox-flex-wrap-nowrap.htm create mode 100644 test/render/flex/--flexbox-flex-wrap-vert-001.htm create mode 100644 test/render/flex/--flexbox-flex-wrap-vert-002.htm create mode 100644 test/render/flex/--flexbox-gap-position-absolute.htm create mode 100644 test/render/flex/--flexbox-items-as-stacking-contexts-001.htm create mode 100644 test/render/flex/--flexbox-justify-content-horiz-001a.htm create mode 100644 test/render/flex/--flexbox-justify-content-horiz-001b.htm create mode 100644 test/render/flex/--flexbox-justify-content-horiz-002.htm create mode 100644 test/render/flex/--flexbox-justify-content-horiz-003.htm create mode 100644 test/render/flex/--flexbox-justify-content-horiz-004.htm create mode 100644 test/render/flex/--flexbox-justify-content-horiz-005.htm create mode 100644 test/render/flex/--flexbox-justify-content-horiz-006.htm create mode 100644 test/render/flex/--flexbox-justify-content-vert-001a.htm create mode 100644 test/render/flex/--flexbox-justify-content-vert-001b.htm create mode 100644 test/render/flex/--flexbox-justify-content-vert-002.htm create mode 100644 test/render/flex/--flexbox-justify-content-vert-003.htm create mode 100644 test/render/flex/--flexbox-justify-content-vert-004.htm create mode 100644 test/render/flex/--flexbox-justify-content-vert-005.htm create mode 100644 test/render/flex/--flexbox-justify-content-vert-006.htm create mode 100644 test/render/flex/--flexbox-margin-auto-horiz-001.htm create mode 100644 test/render/flex/--flexbox-margin-auto-horiz-002.htm create mode 100644 test/render/flex/--flexbox-mbp-horiz-004.htm create mode 100644 test/render/flex/--flexbox-min-height-auto-001.htm create mode 100644 test/render/flex/--flexbox-min-height-auto-003.htm create mode 100644 test/render/flex/--flexbox-min-height-auto-004.htm create mode 100644 test/render/flex/--flexbox-min-width-auto-001.htm create mode 100644 test/render/flex/--flexbox-min-width-auto-003.htm create mode 100644 test/render/flex/--flexbox-min-width-auto-004.htm create mode 100644 test/render/flex/--flexbox-overflow-horiz-001.htm create mode 100644 test/render/flex/--flexbox-overflow-horiz-002.htm create mode 100644 test/render/flex/--flexbox-overflow-horiz-003.htm create mode 100644 test/render/flex/--flexbox-overflow-horiz-004.htm create mode 100644 test/render/flex/--flexbox-overflow-horiz-005.htm create mode 100644 test/render/flex/--flexbox-overflow-vert-001.htm create mode 100644 test/render/flex/--flexbox-overflow-vert-002.htm create mode 100644 test/render/flex/--flexbox-overflow-vert-003.htm create mode 100644 test/render/flex/--flexbox-overflow-vert-004.htm create mode 100644 test/render/flex/--flexbox-overflow-vert-005.htm create mode 100644 test/render/flex/--flexbox-paint-ordering-001.htm create mode 100644 test/render/flex/--flexbox-paint-ordering-002.htm create mode 100644 test/render/flex/--flexbox-root-node-001a.htm create mode 100644 test/render/flex/--flexbox-root-node-001b.htm create mode 100644 test/render/flex/--flexbox-single-line-clamp-1.htm create mode 100644 test/render/flex/--flexbox-single-line-clamp-3.htm create mode 100644 test/render/flex/--flexbox-sizing-horiz-001.htm create mode 100644 test/render/flex/--flexbox-sizing-horiz-002.htm create mode 100644 test/render/flex/--flexbox-sizing-vert-001.htm create mode 100644 test/render/flex/--flexbox-sizing-vert-002.htm create mode 100644 test/render/flex/--flexbox-with-pseudo-elements-003.htm create mode 100644 test/render/flex/--flexbox_align-content-stretch.htm create mode 100644 test/render/flex/--flexbox_align-items-baseline.htm create mode 100644 test/render/flex/--flexbox_align-self-baseline.htm create mode 100644 test/render/flex/--flexbox_block.htm create mode 100644 test/render/flex/--flexbox_direction-row-reverse.htm create mode 100644 test/render/flex/--flexbox_fbfc.htm create mode 100644 test/render/flex/--flexbox_fbfc2.htm create mode 100644 test/render/flex/--flexbox_flex-0-0-0-unitless.htm create mode 100644 test/render/flex/--flexbox_flex-0-0-0.htm create mode 100644 test/render/flex/--flexbox_flex-0-0-N-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-0-0-N.htm create mode 100644 test/render/flex/--flexbox_flex-0-0-Npercent-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-0-0-Npercent.htm create mode 100644 test/render/flex/--flexbox_flex-0-0.htm create mode 100644 test/render/flex/--flexbox_flex-0-1-0-unitless.htm create mode 100644 test/render/flex/--flexbox_flex-0-1-0.htm create mode 100644 test/render/flex/--flexbox_flex-0-1-N-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-0-1-N.htm create mode 100644 test/render/flex/--flexbox_flex-0-1-Npercent-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-0-1-Npercent.htm create mode 100644 test/render/flex/--flexbox_flex-0-1-auto-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-0-1.htm create mode 100644 test/render/flex/--flexbox_flex-0-N-0-unitless.htm create mode 100644 test/render/flex/--flexbox_flex-0-N-0.htm create mode 100644 test/render/flex/--flexbox_flex-0-N-N-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-0-N-N.htm create mode 100644 test/render/flex/--flexbox_flex-0-N-Npercent-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-0-N-Npercent.htm create mode 100644 test/render/flex/--flexbox_flex-0-N-auto-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-0-N-auto.htm.png create mode 100644 test/render/flex/--flexbox_flex-0-N.htm create mode 100644 test/render/flex/--flexbox_flex-0-auto.htm create mode 100644 test/render/flex/--flexbox_flex-1-0-0-unitless.htm create mode 100644 test/render/flex/--flexbox_flex-1-0-0.htm create mode 100644 test/render/flex/--flexbox_flex-1-0-N-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-1-0-N.htm create mode 100644 test/render/flex/--flexbox_flex-1-0-Npercent-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-1-0-Npercent.htm create mode 100644 test/render/flex/--flexbox_flex-1-0-auto.htm create mode 100644 test/render/flex/--flexbox_flex-1-0.htm create mode 100644 test/render/flex/--flexbox_flex-1-1-0-unitless.htm create mode 100644 test/render/flex/--flexbox_flex-1-1-0.htm create mode 100644 test/render/flex/--flexbox_flex-1-1-N-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-1-1-N.htm create mode 100644 test/render/flex/--flexbox_flex-1-1-Npercent-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-1-1-Npercent.htm create mode 100644 test/render/flex/--flexbox_flex-1-1-auto-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-1-1-auto.htm create mode 100644 test/render/flex/--flexbox_flex-1-1.htm create mode 100644 test/render/flex/--flexbox_flex-1-N-0-unitless.htm create mode 100644 test/render/flex/--flexbox_flex-1-N-0.htm create mode 100644 test/render/flex/--flexbox_flex-1-N-N-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-1-N-N.htm create mode 100644 test/render/flex/--flexbox_flex-1-N-Npercent-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-1-N-Npercent.htm create mode 100644 test/render/flex/--flexbox_flex-1-N-auto-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-1-N-auto.htm create mode 100644 test/render/flex/--flexbox_flex-1-N.htm create mode 100644 test/render/flex/--flexbox_flex-N-0-0-unitless.htm create mode 100644 test/render/flex/--flexbox_flex-N-0-0.htm create mode 100644 test/render/flex/--flexbox_flex-N-0-N-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-N-0-N.htm create mode 100644 test/render/flex/--flexbox_flex-N-0-Npercent-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-N-0-Npercent.htm create mode 100644 test/render/flex/--flexbox_flex-N-0-auto.htm create mode 100644 test/render/flex/--flexbox_flex-N-0.htm create mode 100644 test/render/flex/--flexbox_flex-N-1-0-unitless.htm create mode 100644 test/render/flex/--flexbox_flex-N-1-0.htm create mode 100644 test/render/flex/--flexbox_flex-N-1-N-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-N-1-N.htm create mode 100644 test/render/flex/--flexbox_flex-N-1-Npercent-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-N-1-Npercent.htm create mode 100644 test/render/flex/--flexbox_flex-N-1-auto-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-N-1-auto.htm create mode 100644 test/render/flex/--flexbox_flex-N-1.htm create mode 100644 test/render/flex/--flexbox_flex-N-N-0-unitless.htm create mode 100644 test/render/flex/--flexbox_flex-N-N-0.htm create mode 100644 test/render/flex/--flexbox_flex-N-N-N-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-N-N-N.htm create mode 100644 test/render/flex/--flexbox_flex-N-N-Npercent-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-N-N-Npercent.htm create mode 100644 test/render/flex/--flexbox_flex-N-N-auto-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-N-N-auto.htm create mode 100644 test/render/flex/--flexbox_flex-N-N.htm create mode 100644 test/render/flex/--flexbox_flex-auto.htm create mode 100644 test/render/flex/--flexbox_flex-basis-shrink.htm create mode 100644 test/render/flex/--flexbox_flex-basis.htm create mode 100644 test/render/flex/--flexbox_flex-formatting-interop.htm create mode 100644 test/render/flex/--flexbox_flex-initial.htm create mode 100644 test/render/flex/--flexbox_flex-natural-mixed-basis.htm create mode 100644 test/render/flex/--flexbox_flex-natural-variable-auto-basis.htm create mode 100644 test/render/flex/--flexbox_flex-natural-variable-zero-basis.htm create mode 100644 test/render/flex/--flexbox_flex-natural.htm create mode 100644 test/render/flex/--flexbox_flex-none-wrappable-content.htm create mode 100644 test/render/flex/--flexbox_inline-abspos.htm create mode 100644 test/render/flex/--flexbox_inline-float.htm create mode 100644 test/render/flex/--flexbox_inline.htm create mode 100644 test/render/flex/--flexbox_justifycontent-center.htm create mode 100644 test/render/flex/--flexbox_justifycontent-flex-end.htm create mode 100644 test/render/flex/--flexbox_justifycontent-flex-start.htm create mode 100644 test/render/flex/--flexbox_justifycontent-spacearound-only.htm create mode 100644 test/render/flex/--flexbox_justifycontent-spacearound.htm create mode 100644 test/render/flex/--flexbox_justifycontent-spacebetween.htm create mode 100644 test/render/flex/--flexbox_margin-auto.htm create mode 100644 test/render/flex/--flexbox_margin-left-ex.htm create mode 100644 test/render/flex/--flexbox_order-abspos-space-around.htm create mode 100644 test/render/flex/--flexbox_order-noninteger-invalid.htm create mode 100644 test/render/flex/--flexbox_rowspan-overflow-automatic.htm create mode 100644 test/render/flex/--flexbox_rowspan-overflow.htm create mode 100644 test/render/flex/--flexbox_rowspan.htm create mode 100644 test/render/flex/--flexbox_stf-table-singleline-2.htm create mode 100644 test/render/flex/--flexbox_stf-table-singleline.htm create mode 100644 test/render/flex/--flexbox_table-fixed-layout.htm create mode 100644 test/render/flex/--flexbox_wrap-long.htm create mode 100644 test/render/flex/--multi-line-wrap-reverse-column-reverse.htm create mode 100644 test/render/flex/--multiline-reverse-wrap-baseline.htm create mode 100644 test/render/flex/--multiline-shrink-to-fit.htm create mode 100644 test/render/flex/--negative-flex-margins-crash.htm create mode 100644 test/render/flex/--percentage-heights-006.htm create mode 100644 test/render/flex/--percentage-heights-007.htm create mode 100644 test/render/flex/--percentage-heights-008.htm create mode 100644 test/render/flex/--percentage-heights-009.htm create mode 100644 test/render/flex/--percentage-heights-010.htm create mode 100644 test/render/flex/--space-evenly-001.htm create mode 100644 test/render/flex/--table-as-item-fixed-min-width-2.htm create mode 100644 test/render/flex/--table-as-item-fixed-min-width-3.htm create mode 100644 test/render/flex/--table-as-item-flex-cross-size.htm create mode 100644 test/render/flex/--table-as-item-inflexible-in-column-1.htm create mode 100644 test/render/flex/--table-as-item-inflexible-in-column-2.htm create mode 100644 test/render/flex/--table-as-item-inflexible-in-row-1.htm create mode 100644 test/render/flex/--table-as-item-inflexible-in-row-2.htm create mode 100644 test/render/flex/--table-as-item-narrow-content.htm create mode 100644 test/render/flex/--table-as-item-specified-height.htm create mode 100644 test/render/flex/--table-as-item-specified-width.htm create mode 100644 test/render/flex/--table-as-item-stretch-cross-size-2.htm create mode 100644 test/render/flex/--table-as-item-stretch-cross-size-3.htm create mode 100644 test/render/flex/--table-as-item-stretch-cross-size.htm create mode 100644 test/render/flex/-align-content-001.htm create mode 100644 test/render/flex/-align-content-002.htm create mode 100644 test/render/flex/-align-content-003.htm create mode 100644 test/render/flex/-align-content-004.htm create mode 100644 test/render/flex/-align-content-005.htm create mode 100644 test/render/flex/-align-items-001.htm create mode 100644 test/render/flex/-align-items-002.htm create mode 100644 test/render/flex/-align-items-003.htm create mode 100644 test/render/flex/-contain-layout-suppress-baseline-002.htm create mode 100644 test/render/flex/-content-height-with-scrollbars.htm create mode 100644 test/render/flex/-cross-axis-scrollbar.htm create mode 100644 test/render/flex/-css-box-justify-content.htm create mode 100644 test/render/flex/-css-flexbox-row-reverse-wrap-reverse.htm create mode 100644 test/render/flex/-css-flexbox-row-reverse-wrap.htm create mode 100644 test/render/flex/-css-flexbox-row-reverse.htm create mode 100644 test/render/flex/-css-flexbox-row-wrap-reverse.htm create mode 100644 test/render/flex/-css-flexbox-row-wrap.htm create mode 100644 test/render/flex/-css-flexbox-row.htm create mode 100644 test/render/flex/-css-flexbox-test1.htm create mode 100644 test/render/flex/-direction-upright-002.htm create mode 100644 test/render/flex/-flex-002.htm create mode 100644 test/render/flex/-flex-003.htm create mode 100644 test/render/flex/-flex-004.htm create mode 100644 test/render/flex/-flex-aspect-ratio-019.htm create mode 100644 test/render/flex/-flex-aspect-ratio-020.htm create mode 100644 test/render/flex/-flex-aspect-ratio-021.htm create mode 100644 test/render/flex/-flex-aspect-ratio-022.htm create mode 100644 test/render/flex/-flex-direction-row-002-visual.htm create mode 100644 test/render/flex/-flex-direction-row-vertical.htm create mode 100644 test/render/flex/-flex-minimum-height-flex-items-022.htm create mode 100644 test/render/flex/-flex-minimum-width-flex-items-001.htm create mode 100644 test/render/flex/-flex-minimum-width-flex-items-003.htm create mode 100644 test/render/flex/-flex-minimum-width-flex-items-009.htm create mode 100644 test/render/flex/-flexbox-abspos-child-001b.htm create mode 100644 test/render/flex/-flexbox-abspos-child-002.htm create mode 100644 test/render/flex/-flexbox-align-self-baseline-horiz-006.htm create mode 100644 test/render/flex/-flexbox-align-self-baseline-horiz-008.htm create mode 100644 test/render/flex/-flexbox-align-self-horiz-002.htm create mode 100644 test/render/flex/-flexbox-align-self-vert-002.htm create mode 100644 test/render/flex/-flexbox-align-self-vert-rtl-001.htm create mode 100644 test/render/flex/-flexbox-align-self-vert-rtl-002.htm create mode 100644 test/render/flex/-flexbox-align-self-vert-rtl-003.htm create mode 100644 test/render/flex/-flexbox-align-self-vert-rtl-004.htm create mode 100644 test/render/flex/-flexbox-align-self-vert-rtl-005.htm create mode 100644 test/render/flex/-flexbox-anonymous-items-001.htm create mode 100644 test/render/flex/-flexbox-basic-block-horiz-001v.htm create mode 100644 test/render/flex/-flexbox-basic-block-vert-001v.htm create mode 100644 test/render/flex/-flexbox-flex-basis-content-004b.htm create mode 100644 test/render/flex/-flexbox-flex-wrap-default.htm create mode 100644 test/render/flex/-flexbox-flex-wrap-vert-001.htm create mode 100644 test/render/flex/-flexbox-flex-wrap-vert-002.htm create mode 100644 test/render/flex/-flexbox-flex-wrap-wrap-reverse.htm create mode 100644 test/render/flex/-flexbox-justify-content-wmvert-001.htm create mode 100644 test/render/flex/-flexbox-mbp-horiz-001-rtl-reverse.htm create mode 100644 test/render/flex/-flexbox-mbp-horiz-001-rtl.htm create mode 100644 test/render/flex/-flexbox-mbp-horiz-002v.htm create mode 100644 test/render/flex/-flexbox-mbp-horiz-003v.htm create mode 100644 test/render/flex/-flexbox-min-width-auto-002a.htm create mode 100644 test/render/flex/-flexbox-min-width-auto-002b.htm create mode 100644 test/render/flex/-flexbox-min-width-auto-002c.htm create mode 100644 test/render/flex/-flexbox-min-width-auto-005.htm create mode 100644 test/render/flex/-flexbox-min-width-auto-006.htm create mode 100644 test/render/flex/-flexbox-overflow-horiz-001.htm.htm create mode 100644 test/render/flex/-flexbox-whitespace-handling-001a.htm create mode 100644 test/render/flex/-flexbox-whitespace-handling-001b.htm create mode 100644 test/render/flex/-flexbox-writing-mode-001.htm create mode 100644 test/render/flex/-flexbox-writing-mode-002.htm create mode 100644 test/render/flex/-flexbox-writing-mode-003.htm create mode 100644 test/render/flex/-flexbox-writing-mode-004.htm create mode 100644 test/render/flex/-flexbox-writing-mode-005.htm create mode 100644 test/render/flex/-flexbox-writing-mode-006.htm create mode 100644 test/render/flex/-flexbox-writing-mode-007.htm create mode 100644 test/render/flex/-flexbox-writing-mode-008.htm create mode 100644 test/render/flex/-flexbox-writing-mode-009.htm create mode 100644 test/render/flex/-flexbox-writing-mode-010.htm create mode 100644 test/render/flex/-flexbox-writing-mode-011.htm create mode 100644 test/render/flex/-flexbox-writing-mode-012.htm create mode 100644 test/render/flex/-flexbox-writing-mode-013.htm create mode 100644 test/render/flex/-flexbox-writing-mode-014.htm create mode 100644 test/render/flex/-flexbox-writing-mode-015.htm create mode 100644 test/render/flex/-flexbox-writing-mode-016.htm create mode 100644 test/render/flex/-flexbox_align-items-stretch-writing-modes.htm create mode 100644 test/render/flex/-flexbox_columns-flexitems-2.htm create mode 100644 test/render/flex/-flexbox_columns-flexitems.htm create mode 100644 test/render/flex/-flexbox_rtl-direction.htm create mode 100644 test/render/flex/-flexbox_rtl-flow-reverse.htm create mode 100644 test/render/flex/-flexbox_rtl-flow.htm create mode 100644 test/render/flex/-flexbox_rtl-order.htm create mode 100644 test/render/flex/-flexbox_writing_mode_vertical_lays_out_contents_from_top_to_bottom.htm create mode 100644 test/render/flex/-justify-content-001.htm create mode 100644 test/render/flex/-justify-content-002.htm create mode 100644 test/render/flex/-justify-content-003.htm create mode 100644 test/render/flex/-justify-content-004.htm create mode 100644 test/render/flex/-justify-content-005.htm create mode 100644 test/render/flex/-nested-orthogonal-flexbox-relayout.htm create mode 100644 test/render/flex/-percentage-size-subitems-001.htm create mode 100644 test/render/flex/-table-as-item-stretch-cross-size-5.htm create mode 100644 test/render/flex/abspos-autopos-htb-ltr.htm create mode 100644 test/render/flex/abspos-autopos-htb-ltr.htm.png create mode 100644 test/render/flex/abspos-autopos-htb-rtl.htm create mode 100644 test/render/flex/abspos-autopos-htb-rtl.htm.png create mode 100644 test/render/flex/abspos-autopos-vlr-ltr.htm create mode 100644 test/render/flex/abspos-autopos-vlr-ltr.htm.png create mode 100644 test/render/flex/abspos-autopos-vlr-rtl.htm create mode 100644 test/render/flex/abspos-autopos-vlr-rtl.htm.png create mode 100644 test/render/flex/abspos-autopos-vrl-ltr.htm create mode 100644 test/render/flex/abspos-autopos-vrl-ltr.htm.png create mode 100644 test/render/flex/abspos-autopos-vrl-rtl.htm create mode 100644 test/render/flex/abspos-autopos-vrl-rtl.htm.png create mode 100644 test/render/flex/align-content-006.htm create mode 100644 test/render/flex/align-content-006.htm.png create mode 100644 test/render/flex/align-content_center.htm create mode 100644 test/render/flex/align-content_center.htm.png create mode 100644 test/render/flex/align-content_flex-end.htm create mode 100644 test/render/flex/align-content_flex-end.htm.png create mode 100644 test/render/flex/align-content_flex-start.htm create mode 100644 test/render/flex/align-content_flex-start.htm.png create mode 100644 test/render/flex/align-content_space-around.htm create mode 100644 test/render/flex/align-content_space-around.htm.png create mode 100644 test/render/flex/align-content_space-between.htm create mode 100644 test/render/flex/align-content_space-between.htm.png create mode 100644 test/render/flex/align-content_stretch.htm create mode 100644 test/render/flex/align-content_stretch.htm.png create mode 100644 test/render/flex/align-items-004.htm create mode 100644 test/render/flex/align-items-004.htm.png create mode 100644 test/render/flex/align-items-005.htm create mode 100644 test/render/flex/align-items-005.htm.png create mode 100644 test/render/flex/align-items-006.htm create mode 100644 test/render/flex/align-items-006.htm.png create mode 100644 test/render/flex/align-self-004.htm create mode 100644 test/render/flex/align-self-004.htm.png create mode 100644 test/render/flex/align-self-011.htm create mode 100644 test/render/flex/align-self-011.htm.png create mode 100644 test/render/flex/align-self-012.htm create mode 100644 test/render/flex/align-self-012.htm.png create mode 100644 test/render/flex/anonymous-block.htm create mode 100644 test/render/flex/anonymous-block.htm.png create mode 100644 test/render/flex/auto-height-column-with-border-and-padding.htm create mode 100644 test/render/flex/auto-height-column-with-border-and-padding.htm.png create mode 100644 test/render/flex/contain-layout-baseline-002.htm create mode 100644 test/render/flex/contain-layout-baseline-002.htm.png create mode 100644 test/render/flex/flex-001.htm create mode 100644 test/render/flex/flex-001.htm.png create mode 100644 test/render/flex/flex-align-content-center.htm create mode 100644 test/render/flex/flex-align-content-center.htm.png create mode 100644 test/render/flex/flex-align-content-end.htm create mode 100644 test/render/flex/flex-align-content-end.htm.png create mode 100644 test/render/flex/flex-align-content-space-around.htm create mode 100644 test/render/flex/flex-align-content-space-around.htm.png create mode 100644 test/render/flex/flex-align-content-space-between.htm create mode 100644 test/render/flex/flex-align-content-space-between.htm.png create mode 100644 test/render/flex/flex-align-content-start.htm create mode 100644 test/render/flex/flex-align-content-start.htm.png create mode 100644 test/render/flex/flex-base.htm create mode 100644 test/render/flex/flex-base.htm.png create mode 100644 test/render/flex/flex-basis-001.htm create mode 100644 test/render/flex/flex-basis-001.htm.png create mode 100644 test/render/flex/flex-basis-007.htm create mode 100644 test/render/flex/flex-basis-007.htm.png create mode 100644 test/render/flex/flex-basis-008.htm create mode 100644 test/render/flex/flex-basis-008.htm.png create mode 100644 test/render/flex/flex-box-wrap.htm create mode 100644 test/render/flex/flex-box-wrap.htm.png create mode 100644 test/render/flex/flex-container-margin.htm create mode 100644 test/render/flex/flex-container-margin.htm.png create mode 100644 test/render/flex/flex-direction-column-001-visual.htm create mode 100644 test/render/flex/flex-direction-column-001-visual.htm.png create mode 100644 test/render/flex/flex-direction-column-reverse-001-visual.htm create mode 100644 test/render/flex/flex-direction-column-reverse-001-visual.htm.png create mode 100644 test/render/flex/flex-direction-column-reverse-002-visual.htm create mode 100644 test/render/flex/flex-direction-column-reverse-002-visual.htm.png create mode 100644 test/render/flex/flex-direction-column-reverse.htm create mode 100644 test/render/flex/flex-direction-column-reverse.htm.png create mode 100644 test/render/flex/flex-direction-column.htm create mode 100644 test/render/flex/flex-direction-column.htm.png create mode 100644 test/render/flex/flex-direction-row-reverse-002-visual.htm create mode 100644 test/render/flex/flex-direction-row-reverse-002-visual.htm.png create mode 100644 test/render/flex/flex-direction-row-reverse.htm create mode 100644 test/render/flex/flex-direction-row-reverse.htm.png create mode 100644 test/render/flex/flex-direction.htm create mode 100644 test/render/flex/flex-direction.htm.png create mode 100644 test/render/flex/flex-flow-001.htm create mode 100644 test/render/flex/flex-flow-001.htm.png create mode 100644 test/render/flex/flex-flow-002.htm create mode 100644 test/render/flex/flex-flow-002.htm.png create mode 100644 test/render/flex/flex-flow-003.htm create mode 100644 test/render/flex/flex-flow-003.htm.png create mode 100644 test/render/flex/flex-flow-005.htm create mode 100644 test/render/flex/flex-flow-005.htm.png create mode 100644 test/render/flex/flex-flow-006.htm create mode 100644 test/render/flex/flex-flow-006.htm.png create mode 100644 test/render/flex/flex-flow-008.htm create mode 100644 test/render/flex/flex-flow-008.htm.png create mode 100644 test/render/flex/flex-flow-009.htm create mode 100644 test/render/flex/flex-flow-009.htm.png create mode 100644 test/render/flex/flex-flow-011.htm create mode 100644 test/render/flex/flex-flow-011.htm.png create mode 100644 test/render/flex/flex-flow-012.htm create mode 100644 test/render/flex/flex-flow-012.htm.png create mode 100644 test/render/flex/flex-grow-003.htm create mode 100644 test/render/flex/flex-grow-003.htm.png create mode 100644 test/render/flex/flex-grow-004.htm create mode 100644 test/render/flex/flex-grow-004.htm.png create mode 100644 test/render/flex/flex-grow-005.htm create mode 100644 test/render/flex/flex-grow-005.htm.png create mode 100644 test/render/flex/flex-grow-006.htm create mode 100644 test/render/flex/flex-grow-006.htm.png create mode 100644 test/render/flex/flex-margin-no-collapse.htm create mode 100644 test/render/flex/flex-margin-no-collapse.htm.png create mode 100644 test/render/flex/flex-minimum-height-flex-items-001.htm create mode 100644 test/render/flex/flex-minimum-height-flex-items-001.htm.png create mode 100644 test/render/flex/flex-minimum-height-flex-items-002.htm create mode 100644 test/render/flex/flex-minimum-height-flex-items-002.htm.png create mode 100644 test/render/flex/flex-minimum-width-flex-items-002.htm create mode 100644 test/render/flex/flex-minimum-width-flex-items-002.htm.png create mode 100644 test/render/flex/flex-order.htm create mode 100644 test/render/flex/flex-order.htm.png create mode 100644 test/render/flex/flexbox-align-items-center-nested-001.htm create mode 100644 test/render/flex/flexbox-align-items-center-nested-001.htm.png create mode 100644 test/render/flex/flexbox-align-self-stretch-vert-001.htm create mode 100644 test/render/flex/flexbox-align-self-stretch-vert-001.htm.png create mode 100644 test/render/flex/flexbox-align-self-stretch-vert-002.htm create mode 100644 test/render/flex/flexbox-align-self-stretch-vert-002.htm.png create mode 100644 test/render/flex/flexbox-anonymous-items-001.htm create mode 100644 test/render/flex/flexbox-anonymous-items-001.htm.png create mode 100644 test/render/flex/flexbox-baseline-empty-001a.htm create mode 100644 test/render/flex/flexbox-baseline-empty-001a.htm.png create mode 100644 test/render/flex/flexbox-baseline-empty-001b.htm create mode 100644 test/render/flex/flexbox-baseline-empty-001b.htm.png create mode 100644 test/render/flex/flexbox-basic-block-horiz-001.htm create mode 100644 test/render/flex/flexbox-basic-block-horiz-001.htm.png create mode 100644 test/render/flex/flexbox-basic-block-vert-001.htm.png create mode 100644 test/render/flex/flexbox-break-request-horiz-001a.htm create mode 100644 test/render/flex/flexbox-break-request-horiz-001a.htm.png create mode 100644 test/render/flex/flexbox-break-request-horiz-001b.htm create mode 100644 test/render/flex/flexbox-break-request-horiz-001b.htm.png create mode 100644 test/render/flex/flexbox-break-request-vert-001a.htm create mode 100644 test/render/flex/flexbox-break-request-vert-001a.htm.png create mode 100644 test/render/flex/flexbox-break-request-vert-001b.htm create mode 100644 test/render/flex/flexbox-break-request-vert-001b.htm.png create mode 100644 test/render/flex/flexbox-flex-direction-column-reverse.htm create mode 100644 test/render/flex/flexbox-flex-direction-column-reverse.htm.png create mode 100644 test/render/flex/flexbox-flex-direction-column.htm create mode 100644 test/render/flex/flexbox-flex-direction-column.htm.png create mode 100644 test/render/flex/flexbox-flex-direction-default.htm create mode 100644 test/render/flex/flexbox-flex-direction-default.htm.png create mode 100644 test/render/flex/flexbox-flex-direction-row-reverse.htm create mode 100644 test/render/flex/flexbox-flex-direction-row-reverse.htm.png create mode 100644 test/render/flex/flexbox-flex-direction-row.htm create mode 100644 test/render/flex/flexbox-flex-direction-row.htm.png create mode 100644 test/render/flex/flexbox-flex-wrap-flexing.htm create mode 100644 test/render/flex/flexbox-flex-wrap-flexing.htm.png create mode 100644 test/render/flex/flexbox-flex-wrap-horiz-002.htm create mode 100644 test/render/flex/flexbox-flex-wrap-horiz-002.htm.png create mode 100644 test/render/flex/flexbox-flex-wrap-wrap.htm create mode 100644 test/render/flex/flexbox-flex-wrap-wrap.htm.png create mode 100644 test/render/flex/flexbox-items-as-stacking-contexts-002.htm create mode 100644 test/render/flex/flexbox-items-as-stacking-contexts-002.htm.png create mode 100644 test/render/flex/flexbox-items-as-stacking-contexts-003.htm create mode 100644 test/render/flex/flexbox-items-as-stacking-contexts-003.htm.png create mode 100644 test/render/flex/flexbox-mbp-horiz-001-reverse.htm create mode 100644 test/render/flex/flexbox-mbp-horiz-001-reverse.htm.png create mode 100644 test/render/flex/flexbox-mbp-horiz-001.htm create mode 100644 test/render/flex/flexbox-mbp-horiz-001.htm.png create mode 100644 test/render/flex/flexbox-mbp-horiz-002a.htm create mode 100644 test/render/flex/flexbox-mbp-horiz-002a.htm.png create mode 100644 test/render/flex/flexbox-mbp-horiz-002b.htm create mode 100644 test/render/flex/flexbox-mbp-horiz-002b.htm.png create mode 100644 test/render/flex/flexbox-mbp-horiz-003-reverse.htm create mode 100644 test/render/flex/flexbox-mbp-horiz-003-reverse.htm.png create mode 100644 test/render/flex/flexbox-mbp-horiz-003.htm create mode 100644 test/render/flex/flexbox-mbp-horiz-003.htm.png create mode 100644 test/render/flex/flexbox-order-from-lowest.htm create mode 100644 test/render/flex/flexbox-order-from-lowest.htm.png create mode 100644 test/render/flex/flexbox-order-only-flexitems.htm create mode 100644 test/render/flex/flexbox-order-only-flexitems.htm.png create mode 100644 test/render/flex/flexbox-paint-ordering-003.htm create mode 100644 test/render/flex/flexbox-paint-ordering-003.htm.png create mode 100644 test/render/flex/flexbox-single-line-clamp-2.htm create mode 100644 test/render/flex/flexbox-single-line-clamp-2.htm.png create mode 100644 test/render/flex/flexbox-table-fixup-001.htm create mode 100644 test/render/flex/flexbox-table-fixup-001.htm.png create mode 100644 test/render/flex/flexbox-whitespace-handling-002.htm create mode 100644 test/render/flex/flexbox-whitespace-handling-002.htm.png create mode 100644 test/render/flex/flexbox-with-pseudo-elements-001.htm create mode 100644 test/render/flex/flexbox-with-pseudo-elements-001.htm.png create mode 100644 test/render/flex/flexbox-with-pseudo-elements-002.htm create mode 100644 test/render/flex/flexbox-with-pseudo-elements-002.htm.png create mode 100644 test/render/flex/flexbox_absolute-atomic.htm create mode 100644 test/render/flex/flexbox_absolute-atomic.htm.png create mode 100644 test/render/flex/flexbox_align-content-center.htm create mode 100644 test/render/flex/flexbox_align-content-center.htm.png create mode 100644 test/render/flex/flexbox_align-content-flexend.htm create mode 100644 test/render/flex/flexbox_align-content-flexend.htm.png create mode 100644 test/render/flex/flexbox_align-content-flexstart.htm create mode 100644 test/render/flex/flexbox_align-content-flexstart.htm.png create mode 100644 test/render/flex/flexbox_align-content-spacearound.htm create mode 100644 test/render/flex/flexbox_align-content-spacearound.htm.png create mode 100644 test/render/flex/flexbox_align-content-spacebetween.htm create mode 100644 test/render/flex/flexbox_align-content-spacebetween.htm.png create mode 100644 test/render/flex/flexbox_align-content-stretch-2.htm create mode 100644 test/render/flex/flexbox_align-content-stretch-2.htm.png create mode 100644 test/render/flex/flexbox_align-items-center-2.htm create mode 100644 test/render/flex/flexbox_align-items-center-2.htm.png create mode 100644 test/render/flex/flexbox_align-items-center.htm create mode 100644 test/render/flex/flexbox_align-items-center.htm.png create mode 100644 test/render/flex/flexbox_align-items-flexend-2.htm create mode 100644 test/render/flex/flexbox_align-items-flexend-2.htm.png create mode 100644 test/render/flex/flexbox_align-items-flexend.htm create mode 100644 test/render/flex/flexbox_align-items-flexend.htm.png create mode 100644 test/render/flex/flexbox_align-items-flexstart-2.htm create mode 100644 test/render/flex/flexbox_align-items-flexstart-2.htm.png create mode 100644 test/render/flex/flexbox_align-items-flexstart.htm create mode 100644 test/render/flex/flexbox_align-items-flexstart.htm.png create mode 100644 test/render/flex/flexbox_align-items-stretch-2.htm create mode 100644 test/render/flex/flexbox_align-items-stretch-2.htm.png create mode 100644 test/render/flex/flexbox_align-items-stretch.htm create mode 100644 test/render/flex/flexbox_align-items-stretch.htm.png create mode 100644 test/render/flex/flexbox_align-self-auto.htm create mode 100644 test/render/flex/flexbox_align-self-auto.htm.png create mode 100644 test/render/flex/flexbox_align-self-center.htm create mode 100644 test/render/flex/flexbox_align-self-center.htm.png create mode 100644 test/render/flex/flexbox_align-self-flexend.htm create mode 100644 test/render/flex/flexbox_align-self-flexend.htm.png create mode 100644 test/render/flex/flexbox_align-self-flexstart.htm create mode 100644 test/render/flex/flexbox_align-self-flexstart.htm.png create mode 100644 test/render/flex/flexbox_align-self-stretch.htm create mode 100644 test/render/flex/flexbox_align-self-stretch.htm.png create mode 100644 test/render/flex/flexbox_box-clear.htm create mode 100644 test/render/flex/flexbox_box-clear.htm.png create mode 100644 test/render/flex/flexbox_columns.htm create mode 100644 test/render/flex/flexbox_columns.htm.png create mode 100644 test/render/flex/flexbox_direction-column-reverse.htm create mode 100644 test/render/flex/flexbox_direction-column-reverse.htm.png create mode 100644 test/render/flex/flexbox_direction-column.htm create mode 100644 test/render/flex/flexbox_direction-column.htm.png create mode 100644 test/render/flex/flexbox_display.htm create mode 100644 test/render/flex/flexbox_display.htm.png create mode 100644 test/render/flex/flexbox_first-line.htm create mode 100644 test/render/flex/flexbox_first-line.htm.png create mode 100644 test/render/flex/flexbox_flex-0-0-1-unitless-basis.htm create mode 100644 test/render/flex/flexbox_flex-0-0-1-unitless-basis.htm.png create mode 100644 test/render/flex/flexbox_flex-0-0-N-unitless-basis.htm create mode 100644 test/render/flex/flexbox_flex-0-0-N-unitless-basis.htm.png create mode 100644 test/render/flex/flexbox_flex-0-0-auto-shrink.htm create mode 100644 test/render/flex/flexbox_flex-0-0-auto-shrink.htm.png create mode 100644 test/render/flex/flexbox_flex-0-0-auto.htm create mode 100644 test/render/flex/flexbox_flex-0-0-auto.htm.png create mode 100644 test/render/flex/flexbox_flex-0-1-1-unitless-basis.htm create mode 100644 test/render/flex/flexbox_flex-0-1-1-unitless-basis.htm.png create mode 100644 test/render/flex/flexbox_flex-0-1-N-unitless-basis.htm create mode 100644 test/render/flex/flexbox_flex-0-1-N-unitless-basis.htm.png create mode 100644 test/render/flex/flexbox_flex-0-1-auto.htm create mode 100644 test/render/flex/flexbox_flex-0-1-auto.htm.png create mode 100644 test/render/flex/flexbox_flex-0-N-auto.htm create mode 100644 test/render/flex/flexbox_flex-0-N-auto.htm.png create mode 100644 test/render/flex/flexbox_flex-1-0-auto-shrink.htm create mode 100644 test/render/flex/flexbox_flex-1-0-auto-shrink.htm.png create mode 100644 test/render/flex/flexbox_flex-N-0-auto-shrink.htm create mode 100644 test/render/flex/flexbox_flex-N-0-auto-shrink.htm.png create mode 100644 test/render/flex/flexbox_flex-initial-2.htm create mode 100644 test/render/flex/flexbox_flex-initial-2.htm.png create mode 100644 test/render/flex/flexbox_flex-natural-mixed-basis-auto.htm create mode 100644 test/render/flex/flexbox_flex-natural-mixed-basis-auto.htm.png create mode 100644 test/render/flex/flexbox_flex-none.htm create mode 100644 test/render/flex/flexbox_flex-none.htm.png create mode 100644 test/render/flex/flexbox_flow-column-reverse-wrap-reverse.htm create mode 100644 test/render/flex/flexbox_flow-column-reverse-wrap-reverse.htm.png create mode 100644 test/render/flex/flexbox_flow-column-reverse-wrap.htm create mode 100644 test/render/flex/flexbox_flow-column-reverse-wrap.htm.png create mode 100644 test/render/flex/flexbox_flow-column-wrap-reverse.htm create mode 100644 test/render/flex/flexbox_flow-column-wrap-reverse.htm.png create mode 100644 test/render/flex/flexbox_flow-column-wrap.htm create mode 100644 test/render/flex/flexbox_flow-column-wrap.htm.png create mode 100644 test/render/flex/flexbox_flow-row-wrap-reverse.htm create mode 100644 test/render/flex/flexbox_flow-row-wrap-reverse.htm.png create mode 100644 test/render/flex/flexbox_flow-row-wrap.htm create mode 100644 test/render/flex/flexbox_flow-row-wrap.htm.png create mode 100644 test/render/flex/flexbox_generated-flex.htm create mode 100644 test/render/flex/flexbox_generated-flex.htm.png create mode 100644 test/render/flex/flexbox_generated-nested-flex.htm create mode 100644 test/render/flex/flexbox_generated-nested-flex.htm.png create mode 100644 test/render/flex/flexbox_generated.htm create mode 100644 test/render/flex/flexbox_generated.htm.png create mode 100644 test/render/flex/flexbox_item-bottom-float.htm create mode 100644 test/render/flex/flexbox_item-bottom-float.htm.png create mode 100644 test/render/flex/flexbox_item-clear.htm create mode 100644 test/render/flex/flexbox_item-clear.htm.png create mode 100644 test/render/flex/flexbox_item-float.htm create mode 100644 test/render/flex/flexbox_item-float.htm.png create mode 100644 test/render/flex/flexbox_item-top-float.htm create mode 100644 test/render/flex/flexbox_item-top-float.htm.png create mode 100644 test/render/flex/flexbox_item-vertical-align.htm create mode 100644 test/render/flex/flexbox_item-vertical-align.htm.png create mode 100644 test/render/flex/flexbox_justifycontent-spacearound-negative.htm create mode 100644 test/render/flex/flexbox_justifycontent-spacearound-negative.htm.png create mode 100644 test/render/flex/flexbox_justifycontent-spacebetween-negative.htm create mode 100644 test/render/flex/flexbox_justifycontent-spacebetween-negative.htm.png create mode 100644 test/render/flex/flexbox_justifycontent-spacebetween-only.htm create mode 100644 test/render/flex/flexbox_justifycontent-spacebetween-only.htm.png create mode 100644 test/render/flex/flexbox_margin-auto-overflow.htm create mode 100644 test/render/flex/flexbox_margin-auto-overflow.htm.png create mode 100644 test/render/flex/flexbox_margin.htm create mode 100644 test/render/flex/flexbox_margin.htm.png create mode 100644 test/render/flex/flexbox_nested-flex.htm create mode 100644 test/render/flex/flexbox_nested-flex.htm.png create mode 100644 test/render/flex/flexbox_object.htm create mode 100644 test/render/flex/flexbox_object.htm.png create mode 100644 test/render/flex/flexbox_order-box.htm create mode 100644 test/render/flex/flexbox_order-box.htm.png create mode 100644 test/render/flex/flexbox_order-noninteger-invalid.htm.png create mode 100644 test/render/flex/flexbox_order.htm create mode 100644 test/render/flex/flexbox_order.htm.png create mode 100644 test/render/flex/flexbox_stf-abspos.htm create mode 100644 test/render/flex/flexbox_stf-abspos.htm.png create mode 100644 test/render/flex/flexbox_stf-fixpos.htm create mode 100644 test/render/flex/flexbox_stf-fixpos.htm.png create mode 100644 test/render/flex/flexbox_stf-float.htm create mode 100644 test/render/flex/flexbox_stf-float.htm.png create mode 100644 test/render/flex/flexbox_stf-inline-block.htm create mode 100644 test/render/flex/flexbox_stf-inline-block.htm.png create mode 100644 test/render/flex/flexbox_stf-table-caption.htm create mode 100644 test/render/flex/flexbox_stf-table-caption.htm.png create mode 100644 test/render/flex/flexbox_stf-table-cell.htm create mode 100644 test/render/flex/flexbox_stf-table-cell.htm.png create mode 100644 test/render/flex/flexbox_stf-table-row-group.htm create mode 100644 test/render/flex/flexbox_stf-table-row-group.htm.png create mode 100644 test/render/flex/flexbox_stf-table-row.htm create mode 100644 test/render/flex/flexbox_stf-table-row.htm.png create mode 100644 test/render/flex/flexbox_stf-table.htm create mode 100644 test/render/flex/flexbox_stf-table.htm.png create mode 100644 test/render/flex/flexbox_visibility-collapse-line-wrapping.htm create mode 100644 test/render/flex/flexbox_visibility-collapse-line-wrapping.htm.png create mode 100644 test/render/flex/flexbox_visibility-collapse.htm create mode 100644 test/render/flex/flexbox_visibility-collapse.htm.png create mode 100644 test/render/flex/flexbox_width-overflow.htm create mode 100644 test/render/flex/flexbox_width-overflow.htm.png create mode 100644 test/render/flex/flexbox_wrap-reverse.htm create mode 100644 test/render/flex/flexbox_wrap-reverse.htm.png create mode 100644 test/render/flex/flexbox_wrap.htm create mode 100644 test/render/flex/flexbox_wrap.htm.png create mode 100644 test/render/flex/flexible-box-float.htm create mode 100644 test/render/flex/flexible-box-float.htm.chrome.png create mode 100644 test/render/flex/flexible-box-float.htm.png create mode 100644 test/render/flex/flexible-order.htm create mode 100644 test/render/flex/flexible-order.htm.png create mode 100644 test/render/flex/item-with-table-with-infinite-max-intrinsic-width.htm create mode 100644 test/render/flex/item-with-table-with-infinite-max-intrinsic-width.htm.png create mode 100644 test/render/flex/justify-content_center.htm create mode 100644 test/render/flex/justify-content_center.htm.png create mode 100644 test/render/flex/justify-content_flex-end.htm create mode 100644 test/render/flex/justify-content_flex-end.htm.png create mode 100644 test/render/flex/justify-content_flex-start.htm create mode 100644 test/render/flex/justify-content_flex-start.htm.png create mode 100644 test/render/flex/justify-content_space-around.htm create mode 100644 test/render/flex/justify-content_space-around.htm.png create mode 100644 test/render/flex/justify-content_space-between-001.htm create mode 100644 test/render/flex/justify-content_space-between-001.htm.png create mode 100644 test/render/flex/layout-algorithm_algo-cross-line-001.htm create mode 100644 test/render/flex/layout-algorithm_algo-cross-line-001.htm.png create mode 100644 test/render/flex/layout-algorithm_algo-cross-line-002.htm create mode 100644 test/render/flex/layout-algorithm_algo-cross-line-002.htm.png create mode 100644 test/render/flex/multi-line-wrap-reverse-row-reverse.htm create mode 100644 test/render/flex/multi-line-wrap-reverse-row-reverse.htm.png create mode 100644 test/render/flex/multi-line-wrap-with-column-reverse.htm create mode 100644 test/render/flex/multi-line-wrap-with-column-reverse.htm.png create mode 100644 test/render/flex/multi-line-wrap-with-row-reverse.htm create mode 100644 test/render/flex/multi-line-wrap-with-row-reverse.htm.png create mode 100644 test/render/flex/negative-margins-001.htm create mode 100644 test/render/flex/negative-margins-001.htm.png create mode 100644 test/render/flex/order-001.htm create mode 100644 test/render/flex/order-001.htm.png create mode 100644 test/render/flex/order-with-column-reverse.htm create mode 100644 test/render/flex/order-with-column-reverse.htm.png create mode 100644 test/render/flex/order-with-row-reverse.htm create mode 100644 test/render/flex/order-with-row-reverse.htm.png create mode 100644 test/render/flex/padding-overflow-crash.htm create mode 100644 test/render/flex/padding-overflow-crash.htm.png create mode 100644 test/render/flex/percentage-heights-004.htm create mode 100644 test/render/flex/percentage-heights-004.htm.png create mode 100644 test/render/flex/support/a-green.css create mode 100644 test/render/flex/support/b-green.css create mode 100644 test/render/flex/support/c-red.css create mode 100644 test/render/flex/support/flexbox.css create mode 100644 test/render/flex/support/import-green.css create mode 100644 test/render/flex/support/import-red.css create mode 100644 test/render/flex/support/test-style.css create mode 100644 test/render/flex/table-as-item-auto-min-width.htm create mode 100644 test/render/flex/table-as-item-auto-min-width.htm.png create mode 100644 test/render/flex/table-as-item-fixed-min-width.htm create mode 100644 test/render/flex/table-as-item-fixed-min-width.htm.png create mode 100644 test/render/flex/table-as-item-narrow-content-2.htm create mode 100644 test/render/flex/table-as-item-narrow-content-2.htm.png create mode 100644 test/render/flex/table-as-item-percent-width-cell-001.htm create mode 100644 test/render/flex/table-as-item-percent-width-cell-001.htm.png create mode 100644 test/render/flex/table-as-item-stretch-cross-size-4.htm create mode 100644 test/render/flex/table-as-item-stretch-cross-size-4.htm.png create mode 100644 test/render/flex/table-with-infinite-max-intrinsic-width.htm create mode 100644 test/render/flex/table-with-infinite-max-intrinsic-width.htm.png create mode 100644 test/render/flex/zero-content-size-with-scrollbar-crash.htm create mode 100644 test/render/flex/zero-content-size-with-scrollbar-crash.htm.png diff --git a/test/render/flex/--align-baseline.htm b/test/render/flex/--align-baseline.htm new file mode 100644 index 000000000..85db4d717 --- /dev/null +++ b/test/render/flex/--align-baseline.htm @@ -0,0 +1,30 @@ + + + + + + + + + + + +
+

This text

+

should be left aligned.

+
+ +
+

This text

+

should be right aligned.

+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--align-self-001.htm b/test/render/flex/--align-self-001.htm new file mode 100644 index 000000000..00f3a63e5 --- /dev/null +++ b/test/render/flex/--align-self-001.htm @@ -0,0 +1,45 @@ + + + + +CSS Flexbox Test: align-self - flex-start + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--align-self-002.htm b/test/render/flex/--align-self-002.htm new file mode 100644 index 000000000..1b7fca208 --- /dev/null +++ b/test/render/flex/--align-self-002.htm @@ -0,0 +1,45 @@ + + + + +CSS Flexbox Test: align-self - flex-end + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--align-self-003.htm b/test/render/flex/--align-self-003.htm new file mode 100644 index 000000000..b984225a4 --- /dev/null +++ b/test/render/flex/--align-self-003.htm @@ -0,0 +1,52 @@ + + + + +CSS Flexbox Test: align-self - center + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--align-self-005.htm b/test/render/flex/--align-self-005.htm new file mode 100644 index 000000000..c2624e089 --- /dev/null +++ b/test/render/flex/--align-self-005.htm @@ -0,0 +1,46 @@ + + + + +CSS Flexbox Test: align-self - stretch (height: number) + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--align-self-006.htm b/test/render/flex/--align-self-006.htm new file mode 100644 index 000000000..439048881 --- /dev/null +++ b/test/render/flex/--align-self-006.htm @@ -0,0 +1,52 @@ + + + + +CSS Flexbox Test: align-self - baseline + + + + + + + + +

Test passes if the underline of all 'a' characters within black border box is horizontal and no breaking.

+
+ + + + +
+ + + + \ No newline at end of file diff --git a/test/render/flex/--align-self-007.htm b/test/render/flex/--align-self-007.htm new file mode 100644 index 000000000..01cd936d7 --- /dev/null +++ b/test/render/flex/--align-self-007.htm @@ -0,0 +1,47 @@ + + + + +CSS Flexbox Test: align-self - auto and align-items - flex-start + + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--align-self-008.htm b/test/render/flex/--align-self-008.htm new file mode 100644 index 000000000..c9e25efb6 --- /dev/null +++ b/test/render/flex/--align-self-008.htm @@ -0,0 +1,46 @@ + + + + +CSS Flexbox Test: align-self - auto and align-items - flex-end + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--align-self-009.htm b/test/render/flex/--align-self-009.htm new file mode 100644 index 000000000..10e3fed24 --- /dev/null +++ b/test/render/flex/--align-self-009.htm @@ -0,0 +1,53 @@ + + + + +CSS Flexbox Test: align-self - auto and align-items - center + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--align-self-010.htm b/test/render/flex/--align-self-010.htm new file mode 100644 index 000000000..e134f85eb --- /dev/null +++ b/test/render/flex/--align-self-010.htm @@ -0,0 +1,53 @@ + + + + +CSS Flexbox Test: align-self - auto and align-items - baseline + + + + + + + + +

Test passes if the underline of all 'a' characters within black border box is horizontal and no breaking.

+
+ + + + +
+ + + + \ No newline at end of file diff --git a/test/render/flex/--align-self-013.htm b/test/render/flex/--align-self-013.htm new file mode 100644 index 000000000..1933336ba --- /dev/null +++ b/test/render/flex/--align-self-013.htm @@ -0,0 +1,46 @@ + + + + +CSS Flexbox Test: align-self - invalid if applied to flex container + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--auto-height-with-flex.htm b/test/render/flex/--auto-height-with-flex.htm new file mode 100644 index 000000000..d2cf59030 --- /dev/null +++ b/test/render/flex/--auto-height-with-flex.htm @@ -0,0 +1,14 @@ + + + + + + +
+
Header
+
Flexible content
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--css-box-justify-content.htm b/test/render/flex/--css-box-justify-content.htm new file mode 100644 index 000000000..4325e9263 --- /dev/null +++ b/test/render/flex/--css-box-justify-content.htm @@ -0,0 +1,38 @@ + + + +flexbox |css-box-justify-content + + + + + + +

This test passes if the DIV5's position in the end and the div is Horizontal layout

+
+
DIV1
+   +
DIV2
+   +
DIV3
+   +
DIV4
+   +
DIV5
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--display-flex-001.htm b/test/render/flex/--display-flex-001.htm new file mode 100644 index 000000000..06bdbcd98 --- /dev/null +++ b/test/render/flex/--display-flex-001.htm @@ -0,0 +1,36 @@ + + + + + CSS Test: An element with the 'display' property set to 'flex' establishes a new block-level flex container + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flex-002.htm b/test/render/flex/--flex-002.htm new file mode 100644 index 000000000..dd5406c01 --- /dev/null +++ b/test/render/flex/--flex-002.htm @@ -0,0 +1,57 @@ + + + + + CSS Test: The 'flex' shorthand adjusting the 'flex-shrink' sub-property + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flex-003.htm b/test/render/flex/--flex-003.htm new file mode 100644 index 000000000..7a31f350b --- /dev/null +++ b/test/render/flex/--flex-003.htm @@ -0,0 +1,58 @@ + + + + + CSS Test: Comparing two different elements using different values for the 'flex-grow' sub-property on the 'flex' shorthand + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flex-004.htm b/test/render/flex/--flex-004.htm new file mode 100644 index 000000000..a190d70fd --- /dev/null +++ b/test/render/flex/--flex-004.htm @@ -0,0 +1,58 @@ + + + + + CSS Test: Comparing two different elements using different values for the 'flex-shrink' sub-property on the 'flex' shorthand + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flex-basis-002.htm b/test/render/flex/--flex-basis-002.htm new file mode 100644 index 000000000..b12a8305f --- /dev/null +++ b/test/render/flex/--flex-basis-002.htm @@ -0,0 +1,47 @@ + + + + +CSS Flexbox Test: flex-basis - positive number + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-basis-003.htm b/test/render/flex/--flex-basis-003.htm new file mode 100644 index 000000000..7a2ba7a7b --- /dev/null +++ b/test/render/flex/--flex-basis-003.htm @@ -0,0 +1,47 @@ + + + + +CSS Flexbox Test: flex-basis - negative number(width not specified) + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-basis-004.htm b/test/render/flex/--flex-basis-004.htm new file mode 100644 index 000000000..af773c2f0 --- /dev/null +++ b/test/render/flex/--flex-basis-004.htm @@ -0,0 +1,49 @@ + + + + +CSS Flexbox Test: flex-basis - negative number(width specified) + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-basis-005.htm b/test/render/flex/--flex-basis-005.htm new file mode 100644 index 000000000..35e050896 --- /dev/null +++ b/test/render/flex/--flex-basis-005.htm @@ -0,0 +1,34 @@ + + + + +CSS Flexbox Test: flex-basis - 0 + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-basis-006.htm b/test/render/flex/--flex-basis-006.htm new file mode 100644 index 000000000..3c8de53f1 --- /dev/null +++ b/test/render/flex/--flex-basis-006.htm @@ -0,0 +1,34 @@ + + + + +CSS Flexbox Test: flex-basis - 0% + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-basis-010.htm b/test/render/flex/--flex-basis-010.htm new file mode 100644 index 000000000..ba82b33a5 --- /dev/null +++ b/test/render/flex/--flex-basis-010.htm @@ -0,0 +1,36 @@ + + + + +CSS Flexbox Test: Indefinite % flex-basis should cause height to be ignored + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-basis-011.htm b/test/render/flex/--flex-basis-011.htm new file mode 100644 index 000000000..d7e98c2ab --- /dev/null +++ b/test/render/flex/--flex-basis-011.htm @@ -0,0 +1,30 @@ + + + + +CSS Flexbox Test: % flex-basis should not cause engines to treat items as percentage sized + + + + + + +

Test PASS if there are two boxes with blue borders vertically stretched to fit their contents.

+
+
+
+
AAA
+
+
+
BBB
+
+
+
+ + + diff --git a/test/render/flex/--flex-direction-row-001-visual.htm b/test/render/flex/--flex-direction-row-001-visual.htm new file mode 100644 index 000000000..9347b13cf --- /dev/null +++ b/test/render/flex/--flex-direction-row-001-visual.htm @@ -0,0 +1,29 @@ + + + + + CSS Flexible Box Test: flex-direction_row + + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle and no gap between them.
+ 2. the rectangle 1, 2, 3 appear in upper left of red rectangle.

+
1
2
3
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flex-direction-row-reverse-001-visual.htm b/test/render/flex/--flex-direction-row-reverse-001-visual.htm new file mode 100644 index 000000000..da02934a0 --- /dev/null +++ b/test/render/flex/--flex-direction-row-reverse-001-visual.htm @@ -0,0 +1,29 @@ + + + + + CSS Flexible Box Test: flex-direction_row-reverse + + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle and no gap between them.
+ 2. the rectangle 1, 2, 3 appear in upper right of red rectangle and from left to right of the row: 3, 2, 1.

+
1
2
3
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flex-flexitem-childmargin.htm b/test/render/flex/--flex-flexitem-childmargin.htm new file mode 100644 index 000000000..5a7b361ba --- /dev/null +++ b/test/render/flex/--flex-flexitem-childmargin.htm @@ -0,0 +1,52 @@ + + + + + flex item child margin + + + + + + + + +
+
+

+ a +

+
+
+

+ b +

+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flex-flexitem-percentage-prescation.htm b/test/render/flex/--flex-flexitem-percentage-prescation.htm new file mode 100644 index 000000000..32881e105 --- /dev/null +++ b/test/render/flex/--flex-flexitem-percentage-prescation.htm @@ -0,0 +1,37 @@ + + + + + flex item size prescation + + + + + + + + +
+

d

+

d

+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flex-flow-004.htm b/test/render/flex/--flex-flow-004.htm new file mode 100644 index 000000000..de5919760 --- /dev/null +++ b/test/render/flex/--flex-flow-004.htm @@ -0,0 +1,40 @@ + + + + +CSS Flexbox Test: flex-flow - row-reverse nowrap + + + + + + + + + + +

Test passes if there is a filled green rectangle whose width is greater than height + and the number within rectangle is '1 2 3 4' from left to right.

+
+
4
+
3
+
2
+
1
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-flow-007.htm b/test/render/flex/--flex-flow-007.htm new file mode 100644 index 000000000..55487def6 --- /dev/null +++ b/test/render/flex/--flex-flow-007.htm @@ -0,0 +1,39 @@ + + + + +CSS Flexbox Test: flex-flow - column nowrap + + + + + + + + + + +

Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' from top to bottom.

+
+
1
+
2
+
3
+
4
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-flow-010.htm b/test/render/flex/--flex-flow-010.htm new file mode 100644 index 000000000..3d46f868b --- /dev/null +++ b/test/render/flex/--flex-flow-010.htm @@ -0,0 +1,39 @@ + + + + +CSS Flexbox Test: flex-flow - column-reverse nowrap + + + + + + + + + + +

Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' from top to bottom.

+
+
4
+
3
+
2
+
1
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-grow-001.htm b/test/render/flex/--flex-grow-001.htm new file mode 100644 index 000000000..37013daa9 --- /dev/null +++ b/test/render/flex/--flex-grow-001.htm @@ -0,0 +1,46 @@ + + + + + + CSS Test: Flex-grow Property of Block-level Flex Items + + + + + + + + +
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-grow-002.htm b/test/render/flex/--flex-grow-002.htm new file mode 100644 index 000000000..a5ebea4ba --- /dev/null +++ b/test/render/flex/--flex-grow-002.htm @@ -0,0 +1,50 @@ + + + + +CSS Flexbox Test: flex-grow - 0(initial value) + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-grow-007.htm b/test/render/flex/--flex-grow-007.htm new file mode 100644 index 000000000..43cbed696 --- /dev/null +++ b/test/render/flex/--flex-grow-007.htm @@ -0,0 +1,49 @@ + + + + +CSS Flexbox Test: flex-grow - less than one + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-inline.htm b/test/render/flex/--flex-inline.htm new file mode 100644 index 000000000..45d22c8c8 --- /dev/null +++ b/test/render/flex/--flex-inline.htm @@ -0,0 +1,33 @@ + + + + + CSS Flexible Box Test: display proprety - inline-flex + + + + + + + +

The test passed if you see a green block which its text is 'Success!'.

+
+ +
Success!
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flex-minimum-height-flex-items-003.htm b/test/render/flex/--flex-minimum-height-flex-items-003.htm new file mode 100644 index 000000000..dfa7cb563 --- /dev/null +++ b/test/render/flex/--flex-minimum-height-flex-items-003.htm @@ -0,0 +1,54 @@ + + + + + + CSS Flexible Box Test: Minimum height of flex items + + + + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-minimum-height-flex-items-011.htm b/test/render/flex/--flex-minimum-height-flex-items-011.htm new file mode 100644 index 000000000..6591a43ff --- /dev/null +++ b/test/render/flex/--flex-minimum-height-flex-items-011.htm @@ -0,0 +1,54 @@ + + + + + + CSS Flexible Box Test: Minimum height of flex items + + + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-shrink-001.htm b/test/render/flex/--flex-shrink-001.htm new file mode 100644 index 000000000..1e675532c --- /dev/null +++ b/test/render/flex/--flex-shrink-001.htm @@ -0,0 +1,47 @@ + + + + +CSS Flexbox Test: flex-shrink - number(positive) + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-shrink-002.htm b/test/render/flex/--flex-shrink-002.htm new file mode 100644 index 000000000..8975611a9 --- /dev/null +++ b/test/render/flex/--flex-shrink-002.htm @@ -0,0 +1,47 @@ + + + + +CSS Flexbox Test: flex-shrink - number(negative) + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-shrink-003.htm b/test/render/flex/--flex-shrink-003.htm new file mode 100644 index 000000000..a211308b7 --- /dev/null +++ b/test/render/flex/--flex-shrink-003.htm @@ -0,0 +1,44 @@ + + + + +CSS Flexbox Test: flex-shrink - 1(initial value) + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-shrink-004.htm b/test/render/flex/--flex-shrink-004.htm new file mode 100644 index 000000000..4773c03d0 --- /dev/null +++ b/test/render/flex/--flex-shrink-004.htm @@ -0,0 +1,48 @@ + + + + +CSS Flexbox Test: flex-shrink - number(flex container has enough space) + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-shrink-005.htm b/test/render/flex/--flex-shrink-005.htm new file mode 100644 index 000000000..7f12d4b2a --- /dev/null +++ b/test/render/flex/--flex-shrink-005.htm @@ -0,0 +1,47 @@ + + + + +CSS Flexbox Test: flex-shrink - 0 + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-shrink-006.htm b/test/render/flex/--flex-shrink-006.htm new file mode 100644 index 000000000..488ecd12f --- /dev/null +++ b/test/render/flex/--flex-shrink-006.htm @@ -0,0 +1,51 @@ + + + + +CSS Flexbox Test: flex-shrink - 0(one of flex-shrinks sets 0, another not) + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-shrink-007.htm b/test/render/flex/--flex-shrink-007.htm new file mode 100644 index 000000000..4f9b04633 --- /dev/null +++ b/test/render/flex/--flex-shrink-007.htm @@ -0,0 +1,44 @@ + + + + +CSS Flexbox Test: flex-shrink - applied to flex container + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flex-shrink-008.htm b/test/render/flex/--flex-shrink-008.htm new file mode 100644 index 000000000..ec2bf7ecd --- /dev/null +++ b/test/render/flex/--flex-shrink-008.htm @@ -0,0 +1,49 @@ + + + + +CSS Flexbox Test: flex-shrink - less than one + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-abspos-child-001a.htm b/test/render/flex/--flexbox-abspos-child-001a.htm new file mode 100644 index 000000000..44d48db97 --- /dev/null +++ b/test/render/flex/--flexbox-abspos-child-001a.htm @@ -0,0 +1,57 @@ + + + + + CSS Test: Testing that "min-width", "max-width", "min-height", and "max-height" are applied on absolutely positioned children of a horizontal flex container + + + + + + + +
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-abspos-child-001b.htm b/test/render/flex/--flexbox-abspos-child-001b.htm new file mode 100644 index 000000000..f216dc2e2 --- /dev/null +++ b/test/render/flex/--flexbox-abspos-child-001b.htm @@ -0,0 +1,58 @@ + + + + + CSS Test: Testing that "min-width", "max-width", "min-height", and "max-height" are applied on absolutely positioned children of a vertical flex container + + + + + + + +
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-abspos-child-002.htm b/test/render/flex/--flexbox-abspos-child-002.htm new file mode 100644 index 000000000..e35c21d58 --- /dev/null +++ b/test/render/flex/--flexbox-abspos-child-002.htm @@ -0,0 +1,65 @@ + + + + + + + CSS Test: Test that "flex-basis" doesn't affect layout of abspos flex child + + + + + + + + + + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-baseline-horiz-001a.htm b/test/render/flex/--flexbox-align-self-baseline-horiz-001a.htm new file mode 100644 index 000000000..f17fc1960 --- /dev/null +++ b/test/render/flex/--flexbox-align-self-baseline-horiz-001a.htm @@ -0,0 +1,72 @@ + + + + + + CSS Test: Baseline alignment of block flex items with 'baseline' value for 'align-items' / 'align-self' + + + + + + +
+
blk_1line
+
blk
2lines
+
super
+
sub
+
big
text
3lines
+ ital
ic +
+
+
blk_1line
+
blk
2lines
+
super
+
sub
+
big
text
3lines
+ ital
ic +
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-baseline-horiz-001b.htm b/test/render/flex/--flexbox-align-self-baseline-horiz-001b.htm new file mode 100644 index 000000000..589373625 --- /dev/null +++ b/test/render/flex/--flexbox-align-self-baseline-horiz-001b.htm @@ -0,0 +1,75 @@ + + + + + + CSS Test: Baseline alignment of block flex items with 'baseline' value for 'align-items' / 'align-self' in a wrap-reverse flex container + + + + + + +
+
blk_1line
+
blk
2lines
+
super
+
sub
+
big
text
3lines
+ ital
ic +
+
+
blk_1line
+
blk
2lines
+
super
+
sub
+
big
text
3lines
+ ital
ic +
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-baseline-horiz-002.htm b/test/render/flex/--flexbox-align-self-baseline-horiz-002.htm new file mode 100644 index 000000000..d235a481a --- /dev/null +++ b/test/render/flex/--flexbox-align-self-baseline-horiz-002.htm @@ -0,0 +1,92 @@ + + + + + + CSS Test: Baseline alignment of flex items in fixed-size single-line flex container + + + + + + + + +
+
a
+
+ + + +
+ + +
+
a
+
+ + +
+
a
+
+ + +
+
a
+
+ + +
+
a
+
+ + + +
+ + +
+
a
+
+ + +
+
a
+
+ + +
+
a
+
+ + +
+
a
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-baseline-horiz-003.htm b/test/render/flex/--flexbox-align-self-baseline-horiz-003.htm new file mode 100644 index 000000000..682296a86 --- /dev/null +++ b/test/render/flex/--flexbox-align-self-baseline-horiz-003.htm @@ -0,0 +1,94 @@ + + + + + + CSS Test: Baseline alignment of flex items in fixed-size single-line flex container, with cross axis reversed + + + + + + + + +
+
a
+
+ + + +
+ + +
+
a
+
+ + +
+
a
+
+ + +
+
a
+
+ + +
+
a
+
+ + + +
+ + +
+
a
+
+ + +
+
a
+
+ + +
+
a
+
+ + +
+
a
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-baseline-horiz-004.htm b/test/render/flex/--flexbox-align-self-baseline-horiz-004.htm new file mode 100644 index 000000000..da2ce3433 --- /dev/null +++ b/test/render/flex/--flexbox-align-self-baseline-horiz-004.htm @@ -0,0 +1,58 @@ + + + + + + CSS Test: Baseline alignment of block flex items with 'baseline' value for 'align-items' / 'align-self' in a multi-line flex container + + + + + + +
+ +
a
+
b
+
c
+ + +
d
+
e
+
f
+ + +
g
+
h
+
i
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-baseline-horiz-005.htm b/test/render/flex/--flexbox-align-self-baseline-horiz-005.htm new file mode 100644 index 000000000..dfc3d6061 --- /dev/null +++ b/test/render/flex/--flexbox-align-self-baseline-horiz-005.htm @@ -0,0 +1,58 @@ + + + + + + CSS Test: Baseline alignment of block flex items with 'baseline' value for 'align-items' / 'align-self' in a multi-line flex container + + + + + + +
+ +
a
+
b
+
c
+ + +
d
+
e
+
f
+ + +
g
+
h
+
i
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-baseline-horiz-007.htm b/test/render/flex/--flexbox-align-self-baseline-horiz-007.htm new file mode 100644 index 000000000..c67816784 --- /dev/null +++ b/test/render/flex/--flexbox-align-self-baseline-horiz-007.htm @@ -0,0 +1,46 @@ + + + + + + CSS Test: Baseline alignment of block flex items with 'baseline' and 'last-baseline' values for 'align-self' against each other. + + + + + + +
+
one line (first)
+
one line (last)
+
two
lines and offset (last)
+
offset (first)
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-horiz-001-block.htm b/test/render/flex/--flexbox-align-self-horiz-001-block.htm new file mode 100644 index 000000000..3664bce13 --- /dev/null +++ b/test/render/flex/--flexbox-align-self-horiz-001-block.htm @@ -0,0 +1,99 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' property values on flex items that are blocks, in a horizontal flex container + + + + + + +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
base
+
abc
+
stretch
+
a b c d e f
+
auto
+
unspec
+
initial
+
inherit
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-horiz-001-table.htm b/test/render/flex/--flexbox-align-self-horiz-001-table.htm new file mode 100644 index 000000000..6449e5c4d --- /dev/null +++ b/test/render/flex/--flexbox-align-self-horiz-001-table.htm @@ -0,0 +1,101 @@ + + + + + + CSS Test: Testing the various 'align-self' property values on flex items that are tables + + + + + + +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
base
+
abc
+
stretch
+
a b c d e f
+
auto
+
unspec
+
initial
+
inherit
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-horiz-003.htm b/test/render/flex/--flexbox-align-self-horiz-003.htm new file mode 100644 index 000000000..247a6e1b3 --- /dev/null +++ b/test/render/flex/--flexbox-align-self-horiz-003.htm @@ -0,0 +1,99 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' with a horizontal flex container that's shorter than its items + + + + + + +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
base
+
abc
+
stretch
+
a b c d e f
+
auto
+
unspec
+
initial
+
inherit
+
normal
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-horiz-004.htm b/test/render/flex/--flexbox-align-self-horiz-004.htm new file mode 100644 index 000000000..83b09cb0e --- /dev/null +++ b/test/render/flex/--flexbox-align-self-horiz-004.htm @@ -0,0 +1,86 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' with a horizontal flex container that's shorter than its items, with margin/padding/border on the items + + + + + + +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
+
+
+
base
+
abc
+
stretch
+
a b c d e f
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-horiz-005.htm b/test/render/flex/--flexbox-align-self-horiz-005.htm new file mode 100644 index 000000000..c005a8be6 --- /dev/null +++ b/test/render/flex/--flexbox-align-self-horiz-005.htm @@ -0,0 +1,106 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' with auto margins in play, in a horizontal flex container + + + + + + +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
base
+
a b c d e f
+
stretch
+
a b c d e f
+
+ +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
base
+
a b c d e f
+
stretch
+
a b c d e f
+
+ +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
base
+
a b c d e f
+
stretch
+
a b c d e f
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-vert-001.htm b/test/render/flex/--flexbox-align-self-vert-001.htm new file mode 100644 index 000000000..d7e7e4395 --- /dev/null +++ b/test/render/flex/--flexbox-align-self-vert-001.htm @@ -0,0 +1,94 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' property values on flex items that are blocks, in a vertical flex container + + + + + + +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
base
+
abc
+
stretch
+
a b c d e f
+
auto
+
unspec
+
initial
+
inherit
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-vert-003.htm b/test/render/flex/--flexbox-align-self-vert-003.htm new file mode 100644 index 000000000..68538801b --- /dev/null +++ b/test/render/flex/--flexbox-align-self-vert-003.htm @@ -0,0 +1,70 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' with a vertical flex container that's skinnier than its items + + + + + + +
+
start
+
a b
+
end
+
a b
+
center
+
a b
+
base
+
abc
+
stretch
+
a b
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-align-self-vert-004.htm b/test/render/flex/--flexbox-align-self-vert-004.htm new file mode 100644 index 000000000..1927d1807 --- /dev/null +++ b/test/render/flex/--flexbox-align-self-vert-004.htm @@ -0,0 +1,81 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' with a vertical flex container that's skinnier than its items, with margin/padding/border on the items + + + + + + +
+
start
+
a b
+
end
+
a b
+
center
+
a b
+
+
+
base
+
abc
+
stretch
+
a b
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-align-self-baseline-horiz-001.htm b/test/render/flex/--flexbox-baseline-align-self-baseline-horiz-001.htm new file mode 100644 index 000000000..b3b29234a --- /dev/null +++ b/test/render/flex/--flexbox-baseline-align-self-baseline-horiz-001.htm @@ -0,0 +1,64 @@ + + + + + CSS Test: Testing the baseline of a horizontal flex container with baseline-aligned flex items + + + + + + + + a +
+
b
+
c
+
d
+
+
+
e
+
f
+
g
+
+
+
h
+
i
+
j
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-align-self-baseline-vert-001.htm b/test/render/flex/--flexbox-baseline-align-self-baseline-vert-001.htm new file mode 100644 index 000000000..973aa3ff4 --- /dev/null +++ b/test/render/flex/--flexbox-baseline-align-self-baseline-vert-001.htm @@ -0,0 +1,68 @@ + + + + + CSS Test: Testing the baseline of a vertical flex container with baseline-aligned flex items + + + + + + + + + a +
+
b
+
c
+
d
+
+
+
e
+
f
+
g
+
+
+
h
+
i
+
j
+
+ + + + + diff --git a/test/render/flex/--flexbox-baseline-multi-item-horiz-001a.htm b/test/render/flex/--flexbox-baseline-multi-item-horiz-001a.htm new file mode 100644 index 000000000..2a21a4ec5 --- /dev/null +++ b/test/render/flex/--flexbox-baseline-multi-item-horiz-001a.htm @@ -0,0 +1,47 @@ + + + + + CSS Test: Testing the baseline of a horizontal flex container whose flex items are not baseline-aligned + + + + + + + + a +
+
b
c
+
+
+
d
e
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-multi-item-horiz-001b.htm b/test/render/flex/--flexbox-baseline-multi-item-horiz-001b.htm new file mode 100644 index 000000000..cb241ee95 --- /dev/null +++ b/test/render/flex/--flexbox-baseline-multi-item-horiz-001b.htm @@ -0,0 +1,49 @@ + + + + + CSS Test: Testing the baseline of a horizontal flex container whose flex items are not baseline-aligned + + + + + + + + a +
+
c
b
+
+
+
e
d
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-multi-item-vert-001a.htm b/test/render/flex/--flexbox-baseline-multi-item-vert-001a.htm new file mode 100644 index 000000000..612556311 --- /dev/null +++ b/test/render/flex/--flexbox-baseline-multi-item-vert-001a.htm @@ -0,0 +1,57 @@ + + + + + CSS Test: Testing the baseline of a vertical flex container whose flex items are not baseline-aligned + + + + + + + + + a +
+
b
c
+
+
+
d
e
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-multi-item-vert-001b.htm b/test/render/flex/--flexbox-baseline-multi-item-vert-001b.htm new file mode 100644 index 000000000..54b716477 --- /dev/null +++ b/test/render/flex/--flexbox-baseline-multi-item-vert-001b.htm @@ -0,0 +1,59 @@ + + + + + CSS Test: Testing the baseline of a vertical flex container whose flex items are not baseline-aligned + + + + + + + + + a +
+
c
b
+
+
+
e
d
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-multi-line-horiz-001.htm b/test/render/flex/--flexbox-baseline-multi-line-horiz-001.htm new file mode 100644 index 000000000..23d2ea6eb --- /dev/null +++ b/test/render/flex/--flexbox-baseline-multi-line-horiz-001.htm @@ -0,0 +1,76 @@ + + + + + CSS Test: Testing the baseline of a horizontal flex container with multiple flex lines + + + + + + + + a + +
+
b
c
d
e
+
+ +
+
f
g
h
i
+
+ + +
+
j
k
l
m
+
+ n + + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-multi-line-horiz-002.htm b/test/render/flex/--flexbox-baseline-multi-line-horiz-002.htm new file mode 100644 index 000000000..67992698c --- /dev/null +++ b/test/render/flex/--flexbox-baseline-multi-line-horiz-002.htm @@ -0,0 +1,76 @@ + + + + + CSS Test: Testing the baseline of a horizontal flex container with multiple flex lines + + + + + + + + a + +
+
b
c
d
e
+
+ +
+
f
g
h
i
+
+ + +
+
j
k
l
m
+
+ n + + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-multi-line-horiz-003.htm b/test/render/flex/--flexbox-baseline-multi-line-horiz-003.htm new file mode 100644 index 000000000..e19df8046 --- /dev/null +++ b/test/render/flex/--flexbox-baseline-multi-line-horiz-003.htm @@ -0,0 +1,76 @@ + + + + + CSS Test: Testing the baseline of a horizontal multi-line (wrap) flex container with baseline-aligned items on first line + + + + + + + + a + +
+
b
+
c
+
d
+
e
+
+ + +
+
f
+
g
+
h
+
i
+
+ + +
+
j
+
k
+
l
+
m
+
+ n + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-multi-line-vert-001.htm b/test/render/flex/--flexbox-baseline-multi-line-vert-001.htm new file mode 100644 index 000000000..55e9acf4e --- /dev/null +++ b/test/render/flex/--flexbox-baseline-multi-line-vert-001.htm @@ -0,0 +1,77 @@ + + + + + CSS Test: Testing the baseline of a vertical flex container with multiple flex lines + + + + + + + + a + +
+
b
c
d
e
+
+ +
+
f
g
h
i
+
+ + +
+
j
k
l
m
+
+ n + + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-multi-line-vert-002.htm b/test/render/flex/--flexbox-baseline-multi-line-vert-002.htm new file mode 100644 index 000000000..077fb8b67 --- /dev/null +++ b/test/render/flex/--flexbox-baseline-multi-line-vert-002.htm @@ -0,0 +1,78 @@ + + + + + CSS Test: Testing the baseline of a vertical flex container with multiple flex lines + + + + + + + + a + +
+
b
c
d
e
+
+ +
+
f
g
h
i
+
+ + +
+
j
k
l
m
+
+ n + + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-single-item-001a.htm b/test/render/flex/--flexbox-baseline-single-item-001a.htm new file mode 100644 index 000000000..6bc2925fc --- /dev/null +++ b/test/render/flex/--flexbox-baseline-single-item-001a.htm @@ -0,0 +1,55 @@ + + + + + CSS Test: Testing the baseline of a horizontal flex container with one flex item + + + + + + + + A +
a
+
a
+
a
+
a
+
a
+
+ +
abs
+
a
+ + +
+ + \ No newline at end of file diff --git a/test/render/flex/--flexbox-baseline-single-item-001b.htm b/test/render/flex/--flexbox-baseline-single-item-001b.htm new file mode 100644 index 000000000..2944a5830 --- /dev/null +++ b/test/render/flex/--flexbox-baseline-single-item-001b.htm @@ -0,0 +1,56 @@ + + + + + CSS Test: Testing the baseline of a vertical flex container with one flex item + + + + + + + + A +
a
+
a
+
a
+
a
+
a
+
+ +
abs
+
a
+ + +
+ + \ No newline at end of file diff --git a/test/render/flex/--flexbox-basic-block-vert-001.htm b/test/render/flex/--flexbox-basic-block-vert-001.htm new file mode 100644 index 000000000..7fa303728 --- /dev/null +++ b/test/render/flex/--flexbox-basic-block-vert-001.htm @@ -0,0 +1,68 @@ + + + + + + CSS Test: Testing flexbox layout algorithm property on block flex items in a vertical flex container + + + + + + +
+
+
+
+
+
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-break-request-horiz-002a.htm b/test/render/flex/--flexbox-break-request-horiz-002a.htm new file mode 100644 index 000000000..b272d359a --- /dev/null +++ b/test/render/flex/--flexbox-break-request-horiz-002a.htm @@ -0,0 +1,110 @@ + + + + + CSS Test: Testing page-break-before in horizontal single-line flex containers (should have no effect) + + + + + + + + + +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-break-request-horiz-002b.htm b/test/render/flex/--flexbox-break-request-horiz-002b.htm new file mode 100644 index 000000000..480b23f9a --- /dev/null +++ b/test/render/flex/--flexbox-break-request-horiz-002b.htm @@ -0,0 +1,110 @@ + + + + + CSS Test: Testing page-break-after in horizontal single-line flex containers (should have no effect) + + + + + + + + + +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-break-request-vert-002a.htm b/test/render/flex/--flexbox-break-request-vert-002a.htm new file mode 100644 index 000000000..4ad2516d3 --- /dev/null +++ b/test/render/flex/--flexbox-break-request-vert-002a.htm @@ -0,0 +1,111 @@ + + + + + CSS Test: Testing page-break-before in vertical single-line flex containers (should have no effect) + + + + + + + + + +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-break-request-vert-002b.htm b/test/render/flex/--flexbox-break-request-vert-002b.htm new file mode 100644 index 000000000..012b80a73 --- /dev/null +++ b/test/render/flex/--flexbox-break-request-vert-002b.htm @@ -0,0 +1,111 @@ + + + + + CSS Test: Testing page-break-after in vertical single-line flex containers (should have no effect) + + + + + + + + + +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-collapsed-item-baseline-001.htm b/test/render/flex/--flexbox-collapsed-item-baseline-001.htm new file mode 100644 index 000000000..adedd02cd --- /dev/null +++ b/test/render/flex/--flexbox-collapsed-item-baseline-001.htm @@ -0,0 +1,57 @@ + + + + + CSS Test: Testing that a collapsed flex item participates in baseline alignment only for the purpose of establishing container's cross size + + + + + + + + +
+
a
+
b
+
+ + +
+
a
+
b
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-collapsed-item-horiz-001.htm b/test/render/flex/--flexbox-collapsed-item-horiz-001.htm new file mode 100644 index 000000000..6bc91e105 --- /dev/null +++ b/test/render/flex/--flexbox-collapsed-item-horiz-001.htm @@ -0,0 +1,101 @@ + + + + + CSS Test: Testing that visibility:collapse on a flex item in a single-line flex container maintains the containers's cross size, but doesn't otherwise impact flex layout + + + + + + + + + +
+
+
+ +
+ + + +
+
+
+
+ +
+
+
+
+ +
+ + + +
+
+
+
+ +
+
+
+
+ +
+ + + +
+
+
+
+ +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-collapsed-item-horiz-002.htm b/test/render/flex/--flexbox-collapsed-item-horiz-002.htm new file mode 100644 index 000000000..74b24f5da --- /dev/null +++ b/test/render/flex/--flexbox-collapsed-item-horiz-002.htm @@ -0,0 +1,114 @@ + + + + + CSS Test: Testing that visibility:collapse on a flex item in a multi-line flex container creates struts, and that they can migrate between lines + + + + + + + + + +
+
+
+
+
+ +
+
+
+
+
+ +
+ + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+ + + +
+
+
+
+
+ +
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-collapsed-item-horiz-003.htm b/test/render/flex/--flexbox-collapsed-item-horiz-003.htm new file mode 100644 index 000000000..b151b3e09 --- /dev/null +++ b/test/render/flex/--flexbox-collapsed-item-horiz-003.htm @@ -0,0 +1,59 @@ + + + + + CSS Test: Testing that strut formation (from visibility:collapse) happens *after* lines have been stretched + + + + + + + + +
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-flex-basis-content-001a.htm b/test/render/flex/--flexbox-flex-basis-content-001a.htm new file mode 100644 index 000000000..ffb5c3aed --- /dev/null +++ b/test/render/flex/--flexbox-flex-basis-content-001a.htm @@ -0,0 +1,86 @@ + + + + + + CSS Test: Testing "flex-basis: content" in a row-oriented flex container + + + + + + + + + + +
+
a b
+
c
+
+
+ +
+ + +
+
a b
+
c
+
+
+ +
+ + +
+
a b
+
c
+
+
+ +
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-flex-basis-content-001b.htm b/test/render/flex/--flexbox-flex-basis-content-001b.htm new file mode 100644 index 000000000..8b4992931 --- /dev/null +++ b/test/render/flex/--flexbox-flex-basis-content-001b.htm @@ -0,0 +1,86 @@ + + + + + + CSS Test: Testing "flex-basis: content" (set via the "flex" shorthand) + in a row-oriented flex container. + + + + + + + + + + +
+
a b
+
c
+
+
+ +
+ + +
+
a b
+
c
+
+
+ +
+ + +
+
a b
+
c
+
+
+ +
+ + + + + + diff --git a/test/render/flex/--flexbox-flex-basis-content-002a.htm b/test/render/flex/--flexbox-flex-basis-content-002a.htm new file mode 100644 index 000000000..10306aadf --- /dev/null +++ b/test/render/flex/--flexbox-flex-basis-content-002a.htm @@ -0,0 +1,87 @@ + + + + + + CSS Test: Testing "flex-basis: content" in a column-oriented flex container + + + + + + + + + + +
+
a b
+
c
+
+
+ +
+ + +
+
a b
+
c
+
+
+ +
+ + +
+
a b
+
c
+
+
+ +
+ + + + + + diff --git a/test/render/flex/--flexbox-flex-basis-content-002b.htm b/test/render/flex/--flexbox-flex-basis-content-002b.htm new file mode 100644 index 000000000..4790d20b8 --- /dev/null +++ b/test/render/flex/--flexbox-flex-basis-content-002b.htm @@ -0,0 +1,87 @@ + + + + + + CSS Test: Testing "flex-basis: content" (set via the "flex" shorthand) + in a column-oriented flex container. + + + + + + + + + + +
+
a b
+
c
+
+
+ +
+ + +
+
a b
+
c
+
+
+ +
+ + +
+
a b
+
c
+
+
+ +
+ + + + + + diff --git a/test/render/flex/--flexbox-flex-basis-content-003a.htm b/test/render/flex/--flexbox-flex-basis-content-003a.htm new file mode 100644 index 000000000..b0e48f201 --- /dev/null +++ b/test/render/flex/--flexbox-flex-basis-content-003a.htm @@ -0,0 +1,124 @@ + + + + + + CSS Test: Testing that explicit "flex-basis: content" is treated as + "max-content" when calculating flex base size + + + + + + + + + + + +
+
+
+ + +
+
+ + + +
+
+ + +
+
+ +
+
+ + +
+ +
+ + +
+
+ + + +
+
+ + +
+
+ + + +
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-flex-basis-content-003b.htm b/test/render/flex/--flexbox-flex-basis-content-003b.htm new file mode 100644 index 000000000..ad66c82fd --- /dev/null +++ b/test/render/flex/--flexbox-flex-basis-content-003b.htm @@ -0,0 +1,125 @@ + + + + + + CSS Test: Testing that used "flex-basis: content" is treated as + "max-content" when calculating flex base size + + + + + + + + + + + +
+
+
+ + +
+
+ + + +
+
+ + +
+
+ +
+
+ + +
+ +
+ + +
+
+ + + +
+
+ + +
+
+ + + +
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-flex-basis-content-004a.htm b/test/render/flex/--flexbox-flex-basis-content-004a.htm new file mode 100644 index 000000000..f7a36d399 --- /dev/null +++ b/test/render/flex/--flexbox-flex-basis-content-004a.htm @@ -0,0 +1,130 @@ + + + + + + CSS Test: Testing that explicit "flex-basis: content" is treated as + "max-content" when calculating flex base size + + + + + + + + + + + +
+
+
+ + +
+
+ + + +
+
+ + +
+
+ +
+
+ + +
+ +
+ + +
+
+ + + +
+
+ + +
+
+ + + +
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-flex-flow-001.htm b/test/render/flex/--flexbox-flex-flow-001.htm new file mode 100644 index 000000000..1d8996d4d --- /dev/null +++ b/test/render/flex/--flexbox-flex-flow-001.htm @@ -0,0 +1,129 @@ + + + + + CSS Test: Testing all the values of the "flex-flow" shorthand property, with 4 flex items in each container + + + + + + + + +
+
1
2
3
4
+
+
+
1
2
3
4
+
+
+
1
2
3
4
+
+
+
1
2
3
4
+
+ +
+ + +
+
1
2
3
4
+
+
+
1
2
3
4
+
+
+
1
2
3
4
+
+
+
1
2
3
4
+
+ +
+ + +
+
1
2
3
4
+
+
+
1
2
3
4
+
+
+
1
2
3
4
+
+
+
1
2
3
4
+
+ +
+ + +
+
1
2
3
4
+
+
+
1
2
3
4
+
+
+
1
2
3
4
+
+
+
1
2
3
4
+
+ +
+ + +
+
1
2
3
4
+
+
+
1
2
3
4
+
+
+
1
2
3
4
+
+
+
1
2
3
4
+
+ +
+ + +
+
1
2
3
4
+
+
+
1
2
3
4
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-flex-flow-002.htm b/test/render/flex/--flexbox-flex-flow-002.htm new file mode 100644 index 000000000..17465ae2b --- /dev/null +++ b/test/render/flex/--flexbox-flex-flow-002.htm @@ -0,0 +1,129 @@ + + + + + CSS Test: Testing all the values of the "flex-flow" shorthand property, with 3 flex items in each container + + + + + + + + +
+
1
2
3
+
+
+
1
2
3
+
+
+
1
2
3
+
+
+
1
2
3
+
+ +
+ + +
+
1
2
3
+
+
+
1
2
3
+
+
+
1
2
3
+
+
+
1
2
3
+
+ +
+ + +
+
1
2
3
+
+
+
1
2
3
+
+
+
1
2
3
+
+
+
1
2
3
+
+ +
+ + +
+
1
2
3
+
+
+
1
2
3
+
+
+
1
2
3
+
+
+
1
2
3
+
+ +
+ + +
+
1
2
3
+
+
+
1
2
3
+
+
+
1
2
3
+
+
+
1
2
3
+
+ +
+ + +
+
1
2
3
+
+
+
1
2
3
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-flex-wrap-default.htm b/test/render/flex/--flexbox-flex-wrap-default.htm new file mode 100644 index 000000000..5741eb5eb --- /dev/null +++ b/test/render/flex/--flexbox-flex-wrap-default.htm @@ -0,0 +1,43 @@ + + + + + CSS Flexbox Test: Flex-wrap defaults to nowrap + + + + + + + + + +

The test passes if there is a green square and no red.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-flex-wrap-horiz-001.htm b/test/render/flex/--flexbox-flex-wrap-horiz-001.htm new file mode 100644 index 000000000..37bd9dda9 --- /dev/null +++ b/test/render/flex/--flexbox-flex-wrap-horiz-001.htm @@ -0,0 +1,100 @@ + + + + + CSS Test: Testing flex-wrap in horizontal flex containers + + + + + + + + + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-flex-wrap-nowrap.htm b/test/render/flex/--flexbox-flex-wrap-nowrap.htm new file mode 100644 index 000000000..9a287b905 --- /dev/null +++ b/test/render/flex/--flexbox-flex-wrap-nowrap.htm @@ -0,0 +1,44 @@ + + + + + CSS Flexbox Test: Flex-wrap = nowrap + + + + + + + + + +

The test passes if there is a green square and no red.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-flex-wrap-vert-001.htm b/test/render/flex/--flexbox-flex-wrap-vert-001.htm new file mode 100644 index 000000000..069dfcbcc --- /dev/null +++ b/test/render/flex/--flexbox-flex-wrap-vert-001.htm @@ -0,0 +1,102 @@ + + + + + CSS Test: Testing flex-wrap in vertical flex containers + + + + + + + + + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-flex-wrap-vert-002.htm b/test/render/flex/--flexbox-flex-wrap-vert-002.htm new file mode 100644 index 000000000..649943701 --- /dev/null +++ b/test/render/flex/--flexbox-flex-wrap-vert-002.htm @@ -0,0 +1,64 @@ + + + + + CSS Test: Ensure that min-height is honored for vertical multi-line flex containers + + + + + + + + + +
+
+ + +
+
+
+ + +
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-gap-position-absolute.htm b/test/render/flex/--flexbox-gap-position-absolute.htm new file mode 100644 index 000000000..5cae70703 --- /dev/null +++ b/test/render/flex/--flexbox-gap-position-absolute.htm @@ -0,0 +1,30 @@ + + + + + CSS Flexible Box Layout Test: Test flexbox intrinsic inline-size, gap, and absolute-positioned children + + + + + + + + + +
+ + + B + C +
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-items-as-stacking-contexts-001.htm b/test/render/flex/--flexbox-items-as-stacking-contexts-001.htm new file mode 100644 index 000000000..b25d73211 --- /dev/null +++ b/test/render/flex/--flexbox-items-as-stacking-contexts-001.htm @@ -0,0 +1,116 @@ + + + + + + CSS Test: Testing that 'z-index' property makes flex items form stacking contexts + + + + + + + +
+
+
+
+ + +
+
+
+ +
+
+ +
+
+
+ + +
+
+
+ +
+
+ +
+
+
+ + +
+
+
+ +
+
+ +
+
+
+ + +
+
+
+ +
+
+ +
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-horiz-001a.htm b/test/render/flex/--flexbox-justify-content-horiz-001a.htm new file mode 100644 index 000000000..4a646858f --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-horiz-001a.htm @@ -0,0 +1,141 @@ + + + + + + CSS Test: Testing 'justify-content' in a horizontal flex container + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-horiz-001b.htm b/test/render/flex/--flexbox-justify-content-horiz-001b.htm new file mode 100644 index 000000000..283664a18 --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-horiz-001b.htm @@ -0,0 +1,147 @@ + + + + + + CSS Test: Testing 'justify-content' in a horizontal flex container with "min-width" + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-horiz-002.htm b/test/render/flex/--flexbox-justify-content-horiz-002.htm new file mode 100644 index 000000000..74bc2d44d --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-horiz-002.htm @@ -0,0 +1,154 @@ + + + + + + CSS Test: Testing 'justify-content' in a horizontal flex container, with margins/border/padding on flex items + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-horiz-003.htm b/test/render/flex/--flexbox-justify-content-horiz-003.htm new file mode 100644 index 000000000..a95237b4f --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-horiz-003.htm @@ -0,0 +1,149 @@ + + + + + + CSS Test: Testing 'justify-content' in a horizontal flex container, and its effects on flex items that overflow + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-horiz-004.htm b/test/render/flex/--flexbox-justify-content-horiz-004.htm new file mode 100644 index 000000000..c696f7e0d --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-horiz-004.htm @@ -0,0 +1,160 @@ + + + + + + CSS Test: Testing 'justify-content' in a horizontal flex container, and its effects on flex items that overflow, with margins/border/padding on flex items + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-horiz-005.htm b/test/render/flex/--flexbox-justify-content-horiz-005.htm new file mode 100644 index 000000000..4c57dfd3d --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-horiz-005.htm @@ -0,0 +1,140 @@ + + + + + + CSS Test: Testing 'justify-content' in an auto-sized horizontal flex container + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-horiz-006.htm b/test/render/flex/--flexbox-justify-content-horiz-006.htm new file mode 100644 index 000000000..91151e3cc --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-horiz-006.htm @@ -0,0 +1,142 @@ + + + + + + CSS Test: Testing 'justify-content' in an auto-sized reversed horizontal flex container + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-vert-001a.htm b/test/render/flex/--flexbox-justify-content-vert-001a.htm new file mode 100644 index 000000000..a8e1335a3 --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-vert-001a.htm @@ -0,0 +1,143 @@ + + + + + + CSS Test: Testing 'justify-content' in a vertical flex container + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-vert-001b.htm b/test/render/flex/--flexbox-justify-content-vert-001b.htm new file mode 100644 index 000000000..4f68232b4 --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-vert-001b.htm @@ -0,0 +1,144 @@ + + + + + + CSS Test: Testing 'justify-content' in a vertical flex container with "min-height" + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-vert-002.htm b/test/render/flex/--flexbox-justify-content-vert-002.htm new file mode 100644 index 000000000..3416228ee --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-vert-002.htm @@ -0,0 +1,156 @@ + + + + + + CSS Test: Testing 'justify-content' in a vertical flex container, with margins/border/padding on flex items + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-vert-003.htm b/test/render/flex/--flexbox-justify-content-vert-003.htm new file mode 100644 index 000000000..d742f568b --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-vert-003.htm @@ -0,0 +1,152 @@ + + + + + + CSS Test: Testing 'justify-content' in a vertical flex container, and its effects on flex items that overflow + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-vert-004.htm b/test/render/flex/--flexbox-justify-content-vert-004.htm new file mode 100644 index 000000000..f64737814 --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-vert-004.htm @@ -0,0 +1,163 @@ + + + + + + CSS Test: Testing 'justify-content' in a vertical flex container, and its effects on flex items that overflow, with margins/border/padding on flex items + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-vert-005.htm b/test/render/flex/--flexbox-justify-content-vert-005.htm new file mode 100644 index 000000000..c1a2a5b2c --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-vert-005.htm @@ -0,0 +1,146 @@ + + + + + + CSS Test: Testing 'justify-content' in an auto-sized vertical flex container + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-justify-content-vert-006.htm b/test/render/flex/--flexbox-justify-content-vert-006.htm new file mode 100644 index 000000000..9cb36b1e8 --- /dev/null +++ b/test/render/flex/--flexbox-justify-content-vert-006.htm @@ -0,0 +1,143 @@ + + + + + + CSS Test: Testing 'justify-content' in a vertical flex container + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-margin-auto-horiz-001.htm b/test/render/flex/--flexbox-margin-auto-horiz-001.htm new file mode 100644 index 000000000..5bf136e96 --- /dev/null +++ b/test/render/flex/--flexbox-margin-auto-horiz-001.htm @@ -0,0 +1,85 @@ + + + + + + CSS Test: Testing horizontal auto margins on flex items in a horizontal flex container + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-margin-auto-horiz-002.htm b/test/render/flex/--flexbox-margin-auto-horiz-002.htm new file mode 100644 index 000000000..0ac66b020 --- /dev/null +++ b/test/render/flex/--flexbox-margin-auto-horiz-002.htm @@ -0,0 +1,70 @@ + + + + + + CSS Test: Testing vertical auto margins on flex items in a horizontal flex container + + + + + + + + +
+
+
+
+
+ +
+
+
+
+ + +
+
+
+
+
+
+ + +
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-mbp-horiz-004.htm b/test/render/flex/--flexbox-mbp-horiz-004.htm new file mode 100644 index 000000000..c85ff5912 --- /dev/null +++ b/test/render/flex/--flexbox-mbp-horiz-004.htm @@ -0,0 +1,72 @@ + + + + + + CSS Test: Testing percent-valued padding and margin on flex items + + + + + + + +
+ + +
+ + +
+ + +
+ + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-min-height-auto-001.htm b/test/render/flex/--flexbox-min-height-auto-001.htm new file mode 100644 index 000000000..a1d5d1e06 --- /dev/null +++ b/test/render/flex/--flexbox-min-height-auto-001.htm @@ -0,0 +1,105 @@ + + + + + + CSS Test: Testing min-height:auto + + + + + + + + + + +
+
+
+ +
+
+
+ +
+
+
+ + + +
+
+
+ +
+
+
+ +
+
+
+ + + +
+
+
+ +
+
+
+ +
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-min-height-auto-003.htm b/test/render/flex/--flexbox-min-height-auto-003.htm new file mode 100644 index 000000000..fe03ffffa --- /dev/null +++ b/test/render/flex/--flexbox-min-height-auto-003.htm @@ -0,0 +1,60 @@ + + + + + + CSS Test: Testing min-height:auto & 'overflow' interaction + + + + + + + + +
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-min-height-auto-004.htm b/test/render/flex/--flexbox-min-height-auto-004.htm new file mode 100644 index 000000000..231da3717 --- /dev/null +++ b/test/render/flex/--flexbox-min-height-auto-004.htm @@ -0,0 +1,66 @@ + + + + + + CSS Test: Testing min-height:auto & 'overflow' interaction + + + + + + + + +
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-min-width-auto-001.htm b/test/render/flex/--flexbox-min-width-auto-001.htm new file mode 100644 index 000000000..b4024df3c --- /dev/null +++ b/test/render/flex/--flexbox-min-width-auto-001.htm @@ -0,0 +1,103 @@ + + + + + + CSS Test: Testing min-width:auto + + + + + + + + + + +
+
+
+ +
+
+
+ +
+
+
+ + + +
+
+
+ +
+
+
+ +
+
+
+ + + +
+
+
+ +
+
+
+ +
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-min-width-auto-003.htm b/test/render/flex/--flexbox-min-width-auto-003.htm new file mode 100644 index 000000000..d7cf60f84 --- /dev/null +++ b/test/render/flex/--flexbox-min-width-auto-003.htm @@ -0,0 +1,58 @@ + + + + + + CSS Test: Testing min-width:auto & 'overflow' interaction + + + + + + + + +
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-min-width-auto-004.htm b/test/render/flex/--flexbox-min-width-auto-004.htm new file mode 100644 index 000000000..6fd481b1e --- /dev/null +++ b/test/render/flex/--flexbox-min-width-auto-004.htm @@ -0,0 +1,64 @@ + + + + + + CSS Test: Testing min-width:auto & 'overflow' interaction + + + + + + + + +
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-overflow-horiz-001.htm b/test/render/flex/--flexbox-overflow-horiz-001.htm new file mode 100644 index 000000000..8e7699ecf --- /dev/null +++ b/test/render/flex/--flexbox-overflow-horiz-001.htm @@ -0,0 +1,58 @@ + + + + + CSS Test: Testing 'overflow' property on a horizontal flex container, with contents not overflowing + + + + + + +
+
+
+
+ +
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-overflow-horiz-002.htm b/test/render/flex/--flexbox-overflow-horiz-002.htm new file mode 100644 index 000000000..5eec845ec --- /dev/null +++ b/test/render/flex/--flexbox-overflow-horiz-002.htm @@ -0,0 +1,54 @@ + + + + + CSS Test: Testing 'overflow' property on a horizontal flex container, with 'align-items: center' + + + + + + +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-overflow-horiz-003.htm b/test/render/flex/--flexbox-overflow-horiz-003.htm new file mode 100644 index 000000000..dc587e4b2 --- /dev/null +++ b/test/render/flex/--flexbox-overflow-horiz-003.htm @@ -0,0 +1,51 @@ + + + + + CSS Test: Testing 'overflow' property on a horizontal flex container, with 'justify-content: space-around' + + + + + + +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-overflow-horiz-004.htm b/test/render/flex/--flexbox-overflow-horiz-004.htm new file mode 100644 index 000000000..91945057a --- /dev/null +++ b/test/render/flex/--flexbox-overflow-horiz-004.htm @@ -0,0 +1,51 @@ + + + + + CSS Test: Testing 'overflow' property on a horizontal flex container, with 'flex-wrap: wrap' + + + + + + +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-overflow-horiz-005.htm b/test/render/flex/--flexbox-overflow-horiz-005.htm new file mode 100644 index 000000000..83d57fbe6 --- /dev/null +++ b/test/render/flex/--flexbox-overflow-horiz-005.htm @@ -0,0 +1,53 @@ + + + + + CSS Test: Testing 'overflow' property on a horizontal flex container, with 'align-content: space-around' + + + + + + +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-overflow-vert-001.htm b/test/render/flex/--flexbox-overflow-vert-001.htm new file mode 100644 index 000000000..5aaf5fda6 --- /dev/null +++ b/test/render/flex/--flexbox-overflow-vert-001.htm @@ -0,0 +1,58 @@ + + + + + CSS Test: Testing 'overflow' property on a vertical flex container + + + + + + +
+
+
+
+ +
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-overflow-vert-002.htm b/test/render/flex/--flexbox-overflow-vert-002.htm new file mode 100644 index 000000000..5085f7c4a --- /dev/null +++ b/test/render/flex/--flexbox-overflow-vert-002.htm @@ -0,0 +1,54 @@ + + + + + CSS Test: Testing 'overflow' property on a vertical flex container, with 'align-items: center' + + + + + + +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-overflow-vert-003.htm b/test/render/flex/--flexbox-overflow-vert-003.htm new file mode 100644 index 000000000..6a920e443 --- /dev/null +++ b/test/render/flex/--flexbox-overflow-vert-003.htm @@ -0,0 +1,51 @@ + + + + + CSS Test: Testing 'overflow' property on a vertical flex container, with 'justify-content: space-around' + + + + + + +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-overflow-vert-004.htm b/test/render/flex/--flexbox-overflow-vert-004.htm new file mode 100644 index 000000000..db61fa174 --- /dev/null +++ b/test/render/flex/--flexbox-overflow-vert-004.htm @@ -0,0 +1,51 @@ + + + + + CSS Test: Testing 'overflow' property on a vertical flex container, with 'flex-wrap: wrap' + + + + + + +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-overflow-vert-005.htm b/test/render/flex/--flexbox-overflow-vert-005.htm new file mode 100644 index 000000000..06026a244 --- /dev/null +++ b/test/render/flex/--flexbox-overflow-vert-005.htm @@ -0,0 +1,53 @@ + + + + + CSS Test: Testing 'overflow' property on a vertical flex container, with 'align-content: space-around' + + + + + + +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-paint-ordering-001.htm b/test/render/flex/--flexbox-paint-ordering-001.htm new file mode 100644 index 000000000..9657a9fa3 --- /dev/null +++ b/test/render/flex/--flexbox-paint-ordering-001.htm @@ -0,0 +1,92 @@ + + + + + + CSS Test: Testing the paint-order of overlapping flex items, with varying tweaks on the container + + + + + + + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ +
+ + +
+
+
+
+ + +
+
+
+
+ +
+ + +
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-paint-ordering-002.htm b/test/render/flex/--flexbox-paint-ordering-002.htm new file mode 100644 index 000000000..a8ea21a2f --- /dev/null +++ b/test/render/flex/--flexbox-paint-ordering-002.htm @@ -0,0 +1,164 @@ + + + + + + CSS Test: Testing the paint-order of overlapping flex items with 'order' and 'z-index' set + + + + + + + +
+
+
+
+ +
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+ + +
+ +
+
+
+ +
+
+
+ +
+
+
+ +
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-root-node-001a.htm b/test/render/flex/--flexbox-root-node-001a.htm new file mode 100644 index 000000000..c97d252de --- /dev/null +++ b/test/render/flex/--flexbox-root-node-001a.htm @@ -0,0 +1,26 @@ + + + + + CSS Test: Testing 'display:flex' on root node + + + + + + + centered + + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-root-node-001b.htm b/test/render/flex/--flexbox-root-node-001b.htm new file mode 100644 index 000000000..c3048b11e --- /dev/null +++ b/test/render/flex/--flexbox-root-node-001b.htm @@ -0,0 +1,24 @@ + + + + + CSS Test: Testing 'display:flex' on root node + + + + + +centered + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-single-line-clamp-1.htm b/test/render/flex/--flexbox-single-line-clamp-1.htm new file mode 100644 index 000000000..39adff3e1 --- /dev/null +++ b/test/render/flex/--flexbox-single-line-clamp-1.htm @@ -0,0 +1,36 @@ + + + + +CSS Test: Single-line flex containers should clamp their line's height to the container's computed min and max cross-size. + + + + +
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-single-line-clamp-3.htm b/test/render/flex/--flexbox-single-line-clamp-3.htm new file mode 100644 index 000000000..064864cb9 --- /dev/null +++ b/test/render/flex/--flexbox-single-line-clamp-3.htm @@ -0,0 +1,42 @@ + + + + +CSS Test: Single-line flex containers should clamp their line's height to the container's computed min and max cross-size. + + + + + +
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-sizing-horiz-001.htm b/test/render/flex/--flexbox-sizing-horiz-001.htm new file mode 100644 index 000000000..665656bad --- /dev/null +++ b/test/render/flex/--flexbox-sizing-horiz-001.htm @@ -0,0 +1,86 @@ + + + + + + CSS Test: Testing sizing of an auto-sized horizontal flex container with min-width and max-width constraints + + + + + + + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-sizing-horiz-002.htm b/test/render/flex/--flexbox-sizing-horiz-002.htm new file mode 100644 index 000000000..6f6f869b2 --- /dev/null +++ b/test/render/flex/--flexbox-sizing-horiz-002.htm @@ -0,0 +1,63 @@ + + + + + + CSS Test: Testing sizing of an auto-sized horizontal flex container with min-height and max-height constraints + + + + + + + +
+
text
+
+ + +
+
text
+
+ + +
+
text
+
+ + +
+
text
+
+ + +
+
text
+
+ + +
+
text
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-sizing-vert-001.htm b/test/render/flex/--flexbox-sizing-vert-001.htm new file mode 100644 index 000000000..e0a6542bc --- /dev/null +++ b/test/render/flex/--flexbox-sizing-vert-001.htm @@ -0,0 +1,100 @@ + + + + + + CSS Test: Testing sizing of an auto-sized vertical flex container with min-height and max-height constraints + + + + + + + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-sizing-vert-002.htm b/test/render/flex/--flexbox-sizing-vert-002.htm new file mode 100644 index 000000000..64a451a64 --- /dev/null +++ b/test/render/flex/--flexbox-sizing-vert-002.htm @@ -0,0 +1,64 @@ + + + + + + CSS Test: Testing sizing of an auto-sized vertical flex container with min-width and max-width constraints + + + + + + + +
+
AB
+
+ + +
+
AB
+
+ + +
+
AB
+
+ + +
+
AB
+
+ + +
+
AB
+
+ + +
+
AB
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox-with-pseudo-elements-003.htm b/test/render/flex/--flexbox-with-pseudo-elements-003.htm new file mode 100644 index 000000000..5939f15af --- /dev/null +++ b/test/render/flex/--flexbox-with-pseudo-elements-003.htm @@ -0,0 +1,69 @@ + + + + + CSS Test: Testing that generated content nodes with table-part display types are wrapped with an anonymous table, which forms a flex item + + + + + + + +
+ x +
y
+ z +
+
+ x +
y
+ z +
+
+ x +
y
+ z +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_align-content-stretch.htm b/test/render/flex/--flexbox_align-content-stretch.htm new file mode 100644 index 000000000..86b4f076a --- /dev/null +++ b/test/render/flex/--flexbox_align-content-stretch.htm @@ -0,0 +1,41 @@ + + + +flexbox | align-content: stretch + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_align-items-baseline.htm b/test/render/flex/--flexbox_align-items-baseline.htm new file mode 100644 index 000000000..eb2d0101b --- /dev/null +++ b/test/render/flex/--flexbox_align-items-baseline.htm @@ -0,0 +1,47 @@ + + + +flexbox | align-items: baseline + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_align-self-baseline.htm b/test/render/flex/--flexbox_align-self-baseline.htm new file mode 100644 index 000000000..07de6419d --- /dev/null +++ b/test/render/flex/--flexbox_align-self-baseline.htm @@ -0,0 +1,43 @@ + + + +flexbox | align-self: baseline + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_block.htm b/test/render/flex/--flexbox_block.htm new file mode 100644 index 000000000..afa26b405 --- /dev/null +++ b/test/render/flex/--flexbox_block.htm @@ -0,0 +1,19 @@ + + + +flexbox | block + + + + + +
FAIL
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_direction-row-reverse.htm b/test/render/flex/--flexbox_direction-row-reverse.htm new file mode 100644 index 000000000..6c52282c8 --- /dev/null +++ b/test/render/flex/--flexbox_direction-row-reverse.htm @@ -0,0 +1,36 @@ + + + +flexbox | flex-direction: row-reverse + + + + + +
    +
  • IJKL
    • +
  • ABCD
    • +
  • EFGH
    • +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_fbfc.htm b/test/render/flex/--flexbox_fbfc.htm new file mode 100644 index 000000000..3168b6f9c --- /dev/null +++ b/test/render/flex/--flexbox_fbfc.htm @@ -0,0 +1,35 @@ + + + +flexbox | flex formatting context :: float intrusion + + + + + +
filler
+ +
+
Yellow box should be below the blue box
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_fbfc2.htm b/test/render/flex/--flexbox_fbfc2.htm new file mode 100644 index 000000000..389e29ae9 --- /dev/null +++ b/test/render/flex/--flexbox_fbfc2.htm @@ -0,0 +1,33 @@ + + + +flexbox | flex formatting context :: float intrusion + + + + + +
float
+ +
+
Yellow box yellow box yellow box
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-0-0-unitless.htm b/test/render/flex/--flexbox_flex-0-0-0-unitless.htm new file mode 100644 index 000000000..813559015 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-0-0-unitless.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 0 0 unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-0-0.htm b/test/render/flex/--flexbox_flex-0-0-0.htm new file mode 100644 index 000000000..58ef45520 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-0-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 0 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-0-N-shrink.htm b/test/render/flex/--flexbox_flex-0-0-N-shrink.htm new file mode 100644 index 000000000..9366af697 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-0-N-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 0 N | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-0-N.htm b/test/render/flex/--flexbox_flex-0-0-N.htm new file mode 100644 index 000000000..64050ab8d --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-0-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 0 N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-0-Npercent-shrink.htm b/test/render/flex/--flexbox_flex-0-0-Npercent-shrink.htm new file mode 100644 index 000000000..6c0a6721e --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-0-Npercent-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 0 N% | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-0-Npercent.htm b/test/render/flex/--flexbox_flex-0-0-Npercent.htm new file mode 100644 index 000000000..e820bbe99 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-0-Npercent.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 0 N% + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-0.htm b/test/render/flex/--flexbox_flex-0-0.htm new file mode 100644 index 000000000..55db99b16 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-1-0-unitless.htm b/test/render/flex/--flexbox_flex-0-1-0-unitless.htm new file mode 100644 index 000000000..961145f00 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-1-0-unitless.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 1 0 unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-1-0.htm b/test/render/flex/--flexbox_flex-0-1-0.htm new file mode 100644 index 000000000..c18705cd4 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-1-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 1 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-1-N-shrink.htm b/test/render/flex/--flexbox_flex-0-1-N-shrink.htm new file mode 100644 index 000000000..f47609027 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-1-N-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 1 N | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-1-N.htm b/test/render/flex/--flexbox_flex-0-1-N.htm new file mode 100644 index 000000000..9c9280ad9 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-1-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 1 N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-1-Npercent-shrink.htm b/test/render/flex/--flexbox_flex-0-1-Npercent-shrink.htm new file mode 100644 index 000000000..ce5c0d2cf --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-1-Npercent-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 1 N% | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-1-Npercent.htm b/test/render/flex/--flexbox_flex-0-1-Npercent.htm new file mode 100644 index 000000000..fb1fb6abd --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-1-Npercent.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 1 N% + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-1-auto-shrink.htm b/test/render/flex/--flexbox_flex-0-1-auto-shrink.htm new file mode 100644 index 000000000..3d036bac3 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-1-auto-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 1 auto | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-1.htm b/test/render/flex/--flexbox_flex-0-1.htm new file mode 100644 index 000000000..6593dde60 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-1.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 1 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-N-0-unitless.htm b/test/render/flex/--flexbox_flex-0-N-0-unitless.htm new file mode 100644 index 000000000..e0037275e --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-N-0-unitless.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 N 0 unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-N-0.htm b/test/render/flex/--flexbox_flex-0-N-0.htm new file mode 100644 index 000000000..dc95168ab --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-N-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 N 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-N-N-shrink.htm b/test/render/flex/--flexbox_flex-0-N-N-shrink.htm new file mode 100644 index 000000000..1a6a829ad --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-N-N-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 N N | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-N-N.htm b/test/render/flex/--flexbox_flex-0-N-N.htm new file mode 100644 index 000000000..2e6ccc57d --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-N-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 N N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-N-Npercent-shrink.htm b/test/render/flex/--flexbox_flex-0-N-Npercent-shrink.htm new file mode 100644 index 000000000..8341ce323 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-N-Npercent-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 N N% | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-N-Npercent.htm b/test/render/flex/--flexbox_flex-0-N-Npercent.htm new file mode 100644 index 000000000..203ecec9a --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-N-Npercent.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 N N% + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-N-auto-shrink.htm b/test/render/flex/--flexbox_flex-0-N-auto-shrink.htm new file mode 100644 index 000000000..3aec84982 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-N-auto-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 N auto | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-N-auto.htm.png b/test/render/flex/--flexbox_flex-0-N-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ab79088f36dfd8d116e113502ffccd63c07bd1d0 GIT binary patch literal 603 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($(bL5-q=ND7RogrzZ;|7H`3uju|GUShbE82uf`RdzE#vR_Lm|n> zRNC^6O#LA}cYaN%C;PQP(eJL4R6IdQF7k41t@plv>#KkDrv$33R*DooxymEVb(7Yl z(1~lhQbJLM=BlQz&RlDL`PRGTUkhhko9`Yx@yyhk`Tmpd=zjZ~-;|QA;;mvo{hi9m z`Kr;g_kNA!EnfQX?4IOpzV_=q_if*HgLiXA?)~$R{{;L`yD9%;Q}ed-PoGZzSFOT+ zc>Cp^yC)q#t+1?9zrAkmIlJlao=i`gU-q-kZuOHtY$yNnPCEZ#*M8OL)l*|+;tRxc zA5S{HeA1lW{5i8#{hcR0(VcYsuI(SUzBlhm<8K|`YrARp_S(q*llN@f&3^Lm^?!9@ zC$Da~Haj!-`{iF2KHU(%1Id&m70+d^lTxAvmP$W)-TlAzejBV|jv5W6({gsL7YE0k dif2_qJ>#TavqeTpHASEl;_2$=vd$@?2>>|b5GViu literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-N.htm b/test/render/flex/--flexbox_flex-0-N.htm new file mode 100644 index 000000000..dcc063bce --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-0-auto.htm b/test/render/flex/--flexbox_flex-0-auto.htm new file mode 100644 index 000000000..d73108513 --- /dev/null +++ b/test/render/flex/--flexbox_flex-0-auto.htm @@ -0,0 +1,45 @@ + + + +flexbox | flex: 0 auto + + + + + +
+ one + two + three + four +
+ +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-0-0-unitless.htm b/test/render/flex/--flexbox_flex-1-0-0-unitless.htm new file mode 100644 index 000000000..de81e61bb --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-0-0-unitless.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 0 0 unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-0-0.htm b/test/render/flex/--flexbox_flex-1-0-0.htm new file mode 100644 index 000000000..92bab58ee --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-0-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 0 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-0-N-shrink.htm b/test/render/flex/--flexbox_flex-1-0-N-shrink.htm new file mode 100644 index 000000000..b4b402985 --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-0-N-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 0 N | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-0-N.htm b/test/render/flex/--flexbox_flex-1-0-N.htm new file mode 100644 index 000000000..033638aed --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-0-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 0 N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-0-Npercent-shrink.htm b/test/render/flex/--flexbox_flex-1-0-Npercent-shrink.htm new file mode 100644 index 000000000..529c49d73 --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-0-Npercent-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 0 N% | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-0-Npercent.htm b/test/render/flex/--flexbox_flex-1-0-Npercent.htm new file mode 100644 index 000000000..21068eb33 --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-0-Npercent.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 0 N% + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-0-auto.htm b/test/render/flex/--flexbox_flex-1-0-auto.htm new file mode 100644 index 000000000..ab966c68f --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-0-auto.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 0 auto + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-0.htm b/test/render/flex/--flexbox_flex-1-0.htm new file mode 100644 index 000000000..996a9b7f6 --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-1-0-unitless.htm b/test/render/flex/--flexbox_flex-1-1-0-unitless.htm new file mode 100644 index 000000000..c949b0bfa --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-1-0-unitless.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 1 0 unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-1-0.htm b/test/render/flex/--flexbox_flex-1-1-0.htm new file mode 100644 index 000000000..c7c1aa59a --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-1-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 1 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-1-N-shrink.htm b/test/render/flex/--flexbox_flex-1-1-N-shrink.htm new file mode 100644 index 000000000..190fa0115 --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-1-N-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 1 N | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-1-N.htm b/test/render/flex/--flexbox_flex-1-1-N.htm new file mode 100644 index 000000000..5f85c54af --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-1-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 1 N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-1-Npercent-shrink.htm b/test/render/flex/--flexbox_flex-1-1-Npercent-shrink.htm new file mode 100644 index 000000000..ba1ebf0fe --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-1-Npercent-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 1 N% | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-1-Npercent.htm b/test/render/flex/--flexbox_flex-1-1-Npercent.htm new file mode 100644 index 000000000..ab07ea327 --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-1-Npercent.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 1 N% + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-1-auto-shrink.htm b/test/render/flex/--flexbox_flex-1-1-auto-shrink.htm new file mode 100644 index 000000000..22bddfe68 --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-1-auto-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 1 auto | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-1-auto.htm b/test/render/flex/--flexbox_flex-1-1-auto.htm new file mode 100644 index 000000000..6e5500fb1 --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-1-auto.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 1 auto + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-1.htm b/test/render/flex/--flexbox_flex-1-1.htm new file mode 100644 index 000000000..89fd32ced --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-1.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 1 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-N-0-unitless.htm b/test/render/flex/--flexbox_flex-1-N-0-unitless.htm new file mode 100644 index 000000000..206b9c492 --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-N-0-unitless.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 N 0 unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-N-0.htm b/test/render/flex/--flexbox_flex-1-N-0.htm new file mode 100644 index 000000000..cfa10fdae --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-N-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 N 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-N-N-shrink.htm b/test/render/flex/--flexbox_flex-1-N-N-shrink.htm new file mode 100644 index 000000000..5c0b3e50c --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-N-N-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 N N | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-N-N.htm b/test/render/flex/--flexbox_flex-1-N-N.htm new file mode 100644 index 000000000..1bdef9f5c --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-N-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 N N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-N-Npercent-shrink.htm b/test/render/flex/--flexbox_flex-1-N-Npercent-shrink.htm new file mode 100644 index 000000000..a6c8ef46e --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-N-Npercent-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 N N% | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-N-Npercent.htm b/test/render/flex/--flexbox_flex-1-N-Npercent.htm new file mode 100644 index 000000000..e7315b6ce --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-N-Npercent.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 N N% + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-N-auto-shrink.htm b/test/render/flex/--flexbox_flex-1-N-auto-shrink.htm new file mode 100644 index 000000000..bd2c4b006 --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-N-auto-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 N auto | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-N-auto.htm b/test/render/flex/--flexbox_flex-1-N-auto.htm new file mode 100644 index 000000000..2f0f62802 --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-N-auto.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 N auto + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-1-N.htm b/test/render/flex/--flexbox_flex-1-N.htm new file mode 100644 index 000000000..b71a7844d --- /dev/null +++ b/test/render/flex/--flexbox_flex-1-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-0-0-unitless.htm b/test/render/flex/--flexbox_flex-N-0-0-unitless.htm new file mode 100644 index 000000000..44e396dde --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-0-0-unitless.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 0 0 unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-0-0.htm b/test/render/flex/--flexbox_flex-N-0-0.htm new file mode 100644 index 000000000..5bafb73bf --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-0-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 0 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-0-N-shrink.htm b/test/render/flex/--flexbox_flex-N-0-N-shrink.htm new file mode 100644 index 000000000..d5b521eaf --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-0-N-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 0 N | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-0-N.htm b/test/render/flex/--flexbox_flex-N-0-N.htm new file mode 100644 index 000000000..79b20dccb --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-0-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 0 N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-0-Npercent-shrink.htm b/test/render/flex/--flexbox_flex-N-0-Npercent-shrink.htm new file mode 100644 index 000000000..83d4efe01 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-0-Npercent-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 0 N% | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-0-Npercent.htm b/test/render/flex/--flexbox_flex-N-0-Npercent.htm new file mode 100644 index 000000000..ba1ee80d9 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-0-Npercent.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 0 N% + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-0-auto.htm b/test/render/flex/--flexbox_flex-N-0-auto.htm new file mode 100644 index 000000000..bf9fb04ab --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-0-auto.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 0 auto + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-0.htm b/test/render/flex/--flexbox_flex-N-0.htm new file mode 100644 index 000000000..71e7d40c6 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-1-0-unitless.htm b/test/render/flex/--flexbox_flex-N-1-0-unitless.htm new file mode 100644 index 000000000..8db840065 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-1-0-unitless.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 1 0 unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-1-0.htm b/test/render/flex/--flexbox_flex-N-1-0.htm new file mode 100644 index 000000000..c21c35d9a --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-1-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 1 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-1-N-shrink.htm b/test/render/flex/--flexbox_flex-N-1-N-shrink.htm new file mode 100644 index 000000000..d6b4b0070 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-1-N-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 1 N | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-1-N.htm b/test/render/flex/--flexbox_flex-N-1-N.htm new file mode 100644 index 000000000..9b6fc8931 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-1-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 1 N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-1-Npercent-shrink.htm b/test/render/flex/--flexbox_flex-N-1-Npercent-shrink.htm new file mode 100644 index 000000000..333bd4818 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-1-Npercent-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 1 N% | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-1-Npercent.htm b/test/render/flex/--flexbox_flex-N-1-Npercent.htm new file mode 100644 index 000000000..b2f5e9544 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-1-Npercent.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 1 N% + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-1-auto-shrink.htm b/test/render/flex/--flexbox_flex-N-1-auto-shrink.htm new file mode 100644 index 000000000..7ced23183 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-1-auto-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 1 auto | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-1-auto.htm b/test/render/flex/--flexbox_flex-N-1-auto.htm new file mode 100644 index 000000000..7ed3906de --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-1-auto.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 1 auto + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-1.htm b/test/render/flex/--flexbox_flex-N-1.htm new file mode 100644 index 000000000..d49d01cbc --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-1.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N 1 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-N-0-unitless.htm b/test/render/flex/--flexbox_flex-N-N-0-unitless.htm new file mode 100644 index 000000000..de5b00aa8 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-N-0-unitless.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N N 0 unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-N-0.htm b/test/render/flex/--flexbox_flex-N-N-0.htm new file mode 100644 index 000000000..b4f5c7e43 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-N-0.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N N 0 + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-N-N-shrink.htm b/test/render/flex/--flexbox_flex-N-N-N-shrink.htm new file mode 100644 index 000000000..37fdc2e08 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-N-N-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N N N | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-N-N.htm b/test/render/flex/--flexbox_flex-N-N-N.htm new file mode 100644 index 000000000..a78dc76fb --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-N-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N N N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-N-Npercent-shrink.htm b/test/render/flex/--flexbox_flex-N-N-Npercent-shrink.htm new file mode 100644 index 000000000..ce213915f --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-N-Npercent-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N N N% | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-N-Npercent.htm b/test/render/flex/--flexbox_flex-N-N-Npercent.htm new file mode 100644 index 000000000..61eaa98c9 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-N-Npercent.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N N N% + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-N-auto-shrink.htm b/test/render/flex/--flexbox_flex-N-N-auto-shrink.htm new file mode 100644 index 000000000..eb8660deb --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-N-auto-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N N auto | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-N-auto.htm b/test/render/flex/--flexbox_flex-N-N-auto.htm new file mode 100644 index 000000000..86664de23 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-N-auto.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N N auto + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-N-N.htm b/test/render/flex/--flexbox_flex-N-N.htm new file mode 100644 index 000000000..ff3133041 --- /dev/null +++ b/test/render/flex/--flexbox_flex-N-N.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: N N + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-auto.htm b/test/render/flex/--flexbox_flex-auto.htm new file mode 100644 index 000000000..88216df16 --- /dev/null +++ b/test/render/flex/--flexbox_flex-auto.htm @@ -0,0 +1,46 @@ + + + +flexbox | flex: auto + + + + + +
+ one + two + three + four +
+ +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-basis-shrink.htm b/test/render/flex/--flexbox_flex-basis-shrink.htm new file mode 100644 index 000000000..bf101f0c3 --- /dev/null +++ b/test/render/flex/--flexbox_flex-basis-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex-basis: percentage, flex-shrink: +integer + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-basis.htm b/test/render/flex/--flexbox_flex-basis.htm new file mode 100644 index 000000000..fc6dc1204 --- /dev/null +++ b/test/render/flex/--flexbox_flex-basis.htm @@ -0,0 +1,42 @@ + + + +flexbox | flex-basis: percentage + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-formatting-interop.htm b/test/render/flex/--flexbox_flex-formatting-interop.htm new file mode 100644 index 000000000..3fdfbd8fd --- /dev/null +++ b/test/render/flex/--flexbox_flex-formatting-interop.htm @@ -0,0 +1,41 @@ + + + +flexbox | flex formatting context :: negative margins and + border box + + + + + +
float
+ +
+
xxx xxx xxx xxx xxx xxx xxx xxx xxx xxx xxx
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-initial.htm b/test/render/flex/--flexbox_flex-initial.htm new file mode 100644 index 000000000..e8ae362ab --- /dev/null +++ b/test/render/flex/--flexbox_flex-initial.htm @@ -0,0 +1,45 @@ + + + +flexbox | flex: initial + + + + + +
+ one + two + three + four +
+ +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-natural-mixed-basis.htm b/test/render/flex/--flexbox_flex-natural-mixed-basis.htm new file mode 100644 index 000000000..cc902e13d --- /dev/null +++ b/test/render/flex/--flexbox_flex-natural-mixed-basis.htm @@ -0,0 +1,39 @@ + + + +flexbox | flex: larger integer, mixed basis + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-natural-variable-auto-basis.htm b/test/render/flex/--flexbox_flex-natural-variable-auto-basis.htm new file mode 100644 index 000000000..440ee8e4f --- /dev/null +++ b/test/render/flex/--flexbox_flex-natural-variable-auto-basis.htm @@ -0,0 +1,39 @@ + + + +flexbox | flex: larger integer, auto basis + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-natural-variable-zero-basis.htm b/test/render/flex/--flexbox_flex-natural-variable-zero-basis.htm new file mode 100644 index 000000000..df74f95b0 --- /dev/null +++ b/test/render/flex/--flexbox_flex-natural-variable-zero-basis.htm @@ -0,0 +1,39 @@ + + + +flexbox | flex: larger integer, zero basis + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-natural.htm b/test/render/flex/--flexbox_flex-natural.htm new file mode 100644 index 000000000..4d566babd --- /dev/null +++ b/test/render/flex/--flexbox_flex-natural.htm @@ -0,0 +1,50 @@ + + + +flexbox | flex: larger integer + + + + + +
+ one + two + three + four +
+ +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_flex-none-wrappable-content.htm b/test/render/flex/--flexbox_flex-none-wrappable-content.htm new file mode 100644 index 000000000..057a770f9 --- /dev/null +++ b/test/render/flex/--flexbox_flex-none-wrappable-content.htm @@ -0,0 +1,26 @@ + + + +Specifying flex:none on wrappable content should give content its full width + + + + + + + +
+
+ XXX XXX XXX +
+
+ +
You should see three green rectangles above, all on the same line.
+ + + diff --git a/test/render/flex/--flexbox_inline-abspos.htm b/test/render/flex/--flexbox_inline-abspos.htm new file mode 100644 index 000000000..abfa9179f --- /dev/null +++ b/test/render/flex/--flexbox_inline-abspos.htm @@ -0,0 +1,20 @@ + + + +flexbox | absolutely positioned inline + + + + + +
FAIL
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_inline-float.htm b/test/render/flex/--flexbox_inline-float.htm new file mode 100644 index 000000000..2631c110f --- /dev/null +++ b/test/render/flex/--flexbox_inline-float.htm @@ -0,0 +1,20 @@ + + + +flexbox | floated inline + + + + + +
FAIL
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_inline.htm b/test/render/flex/--flexbox_inline.htm new file mode 100644 index 000000000..2fad137c2 --- /dev/null +++ b/test/render/flex/--flexbox_inline.htm @@ -0,0 +1,20 @@ + + + +flexbox | inline + + + + + +
HELLOWORLD
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_justifycontent-center.htm b/test/render/flex/--flexbox_justifycontent-center.htm new file mode 100644 index 000000000..d7ed4cae2 --- /dev/null +++ b/test/render/flex/--flexbox_justifycontent-center.htm @@ -0,0 +1,40 @@ + + + +flexbox | justify-content: center + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_justifycontent-flex-end.htm b/test/render/flex/--flexbox_justifycontent-flex-end.htm new file mode 100644 index 000000000..0291d8c1e --- /dev/null +++ b/test/render/flex/--flexbox_justifycontent-flex-end.htm @@ -0,0 +1,40 @@ + + + +flexbox | justify-content: flex-end + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_justifycontent-flex-start.htm b/test/render/flex/--flexbox_justifycontent-flex-start.htm new file mode 100644 index 000000000..0137f5430 --- /dev/null +++ b/test/render/flex/--flexbox_justifycontent-flex-start.htm @@ -0,0 +1,40 @@ + + + +flexbox | justify-content: flex-start + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_justifycontent-spacearound-only.htm b/test/render/flex/--flexbox_justifycontent-spacearound-only.htm new file mode 100644 index 000000000..89eb31c70 --- /dev/null +++ b/test/render/flex/--flexbox_justifycontent-spacearound-only.htm @@ -0,0 +1,35 @@ + + + +flexbox | justify-content: space-around | single item + + + + + +
+ one +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_justifycontent-spacearound.htm b/test/render/flex/--flexbox_justifycontent-spacearound.htm new file mode 100644 index 000000000..0fb853862 --- /dev/null +++ b/test/render/flex/--flexbox_justifycontent-spacearound.htm @@ -0,0 +1,40 @@ + + + +flexbox | justify-content: space-around + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_justifycontent-spacebetween.htm b/test/render/flex/--flexbox_justifycontent-spacebetween.htm new file mode 100644 index 000000000..c8e00a382 --- /dev/null +++ b/test/render/flex/--flexbox_justifycontent-spacebetween.htm @@ -0,0 +1,40 @@ + + + +flexbox | justify-content: space-between + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_margin-auto.htm b/test/render/flex/--flexbox_margin-auto.htm new file mode 100644 index 000000000..3f49cacf5 --- /dev/null +++ b/test/render/flex/--flexbox_margin-auto.htm @@ -0,0 +1,33 @@ + + + +flexbox | margin: auto + + + + + +
+ one + two +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_margin-left-ex.htm b/test/render/flex/--flexbox_margin-left-ex.htm new file mode 100644 index 000000000..ebe7e1c5f --- /dev/null +++ b/test/render/flex/--flexbox_margin-left-ex.htm @@ -0,0 +1,33 @@ + + + +flexbox | margin-left: auto + + + + + +
+ onetwothreefour
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_order-abspos-space-around.htm b/test/render/flex/--flexbox_order-abspos-space-around.htm new file mode 100644 index 000000000..883cd24c5 --- /dev/null +++ b/test/render/flex/--flexbox_order-abspos-space-around.htm @@ -0,0 +1,39 @@ + + + +flexbox | order; justify-content: space-around + + + + + +
+ filler + + filler + filler +
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_order-noninteger-invalid.htm b/test/render/flex/--flexbox_order-noninteger-invalid.htm new file mode 100644 index 000000000..2c4eb9b40 --- /dev/null +++ b/test/render/flex/--flexbox_order-noninteger-invalid.htm @@ -0,0 +1,44 @@ + + + +flexbox | flex-flow: column-reverse wrap-reverse; order + + + + + + +
+ + +
+ +

+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_rowspan-overflow-automatic.htm b/test/render/flex/--flexbox_rowspan-overflow-automatic.htm new file mode 100644 index 000000000..6209c6a85 --- /dev/null +++ b/test/render/flex/--flexbox_rowspan-overflow-automatic.htm @@ -0,0 +1,69 @@ + + + +flexbox | flexcontainers in cells with rowspan + + + + + + + + + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+		 +
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_rowspan-overflow.htm b/test/render/flex/--flexbox_rowspan-overflow.htm new file mode 100644 index 000000000..281ba4ec9 --- /dev/null +++ b/test/render/flex/--flexbox_rowspan-overflow.htm @@ -0,0 +1,68 @@ + + + +flexbox | flexcontainers in cells with rowspan + + + + + + + + + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+		 +
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_rowspan.htm b/test/render/flex/--flexbox_rowspan.htm new file mode 100644 index 000000000..f99fd379e --- /dev/null +++ b/test/render/flex/--flexbox_rowspan.htm @@ -0,0 +1,68 @@ + + + +flexbox | flexcontainers in cells with rowspan + + + + + + + + + + + + + +
+
+

 

+

 

+

 

+

 

+

 

+
+		 +
+

 

+

 

+

 

+

 

+

 

+
+
+
+

 

+

 

+

 

+

 

+

 

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_stf-table-singleline-2.htm b/test/render/flex/--flexbox_stf-table-singleline-2.htm new file mode 100644 index 000000000..fc8065b2e --- /dev/null +++ b/test/render/flex/--flexbox_stf-table-singleline-2.htm @@ -0,0 +1,41 @@ + + + +flexbox | singleline flexcontainer versus stf :: table + + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + diff --git a/test/render/flex/--flexbox_stf-table-singleline.htm b/test/render/flex/--flexbox_stf-table-singleline.htm new file mode 100644 index 000000000..8f5db709d --- /dev/null +++ b/test/render/flex/--flexbox_stf-table-singleline.htm @@ -0,0 +1,38 @@ + + + +flexbox | singleline flexcontainer versus stf :: table + + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + diff --git a/test/render/flex/--flexbox_table-fixed-layout.htm b/test/render/flex/--flexbox_table-fixed-layout.htm new file mode 100644 index 000000000..e369f7349 --- /dev/null +++ b/test/render/flex/--flexbox_table-fixed-layout.htm @@ -0,0 +1,58 @@ + + + +flexbox | flexcontainers in tables + + + + + + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+		 +
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--flexbox_wrap-long.htm b/test/render/flex/--flexbox_wrap-long.htm new file mode 100644 index 000000000..3f03c50f3 --- /dev/null +++ b/test/render/flex/--flexbox_wrap-long.htm @@ -0,0 +1,37 @@ + + + +flexbox | flex-wrap: wrap / long items + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/--multi-line-wrap-reverse-column-reverse.htm b/test/render/flex/--multi-line-wrap-reverse-column-reverse.htm new file mode 100644 index 000000000..4f88b89fa --- /dev/null +++ b/test/render/flex/--multi-line-wrap-reverse-column-reverse.htm @@ -0,0 +1,74 @@ + + + + + CSS Test: flex container multiline wrapping-reverse in column-reverse direction. + + + + + + + + + + +
+

3-1

+

2-2

+

2-1

+

1-3

+

1-2

+

1-1

+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--multiline-reverse-wrap-baseline.htm b/test/render/flex/--multiline-reverse-wrap-baseline.htm new file mode 100644 index 000000000..e35cf60f8 --- /dev/null +++ b/test/render/flex/--multiline-reverse-wrap-baseline.htm @@ -0,0 +1,61 @@ + + + +CSS Flexbox: multiline reverse wrap baseline. + + + + + + +
+
first
first
first
+
second
+
third
+
fourth
fourth
+
+ +
+
first
first
first
+
second
+
third
+
fourth
fourth
+
+ +
+
first
+
second
+
third
third
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--multiline-shrink-to-fit.htm b/test/render/flex/--multiline-shrink-to-fit.htm new file mode 100644 index 000000000..f14c44a91 --- /dev/null +++ b/test/render/flex/--multiline-shrink-to-fit.htm @@ -0,0 +1,77 @@ + + + +CSS Flexbox: multiline column flexboxes and shrink-to-fit. + + + + + + +
+
+
+
+
+
+

The grey background should be 100px wide.

+ +
+
+
+
+
+
+

The grey background should be 100px wide.

+ +
+
+
+
+
+
+
+
+

The grey background should be 100px wide.

+ +
+
+
+
+
+
+
+
+

The grey background should be 100px wide and 5px should +stick out the bottom.

+ + + + + + \ No newline at end of file diff --git a/test/render/flex/--negative-flex-margins-crash.htm b/test/render/flex/--negative-flex-margins-crash.htm new file mode 100644 index 000000000..c6cdcfe62 --- /dev/null +++ b/test/render/flex/--negative-flex-margins-crash.htm @@ -0,0 +1,26 @@ + + + +CSS Flexbox: Crash caused by negative width in flex box + + + + + + +
+
+
PASS if we don't assert
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--percentage-heights-006.htm b/test/render/flex/--percentage-heights-006.htm new file mode 100644 index 000000000..60822626a --- /dev/null +++ b/test/render/flex/--percentage-heights-006.htm @@ -0,0 +1,48 @@ + + + +Definite cross sizes + + + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+ + + +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--percentage-heights-007.htm b/test/render/flex/--percentage-heights-007.htm new file mode 100644 index 000000000..a72e33d16 --- /dev/null +++ b/test/render/flex/--percentage-heights-007.htm @@ -0,0 +1,47 @@ + + + +Definite sizes with fixed flex-basis + + + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+ + + +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/--percentage-heights-008.htm b/test/render/flex/--percentage-heights-008.htm new file mode 100644 index 000000000..50ca6ebb2 --- /dev/null +++ b/test/render/flex/--percentage-heights-008.htm @@ -0,0 +1,39 @@ + + + +Fixed indefinite heights + + + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--percentage-heights-009.htm b/test/render/flex/--percentage-heights-009.htm new file mode 100644 index 000000000..55cbd1e14 --- /dev/null +++ b/test/render/flex/--percentage-heights-009.htm @@ -0,0 +1,42 @@ + + + +height: 100% should not be considered indefinite on a second flex item (triggers an obscure bug in Blink) + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--percentage-heights-010.htm b/test/render/flex/--percentage-heights-010.htm new file mode 100644 index 000000000..2edd86989 --- /dev/null +++ b/test/render/flex/--percentage-heights-010.htm @@ -0,0 +1,18 @@ + + + +A height: 100% descendant should trigger a relayout when stretching. + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--space-evenly-001.htm b/test/render/flex/--space-evenly-001.htm new file mode 100644 index 000000000..51420ef4d --- /dev/null +++ b/test/render/flex/--space-evenly-001.htm @@ -0,0 +1,40 @@ + + + + + CSS Box Alignment: space-evenly & flexbox with single item + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-fixed-min-width-2.htm b/test/render/flex/--table-as-item-fixed-min-width-2.htm new file mode 100644 index 000000000..34b4a2b95 --- /dev/null +++ b/test/render/flex/--table-as-item-fixed-min-width-2.htm @@ -0,0 +1,23 @@ + + + +table is flex item + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-fixed-min-width-3.htm b/test/render/flex/--table-as-item-fixed-min-width-3.htm new file mode 100644 index 000000000..2dc259d70 --- /dev/null +++ b/test/render/flex/--table-as-item-fixed-min-width-3.htm @@ -0,0 +1,25 @@ + + + +table is flex item + + + + + + +

Test passes if there is a filled green square and no red.

+ + + +
+
+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-flex-cross-size.htm b/test/render/flex/--table-as-item-flex-cross-size.htm new file mode 100644 index 000000000..12118e145 --- /dev/null +++ b/test/render/flex/--table-as-item-flex-cross-size.htm @@ -0,0 +1,17 @@ + + + + + + +

Test passes if there is a filled green square and no red.

+
+ + + + +
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-inflexible-in-column-1.htm b/test/render/flex/--table-as-item-inflexible-in-column-1.htm new file mode 100644 index 000000000..c525aa0ed --- /dev/null +++ b/test/render/flex/--table-as-item-inflexible-in-column-1.htm @@ -0,0 +1,19 @@ + + + +Table as a flex item in column-oriented flex container + + + + + + + + +

Test passes if there is a filled green square.

+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-inflexible-in-column-2.htm b/test/render/flex/--table-as-item-inflexible-in-column-2.htm new file mode 100644 index 000000000..97f0caaa0 --- /dev/null +++ b/test/render/flex/--table-as-item-inflexible-in-column-2.htm @@ -0,0 +1,22 @@ + + + +Table as a flex item in column-oriented flex container + + + + + + + + +

Test passes if there is a filled green square.

+
+ + +
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-inflexible-in-row-1.htm b/test/render/flex/--table-as-item-inflexible-in-row-1.htm new file mode 100644 index 000000000..b1b7574fc --- /dev/null +++ b/test/render/flex/--table-as-item-inflexible-in-row-1.htm @@ -0,0 +1,19 @@ + + + +Table as a flex item in row-oriented flex container + + + + + + + + +

Test passes if there is a filled green square.

+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-inflexible-in-row-2.htm b/test/render/flex/--table-as-item-inflexible-in-row-2.htm new file mode 100644 index 000000000..a4e391d06 --- /dev/null +++ b/test/render/flex/--table-as-item-inflexible-in-row-2.htm @@ -0,0 +1,22 @@ + + + +Table as a flex item in row-oriented flex container + + + + + + + + +

Test passes if there is a filled green square.

+
+ + +
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-narrow-content.htm b/test/render/flex/--table-as-item-narrow-content.htm new file mode 100644 index 000000000..5aeafed47 --- /dev/null +++ b/test/render/flex/--table-as-item-narrow-content.htm @@ -0,0 +1,18 @@ + + + +CSS Flexbox Test: Flex item as table with narrow content + + + + +

Test passes if there is a filled green square.

+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-specified-height.htm b/test/render/flex/--table-as-item-specified-height.htm new file mode 100644 index 000000000..d90ed789e --- /dev/null +++ b/test/render/flex/--table-as-item-specified-height.htm @@ -0,0 +1,20 @@ + + + +table is flex item + + + + + + + + +

Test passes if there is a filled green square.

+ +
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-specified-width.htm b/test/render/flex/--table-as-item-specified-width.htm new file mode 100644 index 000000000..df4b62c2d --- /dev/null +++ b/test/render/flex/--table-as-item-specified-width.htm @@ -0,0 +1,21 @@ + + + +table is flex item + + + + + + +

Test passes if there is a filled green square.

+ + + +
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-stretch-cross-size-2.htm b/test/render/flex/--table-as-item-stretch-cross-size-2.htm new file mode 100644 index 000000000..303ae80e0 --- /dev/null +++ b/test/render/flex/--table-as-item-stretch-cross-size-2.htm @@ -0,0 +1,18 @@ + + + + + + + +

Test passes if there is a filled green square and no red.

+
+ + + + +
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-stretch-cross-size-3.htm b/test/render/flex/--table-as-item-stretch-cross-size-3.htm new file mode 100644 index 000000000..9bd295840 --- /dev/null +++ b/test/render/flex/--table-as-item-stretch-cross-size-3.htm @@ -0,0 +1,30 @@ + + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+ +
+ + + +
+
+ + + \ No newline at end of file diff --git a/test/render/flex/--table-as-item-stretch-cross-size.htm b/test/render/flex/--table-as-item-stretch-cross-size.htm new file mode 100644 index 000000000..af582df4f --- /dev/null +++ b/test/render/flex/--table-as-item-stretch-cross-size.htm @@ -0,0 +1,17 @@ + + + + + + +

Test passes if there is a filled green square and no red.

+
+ + + + +
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-align-content-001.htm b/test/render/flex/-align-content-001.htm new file mode 100644 index 000000000..aa73086e7 --- /dev/null +++ b/test/render/flex/-align-content-001.htm @@ -0,0 +1,42 @@ + + + + + CSS Test: A multi-line flex container with the 'align-content' property set to 'center' + + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-align-content-002.htm b/test/render/flex/-align-content-002.htm new file mode 100644 index 000000000..f3775be9c --- /dev/null +++ b/test/render/flex/-align-content-002.htm @@ -0,0 +1,41 @@ + + + + + CSS Test: A multi-line flex container with the 'align-content' property set to 'flex-start' + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-align-content-003.htm b/test/render/flex/-align-content-003.htm new file mode 100644 index 000000000..c18c287e6 --- /dev/null +++ b/test/render/flex/-align-content-003.htm @@ -0,0 +1,41 @@ + + + + + CSS Test: A multi-line flex container with the 'align-content' property set to 'flex-end' + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-align-content-004.htm b/test/render/flex/-align-content-004.htm new file mode 100644 index 000000000..3aef07d90 --- /dev/null +++ b/test/render/flex/-align-content-004.htm @@ -0,0 +1,43 @@ + + + + + CSS Test: A multi-line flex container with the 'align-content' property set to 'space-between' + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-align-content-005.htm b/test/render/flex/-align-content-005.htm new file mode 100644 index 000000000..dffc1adb9 --- /dev/null +++ b/test/render/flex/-align-content-005.htm @@ -0,0 +1,41 @@ + + + + + CSS Test: A multi-line flex container with the 'align-content' property set to 'space-around' + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-align-items-001.htm b/test/render/flex/-align-items-001.htm new file mode 100644 index 000000000..6847c0170 --- /dev/null +++ b/test/render/flex/-align-items-001.htm @@ -0,0 +1,39 @@ + + + + + CSS Test: A flex container with the 'align-items' property set to 'center' + + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-align-items-002.htm b/test/render/flex/-align-items-002.htm new file mode 100644 index 000000000..202703771 --- /dev/null +++ b/test/render/flex/-align-items-002.htm @@ -0,0 +1,40 @@ + + + + + CSS Test: A flex container with the 'align-items' property set to 'flex-start' + + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-align-items-003.htm b/test/render/flex/-align-items-003.htm new file mode 100644 index 000000000..40f3807e2 --- /dev/null +++ b/test/render/flex/-align-items-003.htm @@ -0,0 +1,40 @@ + + + + + CSS Test: A flex container with the 'align-items' property set to 'flex-end' + + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-contain-layout-suppress-baseline-002.htm b/test/render/flex/-contain-layout-suppress-baseline-002.htm new file mode 100644 index 000000000..7e3b59746 --- /dev/null +++ b/test/render/flex/-contain-layout-suppress-baseline-002.htm @@ -0,0 +1,75 @@ + + + + + + CSS Test: 'contain: layout' should make elements behave as if they have no baseline + + + + + + + +
+ + + + + + +
+ + +
+ + + +
+ +
+ + + +
+ +
+ + + +
+ +
+ + + +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-content-height-with-scrollbars.htm b/test/render/flex/-content-height-with-scrollbars.htm new file mode 100644 index 000000000..505d54a31 --- /dev/null +++ b/test/render/flex/-content-height-with-scrollbars.htm @@ -0,0 +1,47 @@ + +Ensure flexbox content-size excludes scrollbar. + + + + + + + +

This tests that when setting the height of a flex item to a percentage +height, we use the content height with scrollbars. The content should not be +scrollable in any of the test cases below.

+ +
+
+
+ +
+
+
+ +
+
+
+
+ +
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-cross-axis-scrollbar.htm b/test/render/flex/-cross-axis-scrollbar.htm new file mode 100644 index 000000000..1c3ed5c86 --- /dev/null +++ b/test/render/flex/-cross-axis-scrollbar.htm @@ -0,0 +1,147 @@ + + + +CSS Flexbox: Scrollbars and flex-direction. + + + + + + + + +This test passes if no red is showing. + +
+ +
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+ +
+ + + + + + + diff --git a/test/render/flex/-css-box-justify-content.htm b/test/render/flex/-css-box-justify-content.htm new file mode 100644 index 000000000..5f0a96e61 --- /dev/null +++ b/test/render/flex/-css-box-justify-content.htm @@ -0,0 +1,34 @@ + +flexbox |css-box-justify-content + + + + + + +

This test passes if the DIV5's position in the end and the div is Horizontal layout

+
+
DIV1
+   +
DIV2
+   +
DIV3
+   +
DIV4
+   +
DIV5
+
+ \ No newline at end of file diff --git a/test/render/flex/-css-flexbox-row-reverse-wrap-reverse.htm b/test/render/flex/-css-flexbox-row-reverse-wrap-reverse.htm new file mode 100644 index 000000000..ad22c18f0 --- /dev/null +++ b/test/render/flex/-css-flexbox-row-reverse-wrap-reverse.htm @@ -0,0 +1,47 @@ + + + + + + CSS Flexbox Test: flex direction: row, writing mode vertical + + + + + + + + + + + + + +

Pass condition: 4 rectangles, with colors in clockwise order starting from top-left: grey, orange, blue, yellow. + +

+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-css-flexbox-row-reverse-wrap.htm b/test/render/flex/-css-flexbox-row-reverse-wrap.htm new file mode 100644 index 000000000..b486bc427 --- /dev/null +++ b/test/render/flex/-css-flexbox-row-reverse-wrap.htm @@ -0,0 +1,47 @@ + + + + + + CSS Flexbox Test: flex direction: row, writing mode vertical + + + + + + + + + + + + + +

Pass condition: 4 rectangles, with colors in clockwise order starting from top-left: grey, orange, blue, yellow. + +

+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-css-flexbox-row-reverse.htm b/test/render/flex/-css-flexbox-row-reverse.htm new file mode 100644 index 000000000..9eb276549 --- /dev/null +++ b/test/render/flex/-css-flexbox-row-reverse.htm @@ -0,0 +1,56 @@ + + + + + + CSS Flexbox Test: flex direction: row, writing mode vertical + + + + + + + + + + + + + +

Pass condition: 4 rectangles, with colors in clockwise order starting from top-left: grey, orange, blue, yellow. +

+
+ +
+ +
+
+ +
+ +
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-css-flexbox-row-wrap-reverse.htm b/test/render/flex/-css-flexbox-row-wrap-reverse.htm new file mode 100644 index 000000000..e0e2529ec --- /dev/null +++ b/test/render/flex/-css-flexbox-row-wrap-reverse.htm @@ -0,0 +1,46 @@ + + + + + + CSS Flexbox Test: flex direction: row, writing mode vertical + + + + + + + + + + + + + +

Pass condition: 4 rectangles, with colors in clockwise order starting from top-left: grey, orange, blue, yellow. +

+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-css-flexbox-row-wrap.htm b/test/render/flex/-css-flexbox-row-wrap.htm new file mode 100644 index 000000000..f2c5a5d04 --- /dev/null +++ b/test/render/flex/-css-flexbox-row-wrap.htm @@ -0,0 +1,47 @@ + + + + + + CSS Flexbox Test: flex direction: row, writing mode vertical + + + + + + + + + + + + + +

Pass condition: 4 rectangles, with colors in clockwise order starting from top-left: grey, orange, blue, yellow. + +

+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-css-flexbox-row.htm b/test/render/flex/-css-flexbox-row.htm new file mode 100644 index 000000000..31903c847 --- /dev/null +++ b/test/render/flex/-css-flexbox-row.htm @@ -0,0 +1,56 @@ + + + + + + CSS Flexbox Test: flex direction: row, writing mode vertical + + + + + + + + + + + + + +

Pass condition: 4 rectangles, with colors in clockwise order starting from top-left: grey, orange, blue, yellow. +

+
+ +
+ +
+
+ +
+ +
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-css-flexbox-test1.htm b/test/render/flex/-css-flexbox-test1.htm new file mode 100644 index 000000000..e5d205776 --- /dev/null +++ b/test/render/flex/-css-flexbox-test1.htm @@ -0,0 +1,54 @@ + + + + + + CSS Flexbox Test: flex direction: row, writing mode vertical + + + + + + + + + + + + +

The test passes if you see a tall green box with pairs of the digits 1-9 listed top to bottom in two columns.

+ +
+
+
１２３
１２３
+
４５６
４５６
+
７８９
７８９
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-direction-upright-002.htm b/test/render/flex/-direction-upright-002.htm new file mode 100644 index 000000000..2b5a232aa --- /dev/null +++ b/test/render/flex/-direction-upright-002.htm @@ -0,0 +1,142 @@ + + + +'text-orientation: upright' forces used 'direction' to LTR in vertical typographic modes + + + + + + + + +

Test passes if both rows of boxes are identical (coloring, order, orientation, and arrangement of contents). + + + +

+ + + +
ABC +
+
A B
+
A B
+
A Bb CcDd Ee
+
+
+ + + +
ABC +
+
A B
+
A B
+
A Bb CcDd Ee
+
+ + + +
+ + + +
ABC +
+
A B
+
A B
+
A Bb CcDd Ee
+
+
+ + + +
ABC +
+
A B
+
A B
+
A Bb CcDd Ee
+
+
+ + + +
ABC +
+
A B
+
A B
+
A Bb CcDd Ee
+
+ +
+ + + +
+ + + +
ABC +
+
A B
+
A B
+
A Bb CcDd Ee
+
+
+ + + +
ABC +
+
A B
+
A B
+
A Bb CcDd Ee
+
+ +
+ + + +
ABC +
+
A B
+
A B
+
A Bb CcDd Ee
+
+
+ + + +
ABC +
+
A B
+
A B
+
A Bb CcDd Ee
+
+
+ + + +
ABC +
+
A B
+
A B
+
A Bb CcDd Ee
+
+ + \ No newline at end of file diff --git a/test/render/flex/-flex-002.htm b/test/render/flex/-flex-002.htm new file mode 100644 index 000000000..401e6cdf7 --- /dev/null +++ b/test/render/flex/-flex-002.htm @@ -0,0 +1,53 @@ + + + CSS Test: The 'flex' shorthand adjusting the 'flex-shrink' sub-property + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-flex-003.htm b/test/render/flex/-flex-003.htm new file mode 100644 index 000000000..05f942644 --- /dev/null +++ b/test/render/flex/-flex-003.htm @@ -0,0 +1,54 @@ + + + CSS Test: Comparing two different elements using different values for the 'flex-grow' sub-property on the 'flex' shorthand + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-flex-004.htm b/test/render/flex/-flex-004.htm new file mode 100644 index 000000000..61c597959 --- /dev/null +++ b/test/render/flex/-flex-004.htm @@ -0,0 +1,54 @@ + + + CSS Test: Comparing two different elements using different values for the 'flex-shrink' sub-property on the 'flex' shorthand + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-flex-aspect-ratio-019.htm b/test/render/flex/-flex-aspect-ratio-019.htm new file mode 100644 index 000000000..e18be574a --- /dev/null +++ b/test/render/flex/-flex-aspect-ratio-019.htm @@ -0,0 +1,18 @@ + + + +CSS aspect-ratio: Row flexbox main size with flex-basis:content + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-flex-aspect-ratio-020.htm b/test/render/flex/-flex-aspect-ratio-020.htm new file mode 100644 index 000000000..71022297e --- /dev/null +++ b/test/render/flex/-flex-aspect-ratio-020.htm @@ -0,0 +1,18 @@ + + + +CSS aspect-ratio: Flex item main size with flex-basis:content in Column flex container + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-flex-aspect-ratio-021.htm b/test/render/flex/-flex-aspect-ratio-021.htm new file mode 100644 index 000000000..ba626ecd7 --- /dev/null +++ b/test/render/flex/-flex-aspect-ratio-021.htm @@ -0,0 +1,18 @@ + + + +CSS aspect-ratio: Flex item main size with flex-basis:content and width in Row flex container + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-flex-aspect-ratio-022.htm b/test/render/flex/-flex-aspect-ratio-022.htm new file mode 100644 index 000000000..aff31c8cf --- /dev/null +++ b/test/render/flex/-flex-aspect-ratio-022.htm @@ -0,0 +1,18 @@ + + + +CSS aspect-ratio: Column flexbox main size with flex-basis:content and height + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-flex-direction-row-002-visual.htm b/test/render/flex/-flex-direction-row-002-visual.htm new file mode 100644 index 000000000..83c5969f8 --- /dev/null +++ b/test/render/flex/-flex-direction-row-002-visual.htm @@ -0,0 +1,45 @@ + + + + + CSS Test: flex-direction:row axis matches that of writing mode inline axis + + + + + + + + +

Test passes if both the lines below are identical.

+
+ ABC +
+
+ CBA +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-flex-direction-row-vertical.htm b/test/render/flex/-flex-direction-row-vertical.htm new file mode 100644 index 000000000..c643f8141 --- /dev/null +++ b/test/render/flex/-flex-direction-row-vertical.htm @@ -0,0 +1,51 @@ + + + + + CSS Test: flex-direction:row has the same orientation as inline axis + + + + + + + + + +

Test passes if both the two columns below are identical.

+
+
+ ABC +
+
+ CBA +
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-flex-minimum-height-flex-items-022.htm b/test/render/flex/-flex-minimum-height-flex-items-022.htm new file mode 100644 index 000000000..b685c3054 --- /dev/null +++ b/test/render/flex/-flex-minimum-height-flex-items-022.htm @@ -0,0 +1,15 @@ + +Minimum height of a replaced element with borders + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+ +
+
+
+ \ No newline at end of file diff --git a/test/render/flex/-flex-minimum-width-flex-items-001.htm b/test/render/flex/-flex-minimum-width-flex-items-001.htm new file mode 100644 index 000000000..ed98e4c53 --- /dev/null +++ b/test/render/flex/-flex-minimum-width-flex-items-001.htm @@ -0,0 +1,44 @@ + + + + + + CSS Flexible Box Test: Minimum width of flex items + + + + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
IT E
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flex-minimum-width-flex-items-003.htm b/test/render/flex/-flex-minimum-width-flex-items-003.htm new file mode 100644 index 000000000..3bac0f066 --- /dev/null +++ b/test/render/flex/-flex-minimum-width-flex-items-003.htm @@ -0,0 +1,45 @@ + + + + + + CSS Flexible Box Test: Minimum width of flex items + + + + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
IT E
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flex-minimum-width-flex-items-009.htm b/test/render/flex/-flex-minimum-width-flex-items-009.htm new file mode 100644 index 000000000..4f2848ac3 --- /dev/null +++ b/test/render/flex/-flex-minimum-width-flex-items-009.htm @@ -0,0 +1,32 @@ + +CSS Flexible Box Test: Minimum width of flex items + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+ +
+ \ No newline at end of file diff --git a/test/render/flex/-flexbox-abspos-child-001b.htm b/test/render/flex/-flexbox-abspos-child-001b.htm new file mode 100644 index 000000000..80998abb6 --- /dev/null +++ b/test/render/flex/-flexbox-abspos-child-001b.htm @@ -0,0 +1,54 @@ + + + CSS Test: Testing that "min-width", "max-width", "min-height", and "max-height" are applied on absolutely positioned children of a vertical flex container + + + + + + + +
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-abspos-child-002.htm b/test/render/flex/-flexbox-abspos-child-002.htm new file mode 100644 index 000000000..43e833c59 --- /dev/null +++ b/test/render/flex/-flexbox-abspos-child-002.htm @@ -0,0 +1,61 @@ + + + + + CSS Test: Test that "flex-basis" doesn't affect layout of abspos flex child + + + + + + + + + + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-align-self-baseline-horiz-006.htm b/test/render/flex/-flexbox-align-self-baseline-horiz-006.htm new file mode 100644 index 000000000..464752f45 --- /dev/null +++ b/test/render/flex/-flexbox-align-self-baseline-horiz-006.htm @@ -0,0 +1,56 @@ + + + + + + CSS Test: Baseline alignment of block flex items with 'baseline' value for 'align-items' / 'align-self' against non-parallel writing-modes. + + + + + + +
+
ortho
+
one line
+
two
lines
+
offset
+
+
+
ortho
+
one line
+
two
lines
+
offset
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-align-self-baseline-horiz-008.htm b/test/render/flex/-flexbox-align-self-baseline-horiz-008.htm new file mode 100644 index 000000000..0dc1cb1fe --- /dev/null +++ b/test/render/flex/-flexbox-align-self-baseline-horiz-008.htm @@ -0,0 +1,57 @@ + + + + + + CSS Test: Baseline alignment of block flex items with 'baseline' and 'last-baseline' values for 'align-self' against each other. + + + + + + +
+
one line (first)
+
one line (last)
+
two
lines and offset (last)
+
offset (first)
+
+
+
one line (first)
+
one line (last)
+
two
lines and offset (last)
+
offset (first)
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-align-self-horiz-002.htm b/test/render/flex/-flexbox-align-self-horiz-002.htm new file mode 100644 index 000000000..647659d08 --- /dev/null +++ b/test/render/flex/-flexbox-align-self-horiz-002.htm @@ -0,0 +1,100 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' with a horizontal flex container, with margin/padding/border on the items + + + + + + +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
+
+
+
base
+
abc
+
stretch
+
a b c d e f
+
+
+
+
self-start
+
a b c d e f
+
self-end
+
a b c d e f
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-align-self-vert-002.htm b/test/render/flex/-flexbox-align-self-vert-002.htm new file mode 100644 index 000000000..658b01b27 --- /dev/null +++ b/test/render/flex/-flexbox-align-self-vert-002.htm @@ -0,0 +1,96 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' with a vertical flex container, with margin/padding/border on the items + + + + + + +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
+
+
base
+
abc
+
stretch
+
a b c d e f
+
+
+
self-start
+
a b c d e f
+
self-end
+
a b c d e f
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-align-self-vert-rtl-001.htm b/test/render/flex/-flexbox-align-self-vert-rtl-001.htm new file mode 100644 index 000000000..25bbe1970 --- /dev/null +++ b/test/render/flex/-flexbox-align-self-vert-rtl-001.htm @@ -0,0 +1,97 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' property values on flex items that are blocks, in a vertical flex container with 'direction: rtl' + + + + + + +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
base
+
abc
+
stretch
+
a b c d e f
+
auto
+
unspec
+
initial
+
inherit
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-align-self-vert-rtl-002.htm b/test/render/flex/-flexbox-align-self-vert-rtl-002.htm new file mode 100644 index 000000000..03ca3ef9f --- /dev/null +++ b/test/render/flex/-flexbox-align-self-vert-rtl-002.htm @@ -0,0 +1,82 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' with a vertical flex container, with margin/padding/border on the items and with 'direction: rtl' + + + + + + +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
+
+
base
+
abc
+
stretch
+
a b c d e f
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-align-self-vert-rtl-003.htm b/test/render/flex/-flexbox-align-self-vert-rtl-003.htm new file mode 100644 index 000000000..69eea46e7 --- /dev/null +++ b/test/render/flex/-flexbox-align-self-vert-rtl-003.htm @@ -0,0 +1,72 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' with a vertical flex container that's skinnier than its items and with 'direction: rtl' + + + + + + +
+
start
+
a b
+
end
+
a b
+
center
+
a b
+
base
+
abc
+
stretch
+
a b
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-align-self-vert-rtl-004.htm b/test/render/flex/-flexbox-align-self-vert-rtl-004.htm new file mode 100644 index 000000000..b8c9566c5 --- /dev/null +++ b/test/render/flex/-flexbox-align-self-vert-rtl-004.htm @@ -0,0 +1,90 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' with a vertical flex container that's skinnier than its items, with margin/padding/border on the items and with 'direction: rtl' + + + + + + + +
+
start
+
a b
+
stretch
+
a b
+
center
+
a b
+
+
+
base
+
abc
+
end
+
a b
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-align-self-vert-rtl-005.htm b/test/render/flex/-flexbox-align-self-vert-rtl-005.htm new file mode 100644 index 000000000..9d7600e9b --- /dev/null +++ b/test/render/flex/-flexbox-align-self-vert-rtl-005.htm @@ -0,0 +1,94 @@ + + + + + + CSS Test: Testing the behavior of 'align-self' with a vertical flex container, with margin/padding/border on the items and with 'direction:rtl' + + + + + + +
+
start
+
a b c d e f
+
end
+
a b c d e f
+
center
+
a b c d e f
+
+
+
base
+
abc
+
stretch
+
a b c d e f
+
+
+
self-start
+
a b c d e f
+
self-end
+
a b c d e f
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-anonymous-items-001.htm b/test/render/flex/-flexbox-anonymous-items-001.htm new file mode 100644 index 000000000..b48a4553a --- /dev/null +++ b/test/render/flex/-flexbox-anonymous-items-001.htm @@ -0,0 +1,25 @@ + + + CSS Test: Testing that we gracefully handle cases where two anonymous flex items become adjacent due to "order" reordering + + + + + + + +
+ a a +
x x
+ b b +
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-basic-block-horiz-001v.htm b/test/render/flex/-flexbox-basic-block-horiz-001v.htm new file mode 100644 index 000000000..09e29057c --- /dev/null +++ b/test/render/flex/-flexbox-basic-block-horiz-001v.htm @@ -0,0 +1,75 @@ + + + + + + + CSS Test: Testing flexbox layout algorithm property on block flex items in a horizontal flex container + (with various writing-modes on the flex items). + + + + + + + +
+
+
+
+
+
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-basic-block-vert-001v.htm b/test/render/flex/-flexbox-basic-block-vert-001v.htm new file mode 100644 index 000000000..bd3318a73 --- /dev/null +++ b/test/render/flex/-flexbox-basic-block-vert-001v.htm @@ -0,0 +1,77 @@ + + + + + + + CSS Test: Testing flexbox layout algorithm property on block flex items in a vertical flex container + (with various writing-modes on the flex items). + + + + + + + +
+
+
+
+
+
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-flex-basis-content-004b.htm b/test/render/flex/-flexbox-flex-basis-content-004b.htm new file mode 100644 index 000000000..38b352941 --- /dev/null +++ b/test/render/flex/-flexbox-flex-basis-content-004b.htm @@ -0,0 +1,131 @@ + + + + + + CSS Test: Testing that used "flex-basis: content" is treated as + "max-content" when calculating flex base size + + + + + + + + + + + +
+
+
+ + +
+
+ + + +
+
+ + +
+
+ +
+
+ + +
+ +
+ + +
+
+ + + +
+
+ + +
+
+ + + +
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-flex-wrap-default.htm b/test/render/flex/-flexbox-flex-wrap-default.htm new file mode 100644 index 000000000..170481d09 --- /dev/null +++ b/test/render/flex/-flexbox-flex-wrap-default.htm @@ -0,0 +1,39 @@ + + + CSS Flexbox Test: Flex-wrap defaults to nowrap + + + + + + + + + +

The test passes if there is a green square and no red.

+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-flex-wrap-vert-001.htm b/test/render/flex/-flexbox-flex-wrap-vert-001.htm new file mode 100644 index 000000000..15a76cc73 --- /dev/null +++ b/test/render/flex/-flexbox-flex-wrap-vert-001.htm @@ -0,0 +1,98 @@ + + + CSS Test: Testing flex-wrap in vertical flex containers + + + + + + + + + +
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-flex-wrap-vert-002.htm b/test/render/flex/-flexbox-flex-wrap-vert-002.htm new file mode 100644 index 000000000..fcdcba043 --- /dev/null +++ b/test/render/flex/-flexbox-flex-wrap-vert-002.htm @@ -0,0 +1,60 @@ + + + CSS Test: Ensure that min-height is honored for vertical multi-line flex containers + + + + + + + + + +
+
+ + +
+
+
+ + +
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-flex-wrap-wrap-reverse.htm b/test/render/flex/-flexbox-flex-wrap-wrap-reverse.htm new file mode 100644 index 000000000..2fa0c0719 --- /dev/null +++ b/test/render/flex/-flexbox-flex-wrap-wrap-reverse.htm @@ -0,0 +1,60 @@ + + + + + CSS Flexbox Test: Flex-wrap = wrap-reverse + + + + + + + + + +

The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.

+
+
7
8
9
+
4
5
6
+
1
2
3
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-justify-content-wmvert-001.htm b/test/render/flex/-flexbox-justify-content-wmvert-001.htm new file mode 100644 index 000000000..85486134d --- /dev/null +++ b/test/render/flex/-flexbox-justify-content-wmvert-001.htm @@ -0,0 +1,144 @@ + + + + + + CSS Test: Testing 'justify-content' in a vertical writing mode flex container + + + + + + + + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-mbp-horiz-001-rtl-reverse.htm b/test/render/flex/-flexbox-mbp-horiz-001-rtl-reverse.htm new file mode 100644 index 000000000..70f6d61eb --- /dev/null +++ b/test/render/flex/-flexbox-mbp-horiz-001-rtl-reverse.htm @@ -0,0 +1,75 @@ + + + + + + CSS Test: Testing borders on flex items in a row-reverse horizontal flex container, with 'direction: rtl' + + + + + + +
+
+
+
+
+
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-mbp-horiz-001-rtl.htm b/test/render/flex/-flexbox-mbp-horiz-001-rtl.htm new file mode 100644 index 000000000..dbee82b29 --- /dev/null +++ b/test/render/flex/-flexbox-mbp-horiz-001-rtl.htm @@ -0,0 +1,73 @@ + + + + + + CSS Test: Testing borders on flex items in a horizontal flex container with 'direction: rtl' + + + + + + +
+
+
+
+
+
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-mbp-horiz-002v.htm b/test/render/flex/-flexbox-mbp-horiz-002v.htm new file mode 100644 index 000000000..5e30e0e2e --- /dev/null +++ b/test/render/flex/-flexbox-mbp-horiz-002v.htm @@ -0,0 +1,87 @@ + + + + + + + CSS Test: Testing margins, borders, and padding on flex items in a horizontal flex container + (with a vertical writing-mode on the flex items). + + + + + + + +
+
+
+
+
+
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-mbp-horiz-003v.htm b/test/render/flex/-flexbox-mbp-horiz-003v.htm new file mode 100644 index 000000000..48eeab28e --- /dev/null +++ b/test/render/flex/-flexbox-mbp-horiz-003v.htm @@ -0,0 +1,81 @@ + + + + + + + CSS Test: Testing borders and padding on a horizontal flex container and its flex items + (with a vertical writing-mode on the flex items). + + + + + + + +
+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-min-width-auto-002a.htm b/test/render/flex/-flexbox-min-width-auto-002a.htm new file mode 100644 index 000000000..0a23667de --- /dev/null +++ b/test/render/flex/-flexbox-min-width-auto-002a.htm @@ -0,0 +1,66 @@ + + + + CSS Test: Testing min-width:auto + + + + + + + + + + + +
+ blue square +
+ +
+ blue square +
+ +
+ blue square +
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-min-width-auto-002b.htm b/test/render/flex/-flexbox-min-width-auto-002b.htm new file mode 100644 index 000000000..e62227047 --- /dev/null +++ b/test/render/flex/-flexbox-min-width-auto-002b.htm @@ -0,0 +1,66 @@ + + + + CSS Test: Testing min-width:auto + + + + + + + + + + + +
+ blue square +
+ +
+ blue square +
+ +
+ blue square +
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-min-width-auto-002c.htm b/test/render/flex/-flexbox-min-width-auto-002c.htm new file mode 100644 index 000000000..1f19a017c --- /dev/null +++ b/test/render/flex/-flexbox-min-width-auto-002c.htm @@ -0,0 +1,68 @@ + + + + CSS Test: Testing min-width:auto + + + + + + + + + + + +
+ blue square +
+ +
+ blue square +
+ +
+ blue square +
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-min-width-auto-005.htm b/test/render/flex/-flexbox-min-width-auto-005.htm new file mode 100644 index 000000000..f4321ab99 --- /dev/null +++ b/test/render/flex/-flexbox-min-width-auto-005.htm @@ -0,0 +1,38 @@ + +CSS Flexible Box Test: Aspect ratio handling of images + + + + + + + +

Test passes if there is no red visible on the page.

+ +
+
+ +
+ +
+ +
+
+
+ +
+
+ \ No newline at end of file diff --git a/test/render/flex/-flexbox-min-width-auto-006.htm b/test/render/flex/-flexbox-min-width-auto-006.htm new file mode 100644 index 000000000..662543787 --- /dev/null +++ b/test/render/flex/-flexbox-min-width-auto-006.htm @@ -0,0 +1,45 @@ + +CSS Flexible Box Test: Aspect ratio handling of images + + + + + + + +

Test passes if there are a (vertically centered) 20x20 and a 60x100 green boxes enclosed on each 100x100 square.

+ +
+
+ +
+
+ +
+ +
+
+ +
+
\ No newline at end of file diff --git a/test/render/flex/-flexbox-overflow-horiz-001.htm.htm b/test/render/flex/-flexbox-overflow-horiz-001.htm.htm new file mode 100644 index 000000000..291b337bb --- /dev/null +++ b/test/render/flex/-flexbox-overflow-horiz-001.htm.htm @@ -0,0 +1,54 @@ + + + CSS Test: Testing 'overflow' property on a horizontal flex container, with contents not overflowing + + + + + + +
+
+
+
+ +
+
+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-whitespace-handling-001a.htm b/test/render/flex/-flexbox-whitespace-handling-001a.htm new file mode 100644 index 000000000..f70b68dd9 --- /dev/null +++ b/test/render/flex/-flexbox-whitespace-handling-001a.htm @@ -0,0 +1,54 @@ + + + + CSS Test: Test that anonymous flex items aren't created for pure-whitespace inline content + + + + + + + +
+ + +
+ + +
+
+ + \ No newline at end of file diff --git a/test/render/flex/-flexbox-whitespace-handling-001b.htm b/test/render/flex/-flexbox-whitespace-handling-001b.htm new file mode 100644 index 000000000..59adb90b5 --- /dev/null +++ b/test/render/flex/-flexbox-whitespace-handling-001b.htm @@ -0,0 +1,42 @@ + + + + CSS Test: Test that flex items are created correctly + + + + + + +
+ +
+ +
+ + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-001.htm b/test/render/flex/-flexbox-writing-mode-001.htm new file mode 100644 index 000000000..466b0b7f6 --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-001.htm @@ -0,0 +1,81 @@ + + + + + CSS Test: Try various flex-flow values, with 'direction: ltr' and 'writing-mode: horizontal-tb' + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-002.htm b/test/render/flex/-flexbox-writing-mode-002.htm new file mode 100644 index 000000000..34b11ec0a --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-002.htm @@ -0,0 +1,81 @@ + + + + + CSS Test: Try various flex-flow values, with 'direction: ltr' and 'writing-mode: vertical-rl' + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-003.htm b/test/render/flex/-flexbox-writing-mode-003.htm new file mode 100644 index 000000000..af3f20adc --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-003.htm @@ -0,0 +1,81 @@ + + + + + CSS Test: Try various flex-flow values, with 'direction: ltr' and 'writing-mode: vertical-lr' + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-004.htm b/test/render/flex/-flexbox-writing-mode-004.htm new file mode 100644 index 000000000..7332a2a61 --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-004.htm @@ -0,0 +1,81 @@ + + + + + CSS Test: Try various flex-flow values, with 'direction: rtl' and 'writing-mode: horizontal-tb' + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-005.htm b/test/render/flex/-flexbox-writing-mode-005.htm new file mode 100644 index 000000000..65ee1e3ec --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-005.htm @@ -0,0 +1,81 @@ + + + + + CSS Test: Try various flex-flow values, with 'direction: rtl' and 'writing-mode: vertical-rl' + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-006.htm b/test/render/flex/-flexbox-writing-mode-006.htm new file mode 100644 index 000000000..0389a1530 --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-006.htm @@ -0,0 +1,81 @@ + + + + + CSS Test: Try various flex-flow values, with 'direction: rtl' and 'writing-mode: vertical-lr' + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-007.htm b/test/render/flex/-flexbox-writing-mode-007.htm new file mode 100644 index 000000000..11e44f206 --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-007.htm @@ -0,0 +1,78 @@ + + + + + CSS Test: Verify that explicit sizes are honored on flex items whose writing-mode may differ from the flex container's writing-mode + + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-008.htm b/test/render/flex/-flexbox-writing-mode-008.htm new file mode 100644 index 000000000..f32db5b0a --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-008.htm @@ -0,0 +1,78 @@ + + + + + CSS Test: Verify that explicit sizes are honored on flex items whose writing-mode may differ from the flex container's writing-mode + + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-009.htm b/test/render/flex/-flexbox-writing-mode-009.htm new file mode 100644 index 000000000..6145779d0 --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-009.htm @@ -0,0 +1,78 @@ + + + + + CSS Test: Verify that explicit sizes are honored on flex items whose writing-mode may differ from the flex container's writing-mode + + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-010.htm b/test/render/flex/-flexbox-writing-mode-010.htm new file mode 100644 index 000000000..ca1f38d54 --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-010.htm @@ -0,0 +1,87 @@ + + + + + + CSS Test: Testing a mix of flex items with various values for + 'writing-mode' / 'direction' in a horizontal row-oriented flex container. + + + + + + + + + + + +
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-011.htm b/test/render/flex/-flexbox-writing-mode-011.htm new file mode 100644 index 000000000..971f54a25 --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-011.htm @@ -0,0 +1,88 @@ + + + + + + CSS Test: Testing a mix of flex items with various values for + 'writing-mode' / 'direction' in a vertical row-oriented flex container. + + + + + + + + + + + +
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-012.htm b/test/render/flex/-flexbox-writing-mode-012.htm new file mode 100644 index 000000000..048784758 --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-012.htm @@ -0,0 +1,89 @@ + + + + + + CSS Test: Testing a mix of flex items with various values for + 'writing-mode' / 'direction' in a vertical row-oriented flex container + with 'direction' flipped. + + + + + + + + + + + +
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-013.htm b/test/render/flex/-flexbox-writing-mode-013.htm new file mode 100644 index 000000000..b3b7f99d6 --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-013.htm @@ -0,0 +1,88 @@ + + + + + + CSS Test: Testing a mix of flex items with various values for + 'writing-mode' / 'direction' in a horizontal column-oriented flex container. + + + + + + + + + + + +
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-014.htm b/test/render/flex/-flexbox-writing-mode-014.htm new file mode 100644 index 000000000..3a8755bff --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-014.htm @@ -0,0 +1,87 @@ + + + + + + CSS Test: Testing a mix of flex items with various values for + 'writing-mode' / 'direction' in a vertical column-oriented flex container. + + + + + + + + + + + +
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-015.htm b/test/render/flex/-flexbox-writing-mode-015.htm new file mode 100644 index 000000000..a01975a70 --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-015.htm @@ -0,0 +1,88 @@ + + + + + + CSS Test: Testing a mix of flex items with various values for + 'writing-mode' / 'direction' in a vertical column-oriented flex container + with 'direction' flipped. + + + + + + + + + + + +
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+
+ p b c + p e + p b c + p e + p b c + p e +
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox-writing-mode-016.htm b/test/render/flex/-flexbox-writing-mode-016.htm new file mode 100644 index 000000000..afbcb55dd --- /dev/null +++ b/test/render/flex/-flexbox-writing-mode-016.htm @@ -0,0 +1,147 @@ + + + + + + CSS Test: Testing auto-sized flex containers + with various 'writing-mode' values + and various padding amounts on flex items. + + + + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox_align-items-stretch-writing-modes.htm b/test/render/flex/-flexbox_align-items-stretch-writing-modes.htm new file mode 100644 index 000000000..dd019adb8 --- /dev/null +++ b/test/render/flex/-flexbox_align-items-stretch-writing-modes.htm @@ -0,0 +1,62 @@ + + + + + CSS Test: Flexbox align-items: stretch with writing-mode vertical-lr and vertical-rl + + + + + + + + + +

The test passes if you see a green rectangle and no red.

+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-flexbox_columns-flexitems-2.htm b/test/render/flex/-flexbox_columns-flexitems-2.htm new file mode 100644 index 000000000..101188a77 --- /dev/null +++ b/test/render/flex/-flexbox_columns-flexitems-2.htm @@ -0,0 +1,32 @@ + +flexbox | multicol on flexbox items + + + + + + + +
+

+ one two three four five + one two three four five + one two three four five +

+
+ \ No newline at end of file diff --git a/test/render/flex/-flexbox_columns-flexitems.htm b/test/render/flex/-flexbox_columns-flexitems.htm new file mode 100644 index 000000000..22665e289 --- /dev/null +++ b/test/render/flex/-flexbox_columns-flexitems.htm @@ -0,0 +1,30 @@ + + + +flexbox | multicol on flexbox items + + + + + +
+

one two three four five

+
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox_rtl-direction.htm b/test/render/flex/-flexbox_rtl-direction.htm new file mode 100644 index 000000000..91c501aaf --- /dev/null +++ b/test/render/flex/-flexbox_rtl-direction.htm @@ -0,0 +1,38 @@ + + + +flexbox | flex-direction: column-reverse | rtl + + + + + + +
+ filler + filler + filler + filler +
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox_rtl-flow-reverse.htm b/test/render/flex/-flexbox_rtl-flow-reverse.htm new file mode 100644 index 000000000..67828d5e1 --- /dev/null +++ b/test/render/flex/-flexbox_rtl-flow-reverse.htm @@ -0,0 +1,38 @@ + + + +flexbox | flex-flow: column wrap-reverse | rtl + + + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox_rtl-flow.htm b/test/render/flex/-flexbox_rtl-flow.htm new file mode 100644 index 000000000..d4d122e2c --- /dev/null +++ b/test/render/flex/-flexbox_rtl-flow.htm @@ -0,0 +1,38 @@ + + + +flexbox | flex-flow: column wrap | rtl + + + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox_rtl-order.htm b/test/render/flex/-flexbox_rtl-order.htm new file mode 100644 index 000000000..c4581db25 --- /dev/null +++ b/test/render/flex/-flexbox_rtl-order.htm @@ -0,0 +1,57 @@ + + + +flexbox | flex-flow: column-reverse wrap-reverse; order | rtl + + + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/-flexbox_writing_mode_vertical_lays_out_contents_from_top_to_bottom.htm b/test/render/flex/-flexbox_writing_mode_vertical_lays_out_contents_from_top_to_bottom.htm new file mode 100644 index 000000000..1b1fc849f --- /dev/null +++ b/test/render/flex/-flexbox_writing_mode_vertical_lays_out_contents_from_top_to_bottom.htm @@ -0,0 +1,64 @@ + + + + + + CSS Flexbox Test: Align content flex-start with writing mode vertical-rl. + + + + + + + +

The test passes if you see green and red top, blue and yellow bottom.

+ +
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-justify-content-001.htm b/test/render/flex/-justify-content-001.htm new file mode 100644 index 000000000..1115dc76e --- /dev/null +++ b/test/render/flex/-justify-content-001.htm @@ -0,0 +1,41 @@ + + + + + CSS Test: A flex container with 'justify-content' property set to 'center' + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-justify-content-002.htm b/test/render/flex/-justify-content-002.htm new file mode 100644 index 000000000..d6ff8aec4 --- /dev/null +++ b/test/render/flex/-justify-content-002.htm @@ -0,0 +1,38 @@ + + + + + CSS Test: A flex container with the 'justify-content' property set to 'flex-start' + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-justify-content-003.htm b/test/render/flex/-justify-content-003.htm new file mode 100644 index 000000000..b1a83a9e8 --- /dev/null +++ b/test/render/flex/-justify-content-003.htm @@ -0,0 +1,37 @@ + + + + + CSS Test: A flex container with the 'justify-content' property set to 'flex-end' + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-justify-content-004.htm b/test/render/flex/-justify-content-004.htm new file mode 100644 index 000000000..fcab4fbea --- /dev/null +++ b/test/render/flex/-justify-content-004.htm @@ -0,0 +1,41 @@ + + + + + CSS Test: A flex container with the 'justify-content' property set to 'space-between' + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-justify-content-005.htm b/test/render/flex/-justify-content-005.htm new file mode 100644 index 000000000..f9748dfb1 --- /dev/null +++ b/test/render/flex/-justify-content-005.htm @@ -0,0 +1,41 @@ + + + + + CSS Test: A flex container with the 'justify-content' property set to 'space-around' + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/-nested-orthogonal-flexbox-relayout.htm b/test/render/flex/-nested-orthogonal-flexbox-relayout.htm new file mode 100644 index 000000000..fb5f085ac --- /dev/null +++ b/test/render/flex/-nested-orthogonal-flexbox-relayout.htm @@ -0,0 +1,34 @@ + +CSS Flexbox: nested orthogonal children on relayout. + + + + + +
+
+
This text should not overflow its box
+
+
+ + \ No newline at end of file diff --git a/test/render/flex/-percentage-size-subitems-001.htm b/test/render/flex/-percentage-size-subitems-001.htm new file mode 100644 index 000000000..3d610b9b1 --- /dev/null +++ b/test/render/flex/-percentage-size-subitems-001.htm @@ -0,0 +1,98 @@ + + + + +CSS Flexbox Test: Percentage size on child of a flex item with margin, border, padding and scrollbar + + + + + + +

The test passes if in the different examples you see scrollbars but there's no overflow, so you cannot actually scroll.

+ +
+
+
+
+
+ +
+
+
+
+
+ +
+
+
+
+
+ +
+
+
+
+
+ +
+
+
+
+
+ +
+
+
+
+
+ +
+
+
+
+
+ +
+
+
+
+
+ +
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/-table-as-item-stretch-cross-size-5.htm b/test/render/flex/-table-as-item-stretch-cross-size-5.htm new file mode 100644 index 000000000..e153a3328 --- /dev/null +++ b/test/render/flex/-table-as-item-stretch-cross-size-5.htm @@ -0,0 +1,43 @@ + + + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+ + +
+
+
+
+
+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/abspos-autopos-htb-ltr.htm b/test/render/flex/abspos-autopos-htb-ltr.htm new file mode 100644 index 000000000..bdfbe2cf0 --- /dev/null +++ b/test/render/flex/abspos-autopos-htb-ltr.htm @@ -0,0 +1,39 @@ + + + +Absolutely positioned child with auto position in vertical-rl ltr flexbox + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/abspos-autopos-htb-ltr.htm.png b/test/render/flex/abspos-autopos-htb-ltr.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..21d20656fa6af26397cfb4bc1e73585347999744 GIT binary patch literal 583 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKS2HmK$;XWXwLpq9z$e7@|Ns9$CPM>*>m@@m z1_s8To-U3d6^w7EX7@c-5MVpWf1lyqWMu=Pm?Hn3e>WsotNp%^F}EfvG;))Nd4)#C zR}qkIp#EOVzk6#s@4wsr@MB$vjoah0_%|C9|2~#qvH#~+{gZEPg+JaXo_N&s{m1Bd zm1Osc#clyhzM3t2TV5uAGdchE8{1^LzZ+(_+q_$RbNY^nb8fahpMCaAq4eH7ZJTGt zf25bztcl;}v*fy5`km~J6K%iQO$mEjT6HdcUHY!6)1KGNeSW>L=hUu6ITtIQubJL) zBhyY)l6~Tiwf;(vCwoZmJd~dEHC17gH9qe|-^p`quQABb&bE#Gd{f7xJ_BMa)JetB5HPB1_LpP49g3 z<-K0b)p{W&-#=1+Y5Vcdec_#b OATdu@KbLh*2~7YJZu&d` literal 0 HcmV?d00001 diff --git a/test/render/flex/abspos-autopos-htb-rtl.htm b/test/render/flex/abspos-autopos-htb-rtl.htm new file mode 100644 index 000000000..f3a5af1ce --- /dev/null +++ b/test/render/flex/abspos-autopos-htb-rtl.htm @@ -0,0 +1,39 @@ + + + +Absolutely positioned child with auto position in vertical-rl ltr flexbox + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/abspos-autopos-htb-rtl.htm.png b/test/render/flex/abspos-autopos-htb-rtl.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..21d20656fa6af26397cfb4bc1e73585347999744 GIT binary patch literal 583 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKS2HmK$;XWXwLpq9z$e7@|Ns9$CPM>*>m@@m z1_s8To-U3d6^w7EX7@c-5MVpWf1lyqWMu=Pm?Hn3e>WsotNp%^F}EfvG;))Nd4)#C zR}qkIp#EOVzk6#s@4wsr@MB$vjoah0_%|C9|2~#qvH#~+{gZEPg+JaXo_N&s{m1Bd zm1Osc#clyhzM3t2TV5uAGdchE8{1^LzZ+(_+q_$RbNY^nb8fahpMCaAq4eH7ZJTGt zf25bztcl;}v*fy5`km~J6K%iQO$mEjT6HdcUHY!6)1KGNeSW>L=hUu6ITtIQubJL) zBhyY)l6~Tiwf;(vCwoZmJd~dEHC17gH9qe|-^p`quQABb&bE#Gd{f7xJ_BMa)JetB5HPB1_LpP49g3 z<-K0b)p{W&-#=1+Y5Vcdec_#b OATdu@KbLh*2~7YJZu&d` literal 0 HcmV?d00001 diff --git a/test/render/flex/abspos-autopos-vlr-ltr.htm b/test/render/flex/abspos-autopos-vlr-ltr.htm new file mode 100644 index 000000000..bcb71d975 --- /dev/null +++ b/test/render/flex/abspos-autopos-vlr-ltr.htm @@ -0,0 +1,39 @@ + + + +Absolutely positioned child with auto position in vertical-rl ltr flexbox + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/abspos-autopos-vlr-ltr.htm.png b/test/render/flex/abspos-autopos-vlr-ltr.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..21d20656fa6af26397cfb4bc1e73585347999744 GIT binary patch literal 583 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKS2HmK$;XWXwLpq9z$e7@|Ns9$CPM>*>m@@m z1_s8To-U3d6^w7EX7@c-5MVpWf1lyqWMu=Pm?Hn3e>WsotNp%^F}EfvG;))Nd4)#C zR}qkIp#EOVzk6#s@4wsr@MB$vjoah0_%|C9|2~#qvH#~+{gZEPg+JaXo_N&s{m1Bd zm1Osc#clyhzM3t2TV5uAGdchE8{1^LzZ+(_+q_$RbNY^nb8fahpMCaAq4eH7ZJTGt zf25bztcl;}v*fy5`km~J6K%iQO$mEjT6HdcUHY!6)1KGNeSW>L=hUu6ITtIQubJL) zBhyY)l6~Tiwf;(vCwoZmJd~dEHC17gH9qe|-^p`quQABb&bE#Gd{f7xJ_BMa)JetB5HPB1_LpP49g3 z<-K0b)p{W&-#=1+Y5Vcdec_#b OATdu@KbLh*2~7YJZu&d` literal 0 HcmV?d00001 diff --git a/test/render/flex/abspos-autopos-vlr-rtl.htm b/test/render/flex/abspos-autopos-vlr-rtl.htm new file mode 100644 index 000000000..b369dad94 --- /dev/null +++ b/test/render/flex/abspos-autopos-vlr-rtl.htm @@ -0,0 +1,39 @@ + + + +Absolutely positioned child with auto position in vertical-rl ltr flexbox + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/abspos-autopos-vlr-rtl.htm.png b/test/render/flex/abspos-autopos-vlr-rtl.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..21d20656fa6af26397cfb4bc1e73585347999744 GIT binary patch literal 583 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKS2HmK$;XWXwLpq9z$e7@|Ns9$CPM>*>m@@m z1_s8To-U3d6^w7EX7@c-5MVpWf1lyqWMu=Pm?Hn3e>WsotNp%^F}EfvG;))Nd4)#C zR}qkIp#EOVzk6#s@4wsr@MB$vjoah0_%|C9|2~#qvH#~+{gZEPg+JaXo_N&s{m1Bd zm1Osc#clyhzM3t2TV5uAGdchE8{1^LzZ+(_+q_$RbNY^nb8fahpMCaAq4eH7ZJTGt zf25bztcl;}v*fy5`km~J6K%iQO$mEjT6HdcUHY!6)1KGNeSW>L=hUu6ITtIQubJL) zBhyY)l6~Tiwf;(vCwoZmJd~dEHC17gH9qe|-^p`quQABb&bE#Gd{f7xJ_BMa)JetB5HPB1_LpP49g3 z<-K0b)p{W&-#=1+Y5Vcdec_#b OATdu@KbLh*2~7YJZu&d` literal 0 HcmV?d00001 diff --git a/test/render/flex/abspos-autopos-vrl-ltr.htm b/test/render/flex/abspos-autopos-vrl-ltr.htm new file mode 100644 index 000000000..8987cea54 --- /dev/null +++ b/test/render/flex/abspos-autopos-vrl-ltr.htm @@ -0,0 +1,39 @@ + + + +Absolutely positioned child with auto position in vertical-rl ltr flexbox + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/abspos-autopos-vrl-ltr.htm.png b/test/render/flex/abspos-autopos-vrl-ltr.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..21d20656fa6af26397cfb4bc1e73585347999744 GIT binary patch literal 583 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKS2HmK$;XWXwLpq9z$e7@|Ns9$CPM>*>m@@m z1_s8To-U3d6^w7EX7@c-5MVpWf1lyqWMu=Pm?Hn3e>WsotNp%^F}EfvG;))Nd4)#C zR}qkIp#EOVzk6#s@4wsr@MB$vjoah0_%|C9|2~#qvH#~+{gZEPg+JaXo_N&s{m1Bd zm1Osc#clyhzM3t2TV5uAGdchE8{1^LzZ+(_+q_$RbNY^nb8fahpMCaAq4eH7ZJTGt zf25bztcl;}v*fy5`km~J6K%iQO$mEjT6HdcUHY!6)1KGNeSW>L=hUu6ITtIQubJL) zBhyY)l6~Tiwf;(vCwoZmJd~dEHC17gH9qe|-^p`quQABb&bE#Gd{f7xJ_BMa)JetB5HPB1_LpP49g3 z<-K0b)p{W&-#=1+Y5Vcdec_#b OATdu@KbLh*2~7YJZu&d` literal 0 HcmV?d00001 diff --git a/test/render/flex/abspos-autopos-vrl-rtl.htm b/test/render/flex/abspos-autopos-vrl-rtl.htm new file mode 100644 index 000000000..cb46539dd --- /dev/null +++ b/test/render/flex/abspos-autopos-vrl-rtl.htm @@ -0,0 +1,39 @@ + + + +Absolutely positioned child with auto position in vertical-rl ltr flexbox + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/abspos-autopos-vrl-rtl.htm.png b/test/render/flex/abspos-autopos-vrl-rtl.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..21d20656fa6af26397cfb4bc1e73585347999744 GIT binary patch literal 583 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKS2HmK$;XWXwLpq9z$e7@|Ns9$CPM>*>m@@m z1_s8To-U3d6^w7EX7@c-5MVpWf1lyqWMu=Pm?Hn3e>WsotNp%^F}EfvG;))Nd4)#C zR}qkIp#EOVzk6#s@4wsr@MB$vjoah0_%|C9|2~#qvH#~+{gZEPg+JaXo_N&s{m1Bd zm1Osc#clyhzM3t2TV5uAGdchE8{1^LzZ+(_+q_$RbNY^nb8fahpMCaAq4eH7ZJTGt zf25bztcl;}v*fy5`km~J6K%iQO$mEjT6HdcUHY!6)1KGNeSW>L=hUu6ITtIQubJL) zBhyY)l6~Tiwf;(vCwoZmJd~dEHC17gH9qe|-^p`quQABb&bE#Gd{f7xJ_BMa)JetB5HPB1_LpP49g3 z<-K0b)p{W&-#=1+Y5Vcdec_#b OATdu@KbLh*2~7YJZu&d` literal 0 HcmV?d00001 diff --git a/test/render/flex/align-content-006.htm b/test/render/flex/align-content-006.htm new file mode 100644 index 000000000..81e279664 --- /dev/null +++ b/test/render/flex/align-content-006.htm @@ -0,0 +1,40 @@ + + + + + CSS Test: A multi-line flex container with the 'align-content' property set to 'stretch' + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/align-content-006.htm.png b/test/render/flex/align-content-006.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b5d9e99107844d149e504cf70cdb7a0f59ec648c GIT binary patch literal 516 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*GqL_5I9y?^MS2GzJJ5aM(=M^?)Fd3nCx>bGx%8h|LK`ctA*+q zGnHBdoH!JLL{-++-+w~pUt75%ul>|v)t%wXuU@LLsNRzukyNo>;q&1M_neolc3SkU z%%d_tj%m}4pjGw7rd$6!eQ!6zG;7tpJwAwSrs{X+ zyuH4C&Yq|G_4Ybzb9TOpiFVlK^>$ZnRA1^aJ{fF-!JR|02^gw;CJSNw+>-O0Jn9cs3}9 z`}=*HG(82)eB()VXHJxftUc}g>?_Zc%*X%M$DaN^=SIKR8}nP0X~HR=Shvhrx-EO_ zu0Gb6)w5T96yF_IJ?mEN#l>Z76(`uvk7rtY+_2wj!ev{&U*#U)VBt`Fa{lM9m<9$$ pCKe6>1qZ4!P8 + + + + CSS Flexible Box Test: align-content_center + + + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle and no gap between them.
+ 2. the rectangle 1, 2, 3 appear in middle left of red rectangle.

+
1
2
3
+ + + + + diff --git a/test/render/flex/align-content_center.htm.png b/test/render/flex/align-content_center.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e278bf455a20b38c99bff62ba8a4e35158e23a92 GIT binary patch literal 1828 zcmb_dc~H`M6vvG<#WXxJJ4`6A*2>jNGfNZHAQg$SG(!x@Br-Q|+7-+Ec_a#@nQb0h zTCR=aYF?B|2dU+4x`>jLVumTYUYLk1IkPkEU%S)pAMd@-eCEx3KHquseJ>e{Ij9L) z4*`KdnrM_W4g^{O1A$av;1x=y{wX9>S#+@OM_m*Og%T6&DiAg(q^K{#*|m=ytY@yylQKt?$U(A!!R-a~_Y(kw9S z+Wmm}B7=1z-(2)uu;$rL5i%awetK(#NlCc~H+)Y}Drcu7Xtu>Df2^8;p3^ESdpALV{fNW(VG*UBzI zrPrZSW%hy>o}oH5h5n&&K%3ae#1aQR-BROkL=K-=;5gJDcf;KrSvZo`&XYFR%^#nU zLoxjkV;y<9QJ>z-)8F4k_EJ)-H#}@@B-|oIaf;K$(|sYbf|i~JBc8WAT4;xS#trWr zi@0c8{W`)Yz7o0JkS+9v4k`!nqFVjS}Lo&?xA%WHB<7mwhaztDW6YE`4*j z#87wcVvelqCe4^s?zUp}=R-Zzk+hvmM#w+tm3bz+!L(7a@tD{HWo2|4bMHmW?z}Y8D0q&0@Q7B(u zxrc79;UvChHj`t_rOUIJ;@PFe9U7g{Tk~k{j~n_CGfVfG5gsSitx`yoMLb-L^;0JY z5bTg?z*zf4KEle?ex+fA#Yb9zdt^$CSA1|MUI8Z@6_vbrBbb3-rD=w3ts4b)S@r1=@fhz*?6dwEFRQ zOg#gz^tg&}urp!TSC}ItBFvXtLAfNFq{9>GwK*e<%ZMkxK)*K!uY#yt`8qhn)7P8Q z()&ggxOB=;4X9-to?H!p{B6|$(39)mDp@D^^0)uo@E1&&g(Kjl(-aK|b>&wJ|D)d_ z&USN=;qu#_n?toB)SSS#Le8Kggt~57^n+F?gqr8*(xe#gDIGSEs9kTq_ Q%3B9QyI`DI2>-Z00h3HHkN^Mx literal 0 HcmV?d00001 diff --git a/test/render/flex/align-content_flex-end.htm b/test/render/flex/align-content_flex-end.htm new file mode 100644 index 000000000..4b55b24eb --- /dev/null +++ b/test/render/flex/align-content_flex-end.htm @@ -0,0 +1,31 @@ + + + + + CSS Flexible Box Test: align-content_flex-end + + + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle and no gap between them.
+ 2. the rectangle 1, 2, 3 appear in bottom left of red rectangle.

+
1
2
3
+ + + + + diff --git a/test/render/flex/align-content_flex-end.htm.png b/test/render/flex/align-content_flex-end.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..4da94059eef6cbcde6fa6a62a307ff3dc0cd1740 GIT binary patch literal 1810 zcmchXc}$Z@7{)&ik#a}@k1BE$K?GEy$kDAhWDcEw0l*6)sa(qfk zg|Z;Z+JFMeLbX)Ox}Y@Wia7pke|5N+zl*>kjv&26;W{d3pG{C=`lyxgM$Op-`YB#_?n2 zbO2D}xH+SJ6P0FYdAHtMLDkNvd1%;N_ot^uWkK&M$#FeGadZObVUQa9{M}b`>r4DO z(#G=5i}*QP;19}QVcX;}kf`WxjVIX6@NWla2v+7EI>9nKLU$M zw$KZ96%ICx9(uShgxk5pg<`Kb&A|q!C+Q} z`UqTy-gGV>!(*_msmO^lm3apuENKU3>pQEg&LxS2;*-?X%REaGcW6@&XIwxUw1`IVrKICUKA}-ZjA~|M??%CfQ^%L`Sqx0PJuk>9gi--YN^p$?b)Zt1N%4yd`8pyJg zWjCe~S2Os@?_ma((+waCa>#hfK4BYS6oRm5UCnw!6tSg4h5Gf?Sa~&wz}IDZba$15 z7ow-5ZQs^tat)$VCTt+2m}U=NxI8h1p4lfMAC;F<3Klc_#2idNf@I!GyxlEH$eeIb zG7l?W;Tz5e@g&P4tFYL2G34sj+xo*FJST&&L_7ZvD5>nu0G^%a~r{j1NiXju_N**1cMm2$$Nk>SrVmz~snW0&-GiW?RMc zOlwX+S4b|Hfdo63x6 zO%(W}rfgrlUF6`cUd(FKsIokf)rcryU_K^?G7Pm6_r}`=!_BU_@cOql2V@s?dEY3e z*a>jLDX)+HingjicehdH7Av}d5|^XL-a~$0M3J=W)J|q-^4HQ<=t) z;{op2Z|%}00$dV4L)MZxZpIhLOHT^#MXvJs$@lxtX3t(EhDNCue;C&9A!rW}{6jnJ zDL;3NRRrD?HoZkU7+{R#y9Yd7Q>*Hzu`y-2cA9-n$U5YZF708J%$@GOkxA6c+Xp z@|dCiTge4^v_a1#M`F2Hj9cot2c7RSAClJi>5?tt|NI>QAg#PT)j}3q+N?&+PKO?X znyO)1Ph`W?byeVhywv~Clw8!IUi(V%T*ZkeCTXml$_CcbOq>DlqQ3_cW$nbEy2_71 z=XZWPIQJ&l{7LWxvIh;_^ai#oR>^Q*x~;v!cT0fK?)7Ko7j0o)t5fB0*IbiB8LjGi zd;VE0pmf8sHo8XiI&w{>xtrFwC@gqkW7dM>M8=H1*$3S)QAQ+E+Zi-xrmNRa9D$;X zO4Uqxw|h^h29Pxm+uER6FR-dZ-?H1kfc&M@5ogNVf+ncuu+8u6ME9p?uC6R3W$a%^ zAvvfHS!^6;aknkqWO%>XNf3r67};&O9iLiCirqotK#mDgHAnYr>Awmk09e8+lv-MH UdDhNOqK#YU=HlsGi#eb1J8R4zF8}}l literal 0 HcmV?d00001 diff --git a/test/render/flex/align-content_flex-start.htm b/test/render/flex/align-content_flex-start.htm new file mode 100644 index 000000000..eaf4ff0cb --- /dev/null +++ b/test/render/flex/align-content_flex-start.htm @@ -0,0 +1,32 @@ + + + + + CSS Flexible Box Test: align-content_flex-start + + + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle and no gap between them.
+ 2. the rectangle 1, 2, 3 appear in upper left of red rectangle.

+
+
1
2
3
+ + + + + diff --git a/test/render/flex/align-content_flex-start.htm.png b/test/render/flex/align-content_flex-start.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..f0368ef0a90870588c577dc822bebf4bb22f717e GIT binary patch literal 1828 zcmb_ddo+}J82&_zDeV}u(nfrYSeGn9!$ZbO-$&i^@lo9D-m!v35 zF{LRvLUqKLq|I0pGbxvGsWEc~Yg}iR-LvPkd)hs_XZN4q`<&-J&-*^_AMg9ib$4@C zfqwx906+!rg7X9bc^v?d(@~ILWm=xV6ITP$o#5>#lgUGMPj4&=Kt6WB^cn zfyX&`pO6z=JYC2$L^x(|oG>!@#%)OVq0zWDTkg6Cc@H^)wlKItCmwasi8^sTRTYAP z6vRhQiyiW{v6|T~ZPKuB$I9_zkqJkr%=hK37QWQLN#}S3*L zXuI$G>UNSTG!^bt(V1obbD~G(5w2MS_kts+9j1f6Qfvv1?!|!^Q-9EZ-@c$5S0E`c zN%5xYjvn^(?esuRhYI0CTGQau_Av&Eb)M+|z?-jcZ#EU6M_rCCE__^$_{wnAArsXt zI*e(wA5av(F)wv#Fu7-*H&!=1JK}er(PwLaERRPskOvq;<;y)vqg4j z6N1f)K6X<8=BJtMn$%)EYfL!e4RtLoMb~iIh_I#DB;W8K5R%BQrVn--ejh2K4rxdGlP*~V6GO5ogc)$9N#jL#3}k-OyS8#7EjXWd0qOb74tJ*45X+KX0dK6|T{5T)jy8GlT``^1IP$zuE2^V}^~_RI)y;>VY?_Qk zke_r9JK+Snb+EfJHfI?lon7%SVXt=gw1H~mPTGRcGzB5CgCghMpjZmhldv3JQ+S8H zgL6YF8i~=@KX^7dJMgAxQlq*~JzTwK0m|UgXFHRkOSJCgvV+fTEt=b;TyoyVGZuTC z%c?Hh)>t39B4#{lZD>}rA*J|?#Vl$q7OT~F^tPqy$Gg-tmHQWS7W>p&?=(QRRnJ;B zXH*LfDD!ww8p$iziNRE<1bY&{CYatbAUH&-&g&pec)!mvBlNk@jsUY!bbRma zi}`fLaa__V|0t8HlTqwIOnqb~rO2wQ z`CAV%v9`Ag9U3ulqT(ruA1|2vVM9g1XVA_X<1o0t{3o)X*8FQ$9HT(J zeHvQ3708RvQed=aTo=pet3Exyd0+A-54-yv3n!W%K;PVp^7o8hVUq zqtI`#Cgo^aIv2!kM>`d0IE2Mpt+8E)Ltk{MMsR-@tNxZ$$o)^C#h$V9l7skPYW+hi e3IOn~nIvZ% + + + + CSS Flexible Box Test: align-content_space-around + + + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle.
+ 2. the rectangle 1, 2, 3 are distributed such that the empty space between any two adjacent rectangle is the same, and the empty space of the column before the first and after the last rectangle are half the size of the other empty spaces.

+
1
2
3
+ + + + + diff --git a/test/render/flex/align-content_space-around.htm.png b/test/render/flex/align-content_space-around.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..704ecfefd06b38f401c834079ae704035863a321 GIT binary patch literal 2800 zcmb_ec~sL^7XBqch)5uXRtf?6v6mJ^5ea2WfFNPVK&uomZGu1qWB`MpB!SQ(3Q9^u zwgRFoB3qRu?AR6&DNB(p5Fw*5ARt>p*g{}%dS=eF)A^%k=A7@I_nmv+x$l1Wz4P9? z?&`O$PB>fd7|7cUMEY8V>^D>L0f#Qja3&?oi(XQRommA-`M;c)^%l8$<5o`lfpF%3 zV0+8F~+hkm0in~2J!=6J~3KSVQKT8Gq#=aX{WatAzzi~OEF2mA5@>w(Y zp+2s24^PTsZ7Q0vD@k#93c1*@IQ+GL3E`oZ6GPoN5fBX8IYjCK5qdzvewpqD9im*l zWk(D);*B;E(LNU{cQphZ(J49WzNIGDClH?=a04w-xWKy-x;AUlCJw;I!0|CK*2>2$ zZS}B`zx77RbsTjq>zFRMqv~v_UgWm8mo+<_J|xv{-96UUm)W*caETsS%BL=x_N^E8 z^qQ%r9Q}$nA3h(|tADP0c?_+iTap{dQ}f-LsSo|}aI(|Ai%avR5YkLFr%XLaIUuZi z{HDSIMfteN-hKq@!JinWXPvcI#hul@Pm^Bf!9L5n3*0?Fo8mBt7C#vX3|n zo3xm?Lsv^);vHovPQ0HyrsF%c41MJo3k&cUccUWZ0@C>&XN-K=UWthZXO8#rU%HdO zAjjTX-=I#!oxu!rf0uT^3z`;2&; zscC;kiO$QOe$J%QvG|tip4O*nXTard1t$20Q(l&7TDBkop1wi_OBP38o7&F)GVYLD zSD*IDO;RyxwcoYRMzfa91D6ij^iF?raO@;PZ6WPc0;Fp;;cH8*G@YTqy1Edq=K1mQ ztok^VbW9oX2vM}wCOPKI&EoGBtGj%qxy?| zryhk=Y^gGu@l`U|o*+ojU)~ie1-AUXKgEP(+a!<@FD2_vTn0Uz>87&CR(Ix62Gwx-ou~e1%Yo zmF9di`}80y=5Vq>BFXC_&l=P%Fsr(Ns>kN+P+PxOCtC1F<2}Vjx@3f(+D2*8D6;v; z1%;xEfg;pMdMUMChQMYM9>Kmog~p9Ow~@wv&fqoR0bvVa+zcJ8&}A{Q-6mC3Z6-Q3 z#ICK-kM(*itq}K935+DRZ#_%~qlID2pm^@440b&7MW;jWDNe*o=sn?F_kjWP%L$~5u8EhNvBr_->mVg2Gfo|7tKVg4yyXh*RQ!ORvga>w{-Wn z?AKrQH7l%5F+Nuwr(Cd8SzMBmvFNy3Lo={GNf!mtM&fvWAxjceA-y8+R^}tpV9)4> znET&T-7Wd@xWtCJi7oW~SL|GdH5k4v!miz*rvxL>G?P7Jo(7zGm-E1w7BHzNb{`m4 zHDm_~`z+*4Hyn5yx3?Q7K+$fq-(`)pP#2lq;F$${ZF@Zmyo9vR0tz2t=5O{x3kNip zAPm{A&;fgz3X9^WA#FD|e&F6Ead6=}hB)zZr2H9eYmj><*Ef!9Ge@M|oE^5=by^!c zxA@}|dcQJ5UwKS{TJJ_r7j`N1KhJo;#fb)HN#rvH+Ki@aBcp0?CAWjOUAgvQE|K%x z{Mrj%Ka@tF6`QJtaPop?y0}+X1eYxfLXp};y+Bk-Z}pQeM&~8L&$X=QYS}5Bq&RuW zYWqu@tM>OSK2pk>Mu1k;uos(6kfI)r}k-z-JgNWQjo|qkz zTAeGqp+D#^q`F|D9)RBnDKiI0z!8Y>6dpfAO+1>ov2Lqj-vcdh)C% zUw$$TBWhTCo}`3*jBqoHnkEM-fEv;!xpH9Q4q*$9E4%TF-Tt+Vw&c__5JO}0xq&DX zT3vgOQ=-)o6h^%6rr|`Xk?gS9>5}rwt*50MYbU`tE&FMmSYkJt)96y|G_S;q^c3!q z2J>UG%dcf)%JMiN#Lij|^Ni@T&Q4j}5V>(q&S?mVmecfcu|1H1HJRW!Dsm_17GB2l;M z;;Et=Z`;z&0a|s1< literal 0 HcmV?d00001 diff --git a/test/render/flex/align-content_space-between.htm b/test/render/flex/align-content_space-between.htm new file mode 100644 index 000000000..da23b9ee2 --- /dev/null +++ b/test/render/flex/align-content_space-between.htm @@ -0,0 +1,31 @@ + + + + + CSS Flexible Box Test: align-content_space-between + + + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle.
+ 2. No gap between the top of red rectangle and the top of rectangle 1, no gap between the bottom of red rectangle and the bottom of rectangle 3 too, and rectangle 2 is distributed so that the empty space between rectangle 1 and rectangle 3 is the same.

+
1
2
3
+ + + + + diff --git a/test/render/flex/align-content_space-between.htm.png b/test/render/flex/align-content_space-between.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c1b913418adae5eeab59006fab7b88abaa3fd40d GIT binary patch literal 2561 zcmcImc`)1C9#6y)S`ze5?S5_TT8c`jElO(%s+OuMs)A}QMJcU>aO+YRuXEO73^<{CS+B##^a!RUD5&->oJm}Sl)GAFA z@9$KeYMH(C?Go+ZW zLm_vz7_RXeedl(n;yjx`3kO0$qR2o&!JD>9wpwT@+axJ_k1`PgOoK+K&BhO?gm;7--BiyUP$LJDPm#7!kY0L}+r=4Jc-0)+TXR!maJM9P7c zwqQic5xV>R7?T3clG349Y;&#SqL@RLDrzfVGf>p+MKG|a3M>i(i&_M;HC5)djeU^p z%%OZ4-n@&I&KtGun%#Dsua2GjXXfcC5{2`okf%PgJ{n=diP`k)PP@gG%e?J9Xg)1Z zJ-pQT+Y8nw`8kPxyId~ZE95tveV<&ak+oA;qbpdFGZI?6lq{NawPJl(7@}u_pp=~! zhmUZL_V;X=0j1L}U_F0;&17t!74Y1c&|dol9zv`QZFWnjsH^5RDjaR~bv{2qUCw(H z3>c>&^0HP-@Xpazi;0Atqb{#urR&ka!S)@dFzwc?c2pJSzQDnFx^U$*-IzXrzcz!w zlb2Ia);X9Ai#;l)!`i@eRyGo&JUAOqY&hSf_S6a5pE@wvZbcu9$Pm93+f~o3C|#?} z2`DzpqoRxNZO=f`s&x9F?@qD~`lIK6A!Is6D4Ae;kY(9dqr*IV6?1QJOLMMm#CJxY zeg=y4EqeMq^DJ{F@|aC4 zZp+#ZnguD(AZLyjrlSJ;D`5g~chu-K3UdsT!H`el^)6P zRU7NoRvp%F=5~;rd>q}FXr(Nb*@6u+ry3zG_8;_T7m#_K%2YS1$|56{M7i}3VqoSK zPI`-CiV+&gR$voQ1)PmD>_y`@Pj~e}tY7RPyLHRL7j*<0$1Z#tz^=ACo;Ac#mnH|G zgZc5J5Xts_?}~hU?K%l5GMg+74pgtXzc*K!^tf;y*R89bj($5{4r42DWWXIcS;0W$ zWh5wOUk?;Vr0Sk9zmmL=+O0zG^l2*o*1%t6B)EVwuf`Lgb69{`9B)Br%-VA6f|7kT zB@^v*dr9}o1FL&@uqd^=x;xsfNFR?G3iJ0#FHGcX-1JtQ^7KY4CR>m3Wz+ly)-)T| zVLmX0wL-Y}%xHJE@tmKjW5e<@f;J+IWfPRbSKjOgo-N&iP(qMOBH}d_%O;*NDUL`qgc0{rIa@d24kE|1d#) z1GSy(&&~DzL4ydewJc#xh`UJ>C;PhFPvl?t_!-M;cC>gT$@?(!;i^vt2Ybnk6_*hL z+ktT-1Y#X!*U6DDt9AXmkUI}?sqe|S%TKra5`1(iw6fMQw1>*42fq6i7?5<_IqB)V zhDdfTId)g-SHO@j`lR&tx6NlRh)qus3E-5!{%O zOv~!;yZ74I!4M}jSlJu!&(pdE!6kiLYVcbMwp{^1c=Ag9eZ+Df<>;^IqL!mo0?6pzC~!BfpOf>2)@iD8zbj$y~Td;v53 zQF5oRc|z_X<4`kB;wp^TmnO*ZjL+B?%L_oF5H zI(>Y?-p-!6X)V2L%aK*eKLKck^i+y8&<42J?|b2bmc2gLFN&5vwwY7(?yf1diFs_% z3yzc@yS;68Q_eQOOBzL%nv+PRLC7?rN>AQ4YUiCg8!Zw&KhDbdcH7_~f@D~syy#uc zDE!twbKUDoE&C8>Dp7f{`x1=!$1(pEMy`E7cL!V(AD7qLXXMe(Y<>H}wY!?CoI-Vp zitGhxhleU&rG^g|-dqEVB2VU}ilu%8HFl}VrE%KvZksk=_m~_4{CFPVZ15gHEnme+ zBEs`CmL3Q+wz%7+a*taYmk&AZzVtv|4$o zNn?rty(F@!LO(xVY2g^$vVfK}I+_Jc|BK~k zr~kdwMOFfJ_XX*I?cE + + + + CSS Flexible Box Test: align-content_stretch + + + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle.
+ 2. No gap between the top of red rectangle and the top of rectangle 1, and rectangle 1 , 2, 3 are distributed so that the empty space in the column between 1 , 2 , 3 is the same. +

1
2
3
+ + + + + \ No newline at end of file diff --git a/test/render/flex/align-content_stretch.htm.png b/test/render/flex/align-content_stretch.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d8487e454551134430a80f18dc17cf7af4de4c79 GIT binary patch literal 2278 zcmbtUdpOi-8~(Z2j2vc~5{jCiSQYV6$(b318Ofm{$Inm_t=7=6ldKFG*)cg2>iZUD zoYDb{F_aw>b|#dO(-f0K<1B_TW0tP(pZ#O6-Mzl|pXa`w>$%_OexCQeZj!5ugW}G8 zI{^StbaJ$F2LNdV07#k1NN;7-({$6f0^HU4oV`RM*@E#BU^_@8$k2}=mY1Rc0Fv%x zhddV}HIps%wB)FQ{clQ4_-1(ED!o4427&l*@8IRprbpBY`x8=R;x}8=Kb(c3z_X!+ zF$sl|S^{C%TE#t#Z~;QMoO;lG9`r1h-W>z-Dsm*I<^JkJAN_?%{DEmyyf%C|CBTb5 ztpC_Cz^WrrbNDX(Z4G8G(W0G9c@lIQ)oNRba=+M%%E)qUjI<`+On72Ty{i}OR;tT6 z42jLV2%6X)cxe!R6th|I>L^a{Jh@Lie9#=^4L#IUlSZXUfm;e)kk!7+A4FHo2cm;u zI6(oM9B6<)=~8c<<6&rC^z(Y0a`B$0&ul8qKJ)h{J!khxqo%aMs6?3X9CMe$-RRgw z1^FJ*``o-0ozi46+T$utJl`*fbfWH{i?cYB%Nx_9LiSP%REJ|)KM!Sl+{DM7W@sLX z@)=VM%2{u~EE5C@i@P)J`)2=D7o#y4x~mTLR%>Z2$0QrJa_jw>=y*t*Fh8#;6+}%T zCT2w4knelRaUU_(@ZR^wvSIt=UkB7!%s;1S$J5N_?orhH&amdA!B{txT9@?1syv$g z!q7~c|D4jCqMwys=tI2z!j>f$C=M*Kr=Os6k{-Xv4#2n4q+51+q8VAR>WRdLK4Af)f&!!W;aS0$#~u^ zAI`gIawdB3$@%Mz{_gZ@K?TL@^H_t{1D^kvfnG7%QKzgR-Q1FXihPg#dHAWNxy#%N z9{rLh3dga31bHn+c#L`lYOdfQ0EnWZXuP&ShC|YW`_-ek_PK?HaPIghrI+Ag3XOb& z;07zu78{zeV%{|!?~w;AQ&!Im?9_2q&%O$cF|E;-=1aN{uh#f@5G$p!pERq6 z5}+zNIV$gTW`#5hwQ|_hohz!Oz$C*&P0+@6Miz z5SAYKhx+IEZyTT4;7mJAm6CkZdVI#wj#c_2%w>WPb2Y6ofNA1jW(Fk|rnpsw(HKD> zKgSK)RZj13aGi7~h@o+N<_wl}qmSnxVgriD;SoJ|Ge_}fd`2_9!Zf_Te;m!ah0tS(i^rpbT|~(Z@4H1J7i^vOys=5PUXH=-(%^Nu zN93DDR;{9wr7cv(wPFG1TnBZ$-OA5saP54hg}<_=pd3Hg@M@OYK0VUUiVIz`GHCZx zf#cs7Ql5Ae>}xTwOUEOKE|B*_hO(%aF?3KX99f=UMR{`Nm$zS3DwW;q;yhE@N%Xbh zY8WY6ODj(G<1IbX2Fh6Zk%ebxNRf4VekZMi$b8hJ?5^>{XTGYO+wz=TPig9kFbbcN zdU6r)gJ*+Aep%EoT5b?y#`)E^9d>p_9|)is~xRg-u{7*+vd zn0%uZwq%8Fi-%zW8WPbC9KOi-5f)^VVu)y0{aUeusQT4s8E>reKwk9bj1)KzfPYr> zC)|IQUL$1GcdUo~Ly{*^#P!#>ZvsmUgjFFwRJ1FrHzdf{NiHZkj4H~oHWT8Y$_Q1f zX=54EF0F|dhnNaTtPIIi+bc}YXwKtr*P(qs$AV$Hb zV94Z|9hywah>eWe)BPz3TNh-%HxyY$yCIVgI;J5EZ?{9>hyGvCy^QG-G%Ie)+O;J_ z^)JE1z^>rr?dFB>$`>+ff+Gup<*!prEJZ+!&TikpGVM2$$-fMKRfsDGw_dO22f6HqCz{%dlt{V04+rI-F2nS^V literal 0 HcmV?d00001 diff --git a/test/render/flex/align-items-004.htm b/test/render/flex/align-items-004.htm new file mode 100644 index 000000000..a5e90f0ef --- /dev/null +++ b/test/render/flex/align-items-004.htm @@ -0,0 +1,53 @@ + + + + + CSS Test: A flex container with the 'align-items' property set to 'baseline' + + + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
d1
+
d2
+
d3
+
d4
+
d5
+
d6
+
d7
+
d8
+
+ + + + + diff --git a/test/render/flex/align-items-004.htm.png b/test/render/flex/align-items-004.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b5d9e99107844d149e504cf70cdb7a0f59ec648c GIT binary patch literal 516 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*GqL_5I9y?^MS2GzJJ5aM(=M^?)Fd3nCx>bGx%8h|LK`ctA*+q zGnHBdoH!JLL{-++-+w~pUt75%ul>|v)t%wXuU@LLsNRzukyNo>;q&1M_neolc3SkU z%%d_tj%m}4pjGw7rd$6!eQ!6zG;7tpJwAwSrs{X+ zyuH4C&Yq|G_4Ybzb9TOpiFVlK^>$ZnRA1^aJ{fF-!JR|02^gw;CJSNw+>-O0Jn9cs3}9 z`}=*HG(82)eB()VXHJxftUc}g>?_Zc%*X%M$DaN^=SIKR8}nP0X~HR=Shvhrx-EO_ zu0Gb6)w5T96yF_IJ?mEN#l>Z76(`uvk7rtY+_2wj!ev{&U*#U)VBt`Fa{lM9m<9$$ pCKe6>1qZ4!P8 + + + + CSS Test: A flex container with the 'align-items' property set to 'stretch' + + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/align-items-005.htm.png b/test/render/flex/align-items-005.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b5d9e99107844d149e504cf70cdb7a0f59ec648c GIT binary patch literal 516 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*GqL_5I9y?^MS2GzJJ5aM(=M^?)Fd3nCx>bGx%8h|LK`ctA*+q zGnHBdoH!JLL{-++-+w~pUt75%ul>|v)t%wXuU@LLsNRzukyNo>;q&1M_neolc3SkU z%%d_tj%m}4pjGw7rd$6!eQ!6zG;7tpJwAwSrs{X+ zyuH4C&Yq|G_4Ybzb9TOpiFVlK^>$ZnRA1^aJ{fF-!JR|02^gw;CJSNw+>-O0Jn9cs3}9 z`}=*HG(82)eB()VXHJxftUc}g>?_Zc%*X%M$DaN^=SIKR8}nP0X~HR=Shvhrx-EO_ zu0Gb6)w5T96yF_IJ?mEN#l>Z76(`uvk7rtY+_2wj!ev{&U*#U)VBt`Fa{lM9m<9$$ pCKe6>1qZ4!P8 + + + + CSS Test: A flex container with 'column' direction and 'align-items' property set to 'flex-start' + + + + + + + + + +

Test passes if there is no red visible on the page.

+
+
+
+
+
XXXX
+
+ + + + + diff --git a/test/render/flex/align-items-006.htm.png b/test/render/flex/align-items-006.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b5d9e99107844d149e504cf70cdb7a0f59ec648c GIT binary patch literal 516 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*GqL_5I9y?^MS2GzJJ5aM(=M^?)Fd3nCx>bGx%8h|LK`ctA*+q zGnHBdoH!JLL{-++-+w~pUt75%ul>|v)t%wXuU@LLsNRzukyNo>;q&1M_neolc3SkU z%%d_tj%m}4pjGw7rd$6!eQ!6zG;7tpJwAwSrs{X+ zyuH4C&Yq|G_4Ybzb9TOpiFVlK^>$ZnRA1^aJ{fF-!JR|02^gw;CJSNw+>-O0Jn9cs3}9 z`}=*HG(82)eB()VXHJxftUc}g>?_Zc%*X%M$DaN^=SIKR8}nP0X~HR=Shvhrx-EO_ zu0Gb6)w5T96yF_IJ?mEN#l>Z76(`uvk7rtY+_2wj!ev{&U*#U)VBt`Fa{lM9m<9$$ pCKe6>1qZ4!P8 + + + +CSS Flexbox Test: align-self - stretch + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/align-self-004.htm.png b/test/render/flex/align-self-004.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + + +CSS Flexbox Test: align-self - auto and align-items - stretch + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/align-self-011.htm.png b/test/render/flex/align-self-011.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + + +CSS Flexbox Test: align-self - auto (initial value) + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/align-self-012.htm.png b/test/render/flex/align-self-012.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + +CSS Flexbox: anonymous block + + + + + +

This tests that text nodes that have a flexbox as a parent are wrapped in +anonymous blocks.

+
This text should be visible.
+ + + + + diff --git a/test/render/flex/anonymous-block.htm.png b/test/render/flex/anonymous-block.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a004783c36e41f202e914b68c4617c15319b2ff0 GIT binary patch literal 564 zcmV-40?Yl0P)d295Cu>Ra{wP9*lOWA)vxAk#2mp#Qo)jEP{lK_n*F4hwUq1z$$}do02zUqp~ik1 znuag_1!E!;naD&YGLdhDTr|6<{Zh_*=*4@kd*K%SCF~;|;^O&uOV7m@&mTil{tS}e zAU*=|_YsM~#e#4a6Nac$ut#ogE}82F=Q0!fVIt1iQ6nx!rYx^Dd||fw?|^{4BxrqX z6m|k62S?9Q06uBTb&ZiSLAll{&W>wo>zTJ|aH}r_i=XvxNT|sDfiOqlTZD?-fx8D~ zg78!k&VG9eFGx5d`tucHo)$~CH<6aukfrB*=fy!}i9mGj9UmXM)LXjvO>1pK&=G6M z)y@bvLrW?h(Y+HbzY%SSwoXuXL>r&6os@SGyh36}+O~WY!E?z+WEI~`HqHne zLu}lXU_D2ORzH(Dsv@K(hs!X=jg0000 + + +CSS Flexbox: auto-height with border and padding + + + + +Tests that auto-height column flexboxes with border and padding correctly size their height to their content. +
+
+
+
+
+
+ + diff --git a/test/render/flex/auto-height-column-with-border-and-padding.htm.png b/test/render/flex/auto-height-column-with-border-and-padding.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d06e4fa6d10dff7c495354f06b4c4e484528cd56 GIT binary patch literal 828 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK%b1vfq_3iU50K&s@CkAK|NlRb`KzJm|AEu4 zjS@Nx3{0;*T^vIy7~f8fo%C3Xr}g97M?d#H_*=nQB>E=(n(^w{vS(hfbCg~3RKFWL zG4}bACPy~U`3H*{6gZj`Uc_j*-dgcjV#W8{p*ok9uII(yx}_OC-%M`#(LW*CQh8hJ zxH4bG>2=*L-z{DJr&g_S{|z-;<|0o;KE-|PDZe5GcGrn5`MHz7sMoM5$F@~^<{gHa znde&n*PQ8C|A#+O&Fhl*ZJ)x4l4^5FodG6AwQ)14~ z&emw;>d0L`^Vww6kF?o$&WhcAw7&GIs_^MNW~a_yaT{hYS<@*zN$|hsOPQ_PFP;jo zZc2J-KX;+~>UBC>P5aZf&Rd(aIcMI_$?4~;oy875o2IxeHOcT@!-vZc?#yldHmz)$Vqyln|J!w<|9M(ejG%SAx6KeZjAVyiVU< z*)vRxXP!7~+AqnAKN9Dk40l|2f1<%2#q|wK_$IjtRLQxlX1&hz^T0{Yc}u1h#LoP( z!o##HCf=fCt)WqtLg4Gr)lp&Bm8vK2&Jy+C6#lF4$|}{VI_{e`R!mv4Rc_POXD*wX zS4n<6;c(1HXZQ1|agin7UruEIy6JO{>C-JUJEomazXmROf10JqZuyGkWl?UYm)cJ7 zW81V9SvQ44L*33i7@z|sq2H%>V9a$3_Jgz?at{Po!Ai&Y|?)7(07J+=G4s*#9>&vIl zUjNFz!9v(!&&uXM|G!`O#Vn8xlwv$Go8gf!!$-A-3ZN9H!aax%VueebCKMDv6!Sh| lftYtMHV>Fu7c71)|N7-Z6Pu@8alkyl;OXk;vd$@?2>{Xifsz0K literal 0 HcmV?d00001 diff --git a/test/render/flex/contain-layout-baseline-002.htm b/test/render/flex/contain-layout-baseline-002.htm new file mode 100644 index 000000000..b4774a2f5 --- /dev/null +++ b/test/render/flex/contain-layout-baseline-002.htm @@ -0,0 +1,39 @@ + + + + +CSS Containment Test: Layout containment supress baseline in flex items + + + + + + +

Test passes if there is a filled green square and no red.

+
+ +
item
+
+ + + \ No newline at end of file diff --git a/test/render/flex/contain-layout-baseline-002.htm.png b/test/render/flex/contain-layout-baseline-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + + + CSS Test: The 'flex' shorthand adjusting the 'flex-grow' sub-property + + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-001.htm.png b/test/render/flex/flex-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..156126b1f60065e6fdfaca6e17cf15f6e0d71ec5 GIT binary patch literal 992 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZVifKQ0)|NsAiOa_Mk|Ccg& zCszCgD(v@kaSW+od^%`8lAZjI_6yOPTv zb^Aj9uGH>OG1TMD_Wu9n*3z&^As5;wex2KK-Yf5Ex$)MER{CG}?%378{@aa-vde>> z%k6GmdeoNbIb+JX-wHdK53ZAGOpw`g_9Z_0VkS9g-l_xSbqTQ8b@-9gP;Kc{ND z@(tDhcizmcc)KD$v+7Mp?YAG*db($~{`!$+d*a&4Mw#6Y-+e4^UZSnA!eY9^CB_r? z%#%bFZhxP@ch`bdF5cT0{Iu+jXzdhpPZRHK($|VQdO&}@vBdI|i>AK6xq5T(=SKER z78$&^iZ@NodAD%(y=a-$hbr&Q6G&G-w(ipR>c>BClw8cUuTnqp#Z%$)%a)(4yWid@ ze7EoRpHI7&uekp7dF%EMb4$J+SzTgYWNf;1#azDF{F=Q5HGCdFawnAf+A~XD5#7(v z(8=xhCG*#*!jF?>1LwS}`}AnZ|4o;L|8^|s<*4&?5|K;%xLNXZ?X>>6$0vWcb;?Ry z+Qj1dE8%PI;@tOP?_Jl=bEqiU;=R}V)0R!uS$jWTyj_#Wa#DMO<@f$6>=SAPm;AiL z(sXvZXh(^4&?X<(%O@r;w_D^^;6E*hugUQ5nrBVdVnem(Hgp@*2sJTLPvsy;GW2b5TpEE_qA% z+8qk7{>N>7lf5Z2Y^%|#Yq|>BOW*GNlt1ZgX0h>!^DnPE)ctxf$-E*6mZ$^YU#buP z@_)Xz5{Dy)lR%R|ivo)xZJ9L|9H1Ok8(q(M;zn&kiU=n^D4Tk^`njxgN@xNApbp0@ literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-align-content-center.htm b/test/render/flex/flex-align-content-center.htm new file mode 100644 index 000000000..53aad11a9 --- /dev/null +++ b/test/render/flex/flex-align-content-center.htm @@ -0,0 +1,45 @@ + + + + + CSS Flexible Box Test: align-content property - center + + + + + + + +

The test passed if you see a centered 2*2 table.

+
+ first + second + third + forth +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-align-content-center.htm.png b/test/render/flex/flex-align-content-center.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8e3aa9a6170832c8f615e16feeba19af09675af4 GIT binary patch literal 771 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKH!?8;NyjsW4M2(~z$e7@|Ns9$CI~k$sGl}G z#lXO{$ec;-}^_mJnIv3B@1U9Hn z<1U+WvnOZ$wbv6~$Y}F5>r3**tP=$q2LuN?wyM>Jmw%Vu8npZIy17#EcaO^X{PUO} zc(pKi;@v{OC9`De^^@BC#cobj{d6IGU5Du;z9RcA->!9q?>X*y^tsXA=82li?kP4d zNqt;u@Sk_%s&%~_p7Tw2KUQ3SG0i&Yd1%l5O5JSH=#O51Ew?V2d#(D#+1L8hdp0Mp z?|iN_f8vkre?Coi<$F7)V@-YD=^fw1vZFm$XxY_wbxairGE+NY@p6jU+r=GUyh^4` z;*gvk{Yg5s%dcC=^-ap&-{RJj{#W{R6kgI=e!bblZ&#p;(yBjmt5O1L)i*sA{3$*0 zSNX&*Pr6UEP4#wJvg^&Qkjz^l#kXR5gRUAW8C~0OCHs@)#IQMeHAz=Kl>9id?+15i z&Avj;f2X!{ZhX4YHKp;yvh`+=P^yqBOFgsM<)8ih^Vbc|KDXSg@=jeTyJN+M>78HB zCJDwbIkB`-e&Po)CH1@S=YCps`LdGysqCFrZ$l?4O^S+roL2tCy`XN-DN#;tSEq+c zdKI?npB7qwWl}nLUastB|8_ym-#uS$wMJ~dvgL&4Rh{*7^|xfj?w|kvai30yGmD^$ zfFlZVO*m2*T?|FZ#BhO~ZJBoMo_d|mDZCTCA3NPRKJ$m9plbbBp})73rau#PIV9aN zr)2r>y}@z5-E+2F_bWBr6) + + + + CSS Flexible Box Test: align-content property - flex-end + + + + + + + +

The test passed if you see a 2*2 table and all the cells are at the bottom of container.

+
+ first + second + third + forth +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-align-content-end.htm.png b/test/render/flex/flex-align-content-end.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..6d023c546f8b0e8dd016cbb5568737417055d496 GIT binary patch literal 1050 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU{qpa28z^p#@z%`JOMr-uK)l42QoppfkFMW z;VGcPlb$Y)Ar*{ouR8Y4HV`>hsC>jq+QPqxrJrT`3r(f3Ot$Xf#SI?KM{?7iGArz? zt8>UOV)bveQu$kd(csBZi+_oaC7d`ETLgeaiqGX6Klaa%T|VVl%JMb;ew;e>YJN{Xb%R@cNqMAkOcU+qGYx#sXY(jYlcwMwt zPPl*Gtl`epeJqnEytxt)sZg}$Rhkv|`hqE}il)(FVQjLi4^J{m%}l*;Y2U`1p09oP ztlDJt=2+JIqNyQYHczk0sm@)v_eJ5KHM6pexOV1Mx_Rwg|8W1kyO&xvf9NWWjVh8$ zPgrqmx7;rCUp+0ez9@hF_&L+<%dQ(qGyZPsG|oJg=(bGENO@aL=lgZ{wf?@=kpArH z5xU;-$+@GurRyJ`cBM6v6=upC<*NFPrl+K21NIkP@r#j;!3LJCjg9ZyA{IAo^dn{sHg)jQkL zJN8+3wI8h$oql^q`_WZb)0as8J2Z7+t>KlYoZYYOL!KDFja@g%>rVF}p^Mu-YE{Ikpsd!lP^ zq}t76+w?wt$$4w}Z#tWKERWlsemeK|%XMGBef;r0U1gyxx}Q?4PfWw(#Y&bFv*XYG zHaIb*%wbzYOyAt^?FK^InG8Rzn|`gIcc+XzZuMdxmVotk>Wvb-|=)`hC&6AYBk z$wyhPJLB>ER`UKEdHe$NSw8M=FY%nf$1%bG&!*YuzE(cJUbgnM;hU&?v;R8%DOwi) zt)&b-xF@_-h-O0x{h-S^GQUGX*$$NVem?)n+BLJcda=)g`@r1I;OXk;vd$@?2>`Cr By@LP% literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-align-content-space-around.htm b/test/render/flex/flex-align-content-space-around.htm new file mode 100644 index 000000000..542fa5cbc --- /dev/null +++ b/test/render/flex/flex-align-content-space-around.htm @@ -0,0 +1,45 @@ + + + + + CSS Flexible Box Test: align-content property - space-around + + + + + + + +

The test passed if you see a 2*2 table and all the cells are at the bottom of container.

+
+ first + second + third + forth +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-align-content-space-around.htm.png b/test/render/flex/flex-align-content-space-around.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..f0d2c297db51b6d9c751217cc5f7a7a1f929fac1 GIT binary patch literal 1050 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU{qpa28z^p#@z%`JOMr-uK)l42QoppfkFMW z;VGcPlb$Y)Ar*{ouLkBVwh}p3sC=Y2F2VMsPz{Alq$_@KQT?P zv9oiSv4pv#Wtqs|{VS%-kvMLjBje1W*dpKrBzQ8VX8#kP{CLKt8E+zhp+C-uB1JmL?(74%c7${y+2i! zteUP+l>Rv8n$?XP``S;;{8!&F!+Oc8*DNbvxq8G;z4v5IT$9PB79U~t8i|rwSAIz< zg=Vh(qEx%gS@0T*&CH1*{d<=$ojPsh9%(k~Z8I8Q9E(o1hu zzuHoNWmou;SZ&?yiTvK7tIvB}{(n?E`S+srr-i3ot6y^>{nqXn)u~&=kE$-peR{i1 z>{79qc45Akw?%FC8dsM$`!{6XkNI3(biQ3UqHa<1-X|9(WPP(#hD4=6(G(Nu<8`7> z_Rqilj9oy%p@D&siG>3fqp09S^o;Y>_9sl=HsmlFK2%|Td2Y30-Si2!e_Bi^;5cFW z-tSz++`7|zcgu-OS?BW#-Tv{P<6r;R>5!Ml4a*~}^YtC$K3}V0_W01v zzx&MbM1|jVZoBTZ?ns|m2{bvc_i*7q^ + + + + CSS Flexible Box Test: align-content property - space-between + + + + + + + +

The test passed if you see a 2*2 table and all the cells are spaced equally apart.

+
+ first + second + third + forth +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-align-content-space-between.htm.png b/test/render/flex/flex-align-content-space-between.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..cca50c4be8d79e5d7a375e1c3a070f9316741d1e GIT binary patch literal 1046 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU{qpa28z^p#@z%`JOMr-uK)l42QoppfkFMW z;VGcPqn<8~Ar*{oub$3*Y$bB6P^#(ry%S$=s2VWbJhJxCf!u^wGeWrx1Q=hbX^SN^ z96qe9DP{j<#zmE`kN`TwdbRa2&|y?D<)>fN$G71gm@=W^YYIj+#ZYtzzynkmJsp5_m@7U?EWc)jYV zLjUe4*(1?66+Z1L-&Z|d?q%e(s9QNZw;R2@b1O$Pcv{#pg|GMW`fk1Z99q3v_)}Q* z^wmpT_g5G0Jo|Lwr;MG4PHF^Abw3rpZ%5j5|EP&U@3X6}?v9@IMbEZqcb;zL{O|>t zXTM)qc6ZJGiC2~#p1thcl)GIoN_Q@b{CjEkHvP5v+E0qPC+06HI(KbXsgyQ|c|y4bbED%0||r}W)8bAh`hTql1o zV&C|8>g)WqH4+hjC0~nt<;Yl;wfpN&r4GLWr6n~Sn#UFR&+m%v(D`xf>E`24gHOE7 zob11L&)r+bKIbL>_WpRLA3O8acHiA^aw>hVKaJa3zSApe&$TDP`uz`oEuUty#H)Hj zzVLnDmOIbhRfhjdOfPoRs;^HMfA?>v!ted>O8H#ef2%tSfnpFCjgmd_7T;DY{Qnzc zX5YZT$i%`Spx^*vq_92F<$Jz&=94K_3f&GqcTT$KwV#}@!Ry4&4>l8ih)f7Bym?h^ z#wv-nJ+lH%EY@m@RCU=FR=UDH{K@}__HP^GJmzq8YPVl86iJ?NeUZ_92BE_*`eUy> z&Qy5)uQ#U4YMJqA9%sLwXSiHt!>Y3O-ktydZI{mqW`z9^hv=|J8iAbycNfhWKVwcr z%bcq=KB-yiFs)$@e`(KdlgS25hM!(4UA-?|WLLxPQNwg%<%+J;>&y-U{otyR6}UKLzG&22WQ% Jmvv4FO#saszs&#u literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-align-content-start.htm b/test/render/flex/flex-align-content-start.htm new file mode 100644 index 000000000..4df16c45a --- /dev/null +++ b/test/render/flex/flex-align-content-start.htm @@ -0,0 +1,45 @@ + + + + + CSS Flexible Box Test: align-content property - flex-start + + + + + + + +

The test passed if you see a 2*2 table and all the cells are at the top of the container.

+
+ first + second + third + forth +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-align-content-start.htm.png b/test/render/flex/flex-align-content-start.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..43f61cfd2e0d16329c129e7216fa5f33741a2528 GIT binary patch literal 1057 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU{qpa28z^p#@z%`JOMr-uK)l42QoppfkFMW z;VGcP3!W~HAr*{ouU_nZWF>N}&|UES9+j^Socn?<9a+ot(yZY1jpdpQnMzA%R~9jP z#LX`jI>9u#f_b_JL`BlGdz4PlY z9p8Pn?uK^g_n?~=yMHY;>iO~}I>v3<$F{$3Hs{zgp8OU(;jFrCZDKv!$#n`Z*D8^=0a%sJGjuXmjaLp7w3)`EOzC zw}!vWy|s1wYH$6OH`4!y)ZX^y-hHYx^w-VmneAU>q9-1DmtD1Wcl3@gdbV5gqP_3E z<|+x@`}*ahbNiH6s$HL0_5Ww3>zeu7UWDymQK}ky@$T=_KW-I8Y%NS>nVtStu4&3u z5tny4QKwI-&AwGGP?^3yT%f#hO6bxFn`SXy43|9kEV9=*%U1o>mIr^AlzOg??g&}B zm3QyO^Em;Dya$>^FIMf^m8W}m*{Ayjr_BDD9{DACBrjyv#Uou`;@2;lzh(2=Qs#}m z=>nNSJPLI?iVm+`+TOTbe|PTmcT&%9KX|vUV|Uw+_`Zgt3T794JU-5z@JQ;@OG6#r zl!KeS&d>8Y-+#)F%XVwY?yu=H!uHm>zj~+t)#t5wZ0x?oUH^k!?KXn~<;Bh^W*u9n zUi>9ywr|Uo_+H2TEgs4_d*;o#ykC9#o!EUzW#8>P{x_Z8%e5q?qDQ|G6qBInthD%g z=;M9XpWlyf`YF#Lpy1HJz{tb`V#qb@IsUPxWb&NLd?%Cy#J3wwyqssIvPP)r&R#y1 zeJoEV%-^<_d)>+7iurm^K4pA*5XL!i?bSE8PKy52-?p%Rjkr*{)1y<0xja8bp6KS^ z5q3zL@n_TNsy#d@ckfROzIUu7ZD-*L$Mb6@Y)@Re{MzroKku(Q(Nl)79^#G(PZhk` zP@DyKABgcpQsI4}jr?7e=UbRJu{_z4oqT86%ofg$$^ZQ>{o1K`{I0RXBW?%2%E=(N z=E)SDaK5)oZEKvS%36<(+ivsJ!*$MX+?|gt|8F{Bo{>TZAwAnLPL(aA`|ut2IYsf U9T%0#17>mtPgg&ebxsLQ08Gfsy#N3J literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-base.htm b/test/render/flex/flex-base.htm new file mode 100644 index 000000000..2819dd25c --- /dev/null +++ b/test/render/flex/flex-base.htm @@ -0,0 +1,35 @@ + + + + + CSS Flexible Box Test: display proprety - flex + + + + + + + +

The test passed if you can't find red color.

+
+ Hello +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-base.htm.png b/test/render/flex/flex-base.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..cb278f1f19203de36303585f0485c141e733b535 GIT binary patch literal 586 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK7cnsd$s>J^TY(g3fKQ0)|NsAiOoj#q*GquRQBq67lFk_tsDQ-`xLcT|f2XuHHwrHR11;e(hXiKRdtpu~hQT zi`Q)N(dD5M%%ZVQ-R+q|Y*FFNBE_r|&ENwITxw?%AL51RJ$ z`WC%it8c$v@BHeHa_bWNwmWvp*B-s;s<-f4d(S*<+mEN>>Vey;%6=B*+$^zZ2NPahV4P2wng zUKzP=`s=5q#dvN-uSZvQ{d)aj z`L*Yt96Fest_Un@6EJOAq3FV^n8gw3+#y9>p(pCsstiF+F3{M|a5$ + + + +CSS Flexbox Test: flex-basis - positive number + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-basis-001.htm.png b/test/render/flex/flex-basis-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + + +CSS Flexbox Test: flex-basis - auto + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-basis-007.htm.png b/test/render/flex/flex-basis-007.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + + +CSS Flexbox Test: flex-basis - 50% + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-basis-008.htm.png b/test/render/flex/flex-basis-008.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + + + CSS Flexbox Test: flex-wrap: wrap + + + + + + + + +

There should be a green block with no red.

+ +
    +
  • width: 120px
    • +
  • width: 120px
    • +
  • +
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/flex-box-wrap.htm.png b/test/render/flex/flex-box-wrap.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c40d31f869a96c737cf31af64ffd8a9390f1dd41 GIT binary patch literal 886 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU`%0R28t~8*uDZtaR&H=xc>kDAIM~AU~s); zCfPQ~RwC|&6$_YOvQ~s?n}263p5Ae+a;we9)Hykucw5dacJ1zM+fjYu zN?ym&$~kQb2WwJ4y_zxqZc^6ycZ(++4L=yJ66gHJsAj#_+ncoyiug78e;cu#@3>ZT zVh^93QUBR?7yGOl*HgwxmP-z%r);{pEK$;{WB>lPle22F*Xl=f?^kYF5qW==t+f-! z%6ABTUJM|x@OwLtEk<*RJF*$PAd0CmW z&bh}XEZonuCx;*Z^F}PVx=g-RXCK!-rH@ic(;rrc0=>&Tz1pMl#&p99w=K_{pOt=? zP?=+=@+ + + + +CSS Test: flex-container-margin-not-collapse-with-content-margin + + + + + + + +
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-container-margin.htm.png b/test/render/flex/flex-container-margin.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c05913f93ac04e69d8e9fb0e306cf1913c59647e GIT binary patch literal 223 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKo0yn^mdKI;Vst0C1Q`KL7v# literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-direction-column-001-visual.htm b/test/render/flex/flex-direction-column-001-visual.htm new file mode 100644 index 000000000..fdbfd84bb --- /dev/null +++ b/test/render/flex/flex-direction-column-001-visual.htm @@ -0,0 +1,29 @@ + + + + + CSS Flexible Box Test: flex-direction_column + + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle and no gap between them.
+ 2. They are all appear in upper left of the red rectangle.

+
1
2
3
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-direction-column-001-visual.htm.png b/test/render/flex/flex-direction-column-001-visual.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0cc9c62075c62beef33109025f481f17cfe084af GIT binary patch literal 1810 zcmcJPdo3K7>b!=T;fL(xt(k! z>lQI~N~1C&G)_|*w@h*!BgCe~Fst^DcF(c9XaCsepXYm?=RD8ndEfKAZ^|JT$1QMG zI0OROg2&mpK_KEN2t*7eA-*1AK7o_gox-7mN9{!-(Yj0!LB2SV$d))9XcZ6+fk-{X z+u0tC7Ms4dIs29#VqcmXC?9sY$Y2_VDVND~mEp!{V7^r}_4Ob0S;@#Xqsm}#2kk|1rC`9yoER{y z1q@37!>-h6uQ4$oGs*iB5{Q(+>z`gG{+w0+>Spe3k!D%Ep>D)N+*(fAVpRg!Y!&&T z(TYw(DH-N2H5&FJZ`TOZXhR) z)lUgnlI)4>+-9I3+z8TPXiYwb4$qpQOe<#A7iG33Sb1ypx+mubG5`FNbh)P%>dQ(UoK+xyf-)nJ^y z4J^OSnv~q6T=$5X2|r;`Yi_>P??p;TSlI-@CE|ubm?pWoOEAu8E!Q{rei=uOe|@oF zb_bx_b1jA+ZL!$Gu42woDp@9i6h|(1sQa@+#r@zcYp*n$1ib}~8hA|RH9h0#p?&PU z4#&N9P7B0`&na!F(Mo=Yc}wh8l0O;qNE{+GIm^sRu`1HZ<*7vd^bE#-BC8QZO`l&l za9)MQRP;kCFI%Y?N5FQ#USjHc59N!R4RuhXd!c>Ddv$bltMspw-xU^elJC%kJm~XJ zpOE#TPG-8rsf`~z3Y6NO-9rbfhLA}Nw(jct(jVI1EUT`Z#!YMwC9Lv0iO%%F5|BYA z9_b&5cBZWw4&<$0@ZFBVMrgmDlZ~e38u{LWr@S$lxFl;f)(YceJO-MT6nIJsj$@oR z?1^IRt?NgQI8B=wmt`EIW0z~Z%tol-V71fL8fyK=PQv&v9y4R60OvI?X=a7EW3;vx z7u$9YivG~(N?Vc*pY<*V*JfrZXSk+-d+6L@mItE&%J+JvK~ouea0^ zg+@6r@Drp|bZg9+W_sVN*jQwKB;7f~Q|cxCe(fR7)r^`j*mi0U>0Ct=jeWnVISWLu zxC3bwldc2g&%)46Si((xKRFGmdcMuK-(daWb&q|fC3KHWnGV4zd&L3vJy{8WdrC=| zgplqPPee$Ab%mD^fhd*=^nw)j&(fDnLyeN+GxxQdZjjx$=D$b1wGpH(U(vowG$__6 z5HrWC;mZNYq_0E0wa)+rwzNGKz&sVKQ27o)A+RPdp+>bFq$L0(+5!b-&|Zq!w%cz5 zwB|Ph?hB@y0Pdv?&$IDt7m$Fc(Y=i>FOG&t1pB;us!kA9ZOib|)Kh#cX_8d&PFcr$ zKe)}-Pa;KL$KmhA_@KOhG76o@A}DmFqXgEH@d;}ss7{HLr3Y$>(~9e*dBGX^+U*!c z1#Mh93hiww(YFKF72x}#OWuEgq1`U~uZVx3|23r{jIu38eW4_>pnu^0X8~PbwAfX# XOuKTcQhJWemj%SzyVzA@eG-2MW~US9 literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-direction-column-reverse-001-visual.htm b/test/render/flex/flex-direction-column-reverse-001-visual.htm new file mode 100644 index 000000000..2d77d6666 --- /dev/null +++ b/test/render/flex/flex-direction-column-reverse-001-visual.htm @@ -0,0 +1,29 @@ + + + + + CSS Flexible Box Test: flex-direction_column-reverse + + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle and no gap between them.
+ 2. the rectangle 1, 2, 3 appear in bottom left of red rectangle and from top to bottom of the column: 3, 2, 1.

+
1
2
3
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-direction-column-reverse-001-visual.htm.png b/test/render/flex/flex-direction-column-reverse-001-visual.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0790dcc73f187595e4e196d478e7fa3c073d33ba GIT binary patch literal 2024 zcmc&!dr*^C9t{hPA-vKAc?6IIErQA`>=Lkvgf9q0l!gFBDj|hJfeMX;svr%|L}GbG zK!HNFN)duZN+^U#GmB9VUFJgQLP*&Hlk{*tbe(~8uBuU^iDNt_1S*Mk>v34SuNF^7ZlMEz~ofDt8`0;kY`1^FUEqc>nE zfJez3X_2F$2#tFr_lapHOw{J=BF1s)H>#TtG^oWyFF@Al7eIq@ob&;m!2_`=&J(lS zNj9=GQg{EyxRxRJue-mRDE%Y~-9F)cLdE(v&I;Y@-dq3dI=>%!F{x<;4^LL%&0rpG zh8}pBhia!#B1Zw86^vX9EX$PTJOp|_%{BEeCH~ zwW_>DlrZBMps92qOm?sgZ`c04^hy+Cjj&je)UI?@IJHESs+K%1R2~wOl>-?Q@x+%U zbJP!Nf3S3L9IibvB;fG2=l=e1F&0+7JSe{Dah&I4wYsqB*p_~@+pGCeowR)Hr_fue z`km2bsZWD_k>frtmk^$o<-I_*>InA4_PM#PKtNOdYHG7tZHHC%pyHO0<@on(+icxC z7}RsEcJ&p)%iP&xKRgXmi=$u>d*hG6hRy1yBpqw_`wb@_vVAR(6KgTNoX%`OKCNlB zIklYMdR}3_5e5t@MTXCQQUCtF3rA}7;z7EcxXb9NnvB)fb)g)*DD&$#fq@1IiZ*{J zz0lUErgb?K+k&d8px?bwSB-yEMSk3ocFUN(o>}|ouuoY9?Q-%abstkepU-mJbK|y^ z<(M>`iR*kRL5^F8>E4Xa$c|YmQ93>X)-p0*Ypzuim*C=nM00fI-kuBS}p|#|DEW$^U#HPuM30T(SI1?6OA$2qY`#MGuP@xwY$Fv`pOEUnN%k#y@z`e7a zl%gW-ejxsfSz0le){GTRI6f3?GufiL^5%EGrn}B$69Ssl^(p^MztYRD8nhK2D^(1B zHZ~YTR1<^PS!u(Yq4!elCz(K2q16b(YxrD-%Vjc=@SEi1j+r#^%ObWC9IuoL=6@3( zt08yJp@I^cgWDq08Zs5)+BR{vd3!MvKXk-YW!R=metZ8xb6xVnt04FGohaTNi>$S} zKl*x{zZ;fbL)oh`9%!yNZOO;8S{{7Jdmfmn?+SadTEdw<{*&NW!C9bl2bbS6ZwdM4wHKSXEpAc6kQ9ln+Xl?1upL{WxGjSa=JNzEq`^-n2FZU)S z@$4axaA2!DWL~)sjOn%MM;4ek-p7pW&U@k-0{1{@j1QS`!)ISjF}=mOhRx|pr`-ue zGXKfhDsDBc%#FHs1`1rs^WND3;0nU@uw$o=@CXNVrvicIqUeLU{6z2D5+7{gfJ9i?dj`L1hj=69o@0iH{)a2f7`rPJKW-G7IIp&D##<0-0ou*O`E6+tF zka#$ZzxDs6T-^FDLSyv+m{2b`@%A7h!rPx# literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-direction-column-reverse-002-visual.htm b/test/render/flex/flex-direction-column-reverse-002-visual.htm new file mode 100644 index 000000000..09ce44c44 --- /dev/null +++ b/test/render/flex/flex-direction-column-reverse-002-visual.htm @@ -0,0 +1,43 @@ + + + + + CSS Test: flex-direction: column-reverse swaps main start and end directions + + + + + + + + +

Test passes if both the two columns below are identical.

+
+ ABC +
+
+ CBA +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-direction-column-reverse-002-visual.htm.png b/test/render/flex/flex-direction-column-reverse-002-visual.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..5ce25dfea6310b8f7dd7842f76a3327de22278bf GIT binary patch literal 406 zcmV;H0crk;P)$c_Ihq$<`V3xi23FG{em-e>RpI_L?*cGkjeGsiiq|i$=cFp$#zKEA?8R8fuulEL(q#zZA;fGb%)3fsj>VS ziM>L88o?(>5a~h&1d*pjavp#j=Q0jKcqUJZ3_17#LF8!> zvjNC)ZoCMQM?;QNT|+M8fFMGI2oWMghzv*G08;# + + + + CSS Flexible Box Test: flex-direction proprety - column-reverse + + + + + + + +

The test passed if you see all the cells are arraged vertically and reversed.

+
+ first + second + third + forth +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-direction-column-reverse.htm.png b/test/render/flex/flex-direction-column-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c6f43f235cbe40635903e2521f0e531fecce7dbc GIT binary patch literal 1041 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU}R!q28vWajeZZLcmjMvT>t<74`hOH1B3c$ z!&5+o2RvOILn;{GPWA13Wg*hqt8~m~($^N%9V*qrd%2dx`F?+)%b+=NkF;AH!=&5S z)f&ScR>d{WN-o~#vF^#UU(dVG>bi0$wg@-@37?47m+yadwZ5#i_13yGYwKRWtNo9)U+31X_E)m}6g%<$rvLmCSKm0SWWH&>a#E>yxN>g# zn;P-;H%~Rs^!wG%koj#;WZtWiTysS7+HFniUJd0V z+b7L5UiQcS{=_i0p8MObzN|jFyh41v$a#0~cTY3BR+ZhGDAS)C74>UY*i)I+IXTbw zZQS}Y<0Q{yk2-n#lbL+g^BxyYJXfQ7X{Nu@E1gS{lU<&y?|i$o=N ziQl$)oI7ExA9CQgQjtQ~$An1T|9_TrJ;|D~D$FV`Sk*IdrH9(F;PrQ+7YR+|Qs2K} zj`HbUYw9=Z9hG}+vMFV`l)Cbg!#9^!E%Oik-0!;X;`XMu%*@;DD?anA5__3suTHq*XqS55ms^lE;?8B?2`{s8{ zdMZ~PzU#!kzwJA(1e9xGgq1U`8hqA9dGjAK>BL`5BE z!LB{KJsu)VV{^T*fI|w+3Yg$xC!m(%imyTU{Zj7l7BDM3I#0<#X(7|ZSYxx}y}@y! zdP3z#+Rtj_iYhG>5_A{rvWZR!I43VH-nBl;IigKTq_TYCp@le&$KkEb9m_df=V^TM z{^_=EFSHYxvrS*IsEl33i=P zYIOz$5X|)`#-j-Ka=Er`IP>tTcdfmksM)3m$?-c*>|5`y5~8>%yH9%g9;w-fT%Tn0 z?$xe$p9Bg+*83q!LN=}iE`7b+8`D-E0_x^*)%f%dn}xlnTyj`7K-mo#nU#|N88`2_ WDm^9U=3HQ=X7F_Nb6Mw<&;$TYr^*xn literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-direction-column.htm b/test/render/flex/flex-direction-column.htm new file mode 100644 index 000000000..fb108514a --- /dev/null +++ b/test/render/flex/flex-direction-column.htm @@ -0,0 +1,42 @@ + + + + + CSS Flexible Box Test: flex-direction proprety - column + + + + + + + +

The test passed if you see all the cells are arraged vertically.

+
+ first + second + third + forth +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-direction-column.htm.png b/test/render/flex/flex-direction-column.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ed9a5315cbc57ef9e96c90c89947ef58dabd642b GIT binary patch literal 980 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU}R!q28vWajeZZLcmjMvT>t<74`hOH1B3c$ z!&5+o&7LlfAr*{ouLkD5vXD4hsN9_%H|cAO>W-j2osq1U)}%dK$?f2!^1e-7pW)== z^LasSmjbqaDS9)nr9qfAkN_=YFyq|sJvfj-TlW*Vt z8C!F7u@0l8v2V7|93QFP`O%ZrlYI9@xuv?S%Q)*j|9D(grTJaYcOQl750}}`%}u+P zJkLYfyr=&5u_gP%|A^c_8ZLF-+xy<><(VO-pM_68{y1aVw12X%cXDM6>{rY1K&^B_FmYf?%T%-&X>kd-u`NLUZbO!`dDa&nlAtSZ}N&pTIsX9 z)hF2GL|Oe%~^?yd*R(PF|t%;$L~7vT&(PwF9au z_g5Nzl9au4r#lE3ciFXd zZ~fn$0);#<_}^T-$>lX+|3BS*^&E`d0$Vs75yWbz69Ut$ZL3$kZeForGUxo=hZK*m zlk-@?RCM9_+~Bz0T?HLFYd01@wV%ksIn^QN!!99@4=oQI&fRL=k-qYfqH{!_fYUWT zO&g~RN-VmBh*bhcEl>T<&wDjXah`ya97knn-0AEqaiY9Gtu5^Lo@#I5QdnOV66(NK zDRqno=rFl=cer|mqb$IPfVJ8kn<0T)E-Hz}D8Vl~J)y*>2;)nFk-4JGC;S_b? ztGWX6lqg@P|B?2)8ppL177BGJw@h$%W_$W4a(BR=b*3#(ITTagPB^4Y*f&ZnYq@{{ z@b1f-mFxHyrR;isZYrN;S&PCKKFf^tbEUqn;BJ?(etulfPB5NXC4{N4#b&RTV&Qcz zM^S#sLq#nDo60;M3O0!;W*`$`sRGfCU64$3Y~Ho{pDf#L=WKIX56qVgp00i_>zopr E0QY*brvLx| literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-direction-row-reverse-002-visual.htm b/test/render/flex/flex-direction-row-reverse-002-visual.htm new file mode 100644 index 000000000..222b3983b --- /dev/null +++ b/test/render/flex/flex-direction-row-reverse-002-visual.htm @@ -0,0 +1,42 @@ + + + + + CSS Test: flow-direction:row-reverse swaps main start and end directions + + + + + + + + +

Test passes if both the lines below are identical.

+
+ ABC +
+
+ CBA +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-direction-row-reverse-002-visual.htm.png b/test/render/flex/flex-direction-row-reverse-002-visual.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..301ee0d4435af9c4f3dfe5f70d0847da3fb6c591 GIT binary patch literal 374 zcmV-+0g3*JP)T!KKTZjI>L%f9T88}WL(X$Y4UmZa_ zEl9=#l`t0`r$w-cW1fYT + + + + CSS Flexible Box Test: flex-direction proprety - row-reverse + + + + + + + +

The test passed if you see all the cells are arranged horizontally and the order of cells are reversed.

+
+ first + second + third + forth +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-direction-row-reverse.htm.png b/test/render/flex/flex-direction-row-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a066389b54e0d244ed42d12ffc6c3e117ea7e000 GIT binary patch literal 929 zcmV;S177@zP)B}USF-fKI&bJ;cvU*+Z7 zd@J#E)-wv%ve>MN%FlEBX+3#2+8IoakZtEg@{zpkOvHLF6FJEl70H*3FeftTyIG_^ zy}OD;Dmh!)GQ{qQFK%TyrH_0`#D%q&-%GNhkt|z!rAIPK+6C*|1$p9#rk2F+0$0@D z*yLzkjq2Ci=?r#SFOH0Gz9OFNxA3Iy{KijwX}@hPd6u`f*ZFQmte;z*l>U;@Sxj`1 zTgz>uqHHbxQOM^_6^rf7LL*}nEzj)?1|!UglwnS!3}+(lbC@y&9Y*ef+f$LC8^lDc zip8FbgeJNZ`C^2DNR%z)WWn1>%RzurrwI^J7?>{>o$}(yPLSgv?8PxO@z7? zq27vgxsufr8ICYq5!d{gb&Ke1dksWv)18XwJ73!4TY*y%tJRA5Ns%tMtCNq6@Es!l z5)rya#4iw$<;wIV$?R+ic6#WkrQ5B4?&zr!xL>m@TY9BO&llbh79+#S?r*d8?Bj~E ziCH386+MSEs$WksrIlx$!51UUKqFs)8}K*$@AW*j$byBOU^@G@+5r48-}Q$Fk>4k> z)30nvd~d$L4@z|8<>I?Otv#Qs35`g2bP;kfc#47e3(M^zi;(jqE#KUOi{#r+k!-v6 zjII_bDc|zRy)$jKbu|hvD@?NhfQr}gi zzN^UIRqpj=<6d1gIl;X|yd7T(HzVQ-uE;g{-;~I{skWII_reu9R+~SvBE{^A6o=!V zxww7B^_pvLYe}^`ZY>_TSS(U36FDvuDef&&Ef%R}<9Jgo7O84iB`Z>k#$u7WNLysH zhDhyR`3td`o1jFzapcUYC8waCT2(Q5YVo*S?dYn*c)iO+>S;b!jDrY7QV>ZQh@=KY zQUfBX0g=>zNNPYNH6W52PbLzd00#g7000000ITsA$33yL2$kNU00000NkvXXu0mjf Dpdhjc literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-direction.htm b/test/render/flex/flex-direction.htm new file mode 100644 index 000000000..f69174012 --- /dev/null +++ b/test/render/flex/flex-direction.htm @@ -0,0 +1,58 @@ + + + + +CSS Test: flex flow direction + + + + + + + +

flex-direction:row

+
1
2
3
+ +

flex-direction:row-reverse

+
1
2
3
+ +

flex-direction:column

+
1
2
3
+ +

flex-direction:column-reverse

+
1
2
3
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-direction.htm.png b/test/render/flex/flex-direction.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b5bdb27a0fe8932286b46dbf2f2ed3980ad6a82f GIT binary patch literal 2837 zcmb`Idpy(oAIIl5ms&P*DIK=2b#uy!lO=birW~CpMY3Gu9Q0@$Og5>hiH_|!%q@q^vnT#AWx8rtLZ5Z~O?w5am??1lZ_xJsMf8L+h`}2N29-rjz+zvoA zHfn%CAczYV;|>BT!9gJ9wTepeh&E4Wul%+4JJ+MmGMP;7nwy(XPfvTht@{TA(r9wQ zI2?^tn9TULD|au{-mlPj%(hj)udvT3P7_E2)1Sl-r~l@Xk#b~0RoVEkS;mGws^s>z zL;a^E=I(b^>%XxJ5YpsBe)D3Xd0iHSXIpZ0#RLcrSs!~47IThfBkoUH*$%L;TsOqT z%{Z00z*AL2LEZBXg57$i$vXooM#2v*odV{(G|Zfv7Ufa8^W0urk2w=eYuE1`Ym4C% zUBS!%x?s>G*QWnWHQ^Xgs6Ujt#4p{IoHQ4>Y1Em)l`JqllCdrZu;Ut2nc|arEMdFe zDWHEZ`w`H!jA1<41{m~}#908d5X9V1#X2FTW%0WCF36e7q7hSS{2rx@14NOeQy*TImZ)u~;-C6|KIOmc(l!qt0BRv9b3pf?E2lB53{f5V3wR@a9n9oJJmgyW}F0c|^t+ZRj6!Tvgn*$X1MYT^K98^l4)+d@i2t9WU z_Mr{z{C!b`-o%xTNq-9;X_m?29ZFW=k$<*3_cc3%5_cIg z6iy7OCb#(1Agfc`b5NbnMDt!Y30ai*%!{tD`y^^CH;88aQ|B*BfP4GUnO94GhuZd; z?@+0&d_L7v99z>Gd{~kl&ayr(|GB*62h5@N8Ox$gT>S?}1CE%XfFM>|%jldnDXmHH z@MPu-Kft|fe^Z7dPh3Z7LeoVfhqTUF!6aK~5t{-+VB;j9s|7|fAI%Q%j_dVhb#W0(=#{Sj3$~!)dX~O9h8GHpi8q0)EQ6H zqkY?}OL$B=cD3d~nP<|2sG4T6hf&@kTdtk0CyZb*S@n`QY;S%0hlL{#+5jLRdAQu1 z+?FJ#BC?9Y4Pf16^?k$btwJW`VR0Ih{x`iaNJG;NYZqAUUFifa{hFz}1CluKbBwG( z?Ze53%}0B`1LnhU-cls992mX2$LB!8Qe*oU)4k!*G;k7l!Yko0jtdD5RTx7L5245e z@V&>eMmvvGQv}6(5-cQ~rM=fVDQJ8hg(D(a(DZVN-xnBfR(m|XLE?U>W=L9FK=%sD_ z;lcC}b!ZI(v#%QQ>sZrGyBP&X{Z_O2=Qp06cW~ssx3GH)_?#ActtjdsD$>c;cXayf zZt?zK_8drLgq}&1sk^9g^f%4*{+A{h^Ieb45xKRmvFwcWod9!&O2hs^w0mUZI){t6 z{VlI@BEO>la3#8YD`P2~`V`)1ow4xBC+X?za!xccDQqH29=H@MfD!he-^oVpz~#&2mo-)RI;JO4*HGO(rg0WAJQ`z!XA}&~4yGF# z!GlOdILmr3&WK{HV1{!mwXthG`h1=cacd|(m9Xm>?;6CNJy9ENqkxZC!@Vxgw>1iq zhx^agoB4Kzi>@Pr-<$a9Oyd@ECe+(8M7?nH2gfsnGgX-OV$FI0LxCd3$d9xf52@`$ zRFWSpf~gWXwR0PFvj&n|wi!dAo>lZ3fm3s!2uJd7@6+Boj!x^czbO9Yc5fp(8}aAI ziX@6jYA^t!wr_R2w{-+gnM^o!0wAl@CMEh5*}u4CZ=0Z!xZ_B^F>f2yE)vSw*@}Lx zmGgeh8>h^MgV25_{&RVs<;oj$bc)a3a+@4NG8C$$#Ti$jL%xt+2}59^IaBJ|4lx(sU^iyQIZ`qJME<(l>M4%`3;%8 zzE;FF`eS|R!J~h59%kX5nSHf3I}OqpxvX?U7g}}UmI`Jk{CkBXYbf6KPZe)u9#@0C zw+!|VXm)!~(AZzWcMsp2>WRM^Yw_2}q>9$%>*^$^783s0GVr8~9+{V~ht+>_J!cDk zL(4ZjMJ)eP{~ttsRfA4xR~vg|Dvnzm!M{)BpP7!kdu>$mtae>e&-qJa@OaCgY!OSN zlrP#nHLtNPnc?rjjPJ7k2n2gIUIM1ENip1I$+h! zo+1*+#O;IETqB=ar*y}yuWktrK!r_U5ZbGwz07M$Og zI?`u6wfUEtAV?B|QRgdqWLDeh&@BzdvH}|v{n4?w6}A#m=2$>x1kiDoC}4QT+Dho| zSyhB8dpccwtRSi2LFMG*UeqY|Ywv_q0nB~oa)QQv)R{yd7T6y>Vk-=2o2jMNES3yu zXtgQrL|IO#j*1iYW8l&GQ3Dx~OjQBxPIqjTPEbBMoPXj}=;fDJLj!IVq(J=n1e_H~ zN&QC!^|sqV1$MglQ0>XNf6bi2tn0(%8M!DMeuuPm-Uw>d4Il11C5^WRJ7V6O=5l=R z=YxDb+u@CP+^cA@aw14UQJE68I^cIRmr=)?)rA%ck1zJs+rOyqGmap^&`>nG&VZ7u z>JL$a!tEd1hTyaIY!I|n5UEwqs zFH$7@s7R0vDw`1qKlMGdCtY)c$DkTkS6#q@KOt0JS`7cc$sj6m?r3xB^f*El!AO^) zqA~}a=vt(Wg{V=D5e@tTrHvqvKG<*N)BqUQd-{UrhSJ^c0Sq?w8f~NTp8emaK6Ood n82ItG{_BL`AC={IW{73a-_avBQyx*P7pRM~8>Zax^u_-HylDMf literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-flow-001.htm b/test/render/flex/flex-flow-001.htm new file mode 100644 index 000000000..909e04b6a --- /dev/null +++ b/test/render/flex/flex-flow-001.htm @@ -0,0 +1,39 @@ + + + + +CSS Flexbox Test: flex-flow - row nowrap + + + + + + + + + + +

Test passes if there is a filled green rectangle whose width is greater than height + and the number within rectangle is '1 2 3 4' from left to right.

+
+
1
+
2
+
3
+
4
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-flow-001.htm.png b/test/render/flex/flex-flow-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a155a6b97d6a6873ad52d51088d12c3667fa5c5e GIT binary patch literal 1079 zcmV-71jze|P)00009P)t-s|Ns90 z0001h07cR<761SP=}AOERCodHm0^HW zWSunG_KWd;dOb<7KtfLdF_}yzlgVTHWpLKK@Lp3|!XVgX3a9bd*3)@cYfO(SlyCCxjAZqK~+Me%%z-KG! zHi-T{2ofm7#Fj*8@x$NP7HWfaVH+&4qm{_Xis;A?(I0r^G?kWocmrZI`5al=h=QnV zyww}?lo?Atb+kq-{rE-P;w2#Dm6`m+Eq=T%YF-h~4(P+k^?hrqJRCa55Z@lw=HDC@R@q%tA*=Qg(}Plhz$ zr_&+sHHgL&AGX1>B$`(`RuF1d1d$4edg+SD@zbtJwimWfvm#ifTyJ`ivR!n9g5aqj z@KX?pdj&F8Zz%xRAT(`*=t|}lnSLFJ-w6cu0GA)CLaiB2w%g2$9*Cq?IjtUYM!1)s zQnk>}qXY!4nQNcyd#Nwz(W-$Jv9wgjw3=akTw^8BS|F7vF;$nICeE{Lcpe`|2eor-J+#9-MW!Lh3 zfKoU$Bj@NEU-Z-Zwlm1wfgo9}@BA8Jb=~?ndEXI4Zp*9pt?d&U5M7IVAka%e$h#Bn zb9_(J!uPA*!no&g>toyCM$K4WKTfK9B8-P0Mj{Gq@L3|f)bcVA*;@RKe>!oC(KuQB zs*S(v`T&eSUO=3TUv!KwE242=kw~x7(t$*Pa55oogOpXF3=(gE#JxdiN)aHGS0qK< zHuW4RNXln~R*)215ZWIEPX!?b@C5`7%IBm9q4ltj1LALk(9<9Y%ac->`a zGMP*!lgVTy-+j|3Y86V{Q z5XgCakT&;j2Yt36e;y3v(zcs3^6}TfK-xuUUoHnY>>bG4Es%69kRIy&Smn1(u{|P( z13CY3V+S4WLi~JMduMDQ24WxvVjv^QKt_{+j3xsaO$IWW3}iGJ$Y?T<(PSW_$v{Sv xfs7^t8BGQYxAs002ovPDHLkV1l^w_U-@x literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-flow-002.htm b/test/render/flex/flex-flow-002.htm new file mode 100644 index 000000000..2eb583107 --- /dev/null +++ b/test/render/flex/flex-flow-002.htm @@ -0,0 +1,40 @@ + + + + +CSS Flexbox Test: flex-flow - row wrap + + + + + + + + + + +

Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' + from left to right, top to bottom.

+
+
1
+
2
+
3
+
4
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-flow-002.htm.png b/test/render/flex/flex-flow-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..dd3f391cdd1b27a75dc325780268eb860a80ee8c GIT binary patch literal 1024 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZV)fKQ0)|NsAiOoj#q*Gq4{VMW5vVK?0s-JhBd|(lrX~Xra^kb~jtZQYF&uiLGgw=B=t14M9 z6O_#C>3pp|N&Vjkee=o-CZ2OGe1lYC=L!AXqZC!tGs(WlvrOY|nXD zCja?qX}@!4oA%0|;odv5SI@G0YE%@U`DE?U{o8fV)~@d8_-LNf{XyoAXlH10<<>Bz zLRBNTwTi{NI*za_8Qr}sJMmJGZcte3HKk5*f7cYvO6w;_V_bw@FI_P^V70j5xr+}A z_Sy9>@rr7mB|347>yjtk9bYzxWkz4x7kcRYZ>6>8JJtjV7FJe!Zp?B`DcdsfLf3_w z4_l6GnrZShEJe?Fd(_&F-J)RSDlZHp+9%EzyJ-2hizBzwBS+F?n@g{vkZH}mJm)@{ zDaljkKc2+XQv5S`(X=P0!!DQ=?YWrko%LLIiuuwhr#8k%Uk$b_yfaBI#kf+A{rEa- z-OT&9s%IrXPkT`>b5LGDZqMBZ_P5{t{wXP#9-fk;Z5Pkdu>VxSUin(So_$?9Qd?_< zbHBv*wf^^D`BgXV;ET|$-h#44>PnrPFr#G<)0k4C%jIz?Gc?@=8F~n?d~~y z!&(fM2tTMz*PUm(Azr)a-{zjbbF9QHLzR}_dUccex5n|k9aoa~zj1qV<)dV#OWb#* zPn(1%x`Cv+PON;+{qcvt>LjbaD3E@G4u>Ng0vp*})-VcYI~OQeCd7`)Or~Kne%U|`(`Tsg%N!-NX^X+>DJ!QL1+V?&ez1e#rPw&WSvGZ~g tE(%F39TCh**BUxZ6_R)fGeH?{_rv-I!Tc!QLWvv@*VEO{Wt~$(698{M%CP_d literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-flow-003.htm b/test/render/flex/flex-flow-003.htm new file mode 100644 index 000000000..7a9066a04 --- /dev/null +++ b/test/render/flex/flex-flow-003.htm @@ -0,0 +1,41 @@ + + + + +CSS Flexbox Test: flex-flow - row wrap-reverse + + + + + + + + + + +

Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' + from left to right, top to bottom.

+
+
3
+
4
+
1
+
2
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-flow-003.htm.png b/test/render/flex/flex-flow-003.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..dd3f391cdd1b27a75dc325780268eb860a80ee8c GIT binary patch literal 1024 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZV)fKQ0)|NsAiOoj#q*Gq4{VMW5vVK?0s-JhBd|(lrX~Xra^kb~jtZQYF&uiLGgw=B=t14M9 z6O_#C>3pp|N&Vjkee=o-CZ2OGe1lYC=L!AXqZC!tGs(WlvrOY|nXD zCja?qX}@!4oA%0|;odv5SI@G0YE%@U`DE?U{o8fV)~@d8_-LNf{XyoAXlH10<<>Bz zLRBNTwTi{NI*za_8Qr}sJMmJGZcte3HKk5*f7cYvO6w;_V_bw@FI_P^V70j5xr+}A z_Sy9>@rr7mB|347>yjtk9bYzxWkz4x7kcRYZ>6>8JJtjV7FJe!Zp?B`DcdsfLf3_w z4_l6GnrZShEJe?Fd(_&F-J)RSDlZHp+9%EzyJ-2hizBzwBS+F?n@g{vkZH}mJm)@{ zDaljkKc2+XQv5S`(X=P0!!DQ=?YWrko%LLIiuuwhr#8k%Uk$b_yfaBI#kf+A{rEa- z-OT&9s%IrXPkT`>b5LGDZqMBZ_P5{t{wXP#9-fk;Z5Pkdu>VxSUin(So_$?9Qd?_< zbHBv*wf^^D`BgXV;ET|$-h#44>PnrPFr#G<)0k4C%jIz?Gc?@=8F~n?d~~y z!&(fM2tTMz*PUm(Azr)a-{zjbbF9QHLzR}_dUccex5n|k9aoa~zj1qV<)dV#OWb#* zPn(1%x`Cv+PON;+{qcvt>LjbaD3E@G4u>Ng0vp*})-VcYI~OQeCd7`)Or~Kne%U|`(`Tsg%N!-NX^X+>DJ!QL1+V?&ez1e#rPw&WSvGZ~g tE(%F39TCh**BUxZ6_R)fGeH?{_rv-I!Tc!QLWvv@*VEO{Wt~$(698{M%CP_d literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-flow-005.htm b/test/render/flex/flex-flow-005.htm new file mode 100644 index 000000000..51f6c6f14 --- /dev/null +++ b/test/render/flex/flex-flow-005.htm @@ -0,0 +1,41 @@ + + + + +CSS Flexbox Test: flex-flow - row-reverse wrap + + + + + + + + + + +

Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' + from left to right, top to bottom.

+
+
2
+
1
+
4
+
3
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-flow-005.htm.png b/test/render/flex/flex-flow-005.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..dd3f391cdd1b27a75dc325780268eb860a80ee8c GIT binary patch literal 1024 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZV)fKQ0)|NsAiOoj#q*Gq4{VMW5vVK?0s-JhBd|(lrX~Xra^kb~jtZQYF&uiLGgw=B=t14M9 z6O_#C>3pp|N&Vjkee=o-CZ2OGe1lYC=L!AXqZC!tGs(WlvrOY|nXD zCja?qX}@!4oA%0|;odv5SI@G0YE%@U`DE?U{o8fV)~@d8_-LNf{XyoAXlH10<<>Bz zLRBNTwTi{NI*za_8Qr}sJMmJGZcte3HKk5*f7cYvO6w;_V_bw@FI_P^V70j5xr+}A z_Sy9>@rr7mB|347>yjtk9bYzxWkz4x7kcRYZ>6>8JJtjV7FJe!Zp?B`DcdsfLf3_w z4_l6GnrZShEJe?Fd(_&F-J)RSDlZHp+9%EzyJ-2hizBzwBS+F?n@g{vkZH}mJm)@{ zDaljkKc2+XQv5S`(X=P0!!DQ=?YWrko%LLIiuuwhr#8k%Uk$b_yfaBI#kf+A{rEa- z-OT&9s%IrXPkT`>b5LGDZqMBZ_P5{t{wXP#9-fk;Z5Pkdu>VxSUin(So_$?9Qd?_< zbHBv*wf^^D`BgXV;ET|$-h#44>PnrPFr#G<)0k4C%jIz?Gc?@=8F~n?d~~y z!&(fM2tTMz*PUm(Azr)a-{zjbbF9QHLzR}_dUccex5n|k9aoa~zj1qV<)dV#OWb#* zPn(1%x`Cv+PON;+{qcvt>LjbaD3E@G4u>Ng0vp*})-VcYI~OQeCd7`)Or~Kne%U|`(`Tsg%N!-NX^X+>DJ!QL1+V?&ez1e#rPw&WSvGZ~g tE(%F39TCh**BUxZ6_R)fGeH?{_rv-I!Tc!QLWvv@*VEO{Wt~$(698{M%CP_d literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-flow-006.htm b/test/render/flex/flex-flow-006.htm new file mode 100644 index 000000000..8ecbb9761 --- /dev/null +++ b/test/render/flex/flex-flow-006.htm @@ -0,0 +1,41 @@ + + + + +CSS Flexbox Test: flex-flow - row-reverse wrap-reverse + + + + + + + + + + +

Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' + from left to right, top to bottom.

+
+
4
+
3
+
2
+
1
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-flow-006.htm.png b/test/render/flex/flex-flow-006.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..dd3f391cdd1b27a75dc325780268eb860a80ee8c GIT binary patch literal 1024 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZV)fKQ0)|NsAiOoj#q*Gq4{VMW5vVK?0s-JhBd|(lrX~Xra^kb~jtZQYF&uiLGgw=B=t14M9 z6O_#C>3pp|N&Vjkee=o-CZ2OGe1lYC=L!AXqZC!tGs(WlvrOY|nXD zCja?qX}@!4oA%0|;odv5SI@G0YE%@U`DE?U{o8fV)~@d8_-LNf{XyoAXlH10<<>Bz zLRBNTwTi{NI*za_8Qr}sJMmJGZcte3HKk5*f7cYvO6w;_V_bw@FI_P^V70j5xr+}A z_Sy9>@rr7mB|347>yjtk9bYzxWkz4x7kcRYZ>6>8JJtjV7FJe!Zp?B`DcdsfLf3_w z4_l6GnrZShEJe?Fd(_&F-J)RSDlZHp+9%EzyJ-2hizBzwBS+F?n@g{vkZH}mJm)@{ zDaljkKc2+XQv5S`(X=P0!!DQ=?YWrko%LLIiuuwhr#8k%Uk$b_yfaBI#kf+A{rEa- z-OT&9s%IrXPkT`>b5LGDZqMBZ_P5{t{wXP#9-fk;Z5Pkdu>VxSUin(So_$?9Qd?_< zbHBv*wf^^D`BgXV;ET|$-h#44>PnrPFr#G<)0k4C%jIz?Gc?@=8F~n?d~~y z!&(fM2tTMz*PUm(Azr)a-{zjbbF9QHLzR}_dUccex5n|k9aoa~zj1qV<)dV#OWb#* zPn(1%x`Cv+PON;+{qcvt>LjbaD3E@G4u>Ng0vp*})-VcYI~OQeCd7`)Or~Kne%U|`(`Tsg%N!-NX^X+>DJ!QL1+V?&ez1e#rPw&WSvGZ~g tE(%F39TCh**BUxZ6_R)fGeH?{_rv-I!Tc!QLWvv@*VEO{Wt~$(698{M%CP_d literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-flow-008.htm b/test/render/flex/flex-flow-008.htm new file mode 100644 index 000000000..c1e8c7db2 --- /dev/null +++ b/test/render/flex/flex-flow-008.htm @@ -0,0 +1,41 @@ + + + + +CSS Flexbox Test: flex-flow - column wrap + + + + + + + + + + +

Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' + from left to right, top to bottom.

+
+
1
+
3
+
2
+
4
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-flow-008.htm.png b/test/render/flex/flex-flow-008.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..dd3f391cdd1b27a75dc325780268eb860a80ee8c GIT binary patch literal 1024 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZV)fKQ0)|NsAiOoj#q*Gq4{VMW5vVK?0s-JhBd|(lrX~Xra^kb~jtZQYF&uiLGgw=B=t14M9 z6O_#C>3pp|N&Vjkee=o-CZ2OGe1lYC=L!AXqZC!tGs(WlvrOY|nXD zCja?qX}@!4oA%0|;odv5SI@G0YE%@U`DE?U{o8fV)~@d8_-LNf{XyoAXlH10<<>Bz zLRBNTwTi{NI*za_8Qr}sJMmJGZcte3HKk5*f7cYvO6w;_V_bw@FI_P^V70j5xr+}A z_Sy9>@rr7mB|347>yjtk9bYzxWkz4x7kcRYZ>6>8JJtjV7FJe!Zp?B`DcdsfLf3_w z4_l6GnrZShEJe?Fd(_&F-J)RSDlZHp+9%EzyJ-2hizBzwBS+F?n@g{vkZH}mJm)@{ zDaljkKc2+XQv5S`(X=P0!!DQ=?YWrko%LLIiuuwhr#8k%Uk$b_yfaBI#kf+A{rEa- z-OT&9s%IrXPkT`>b5LGDZqMBZ_P5{t{wXP#9-fk;Z5Pkdu>VxSUin(So_$?9Qd?_< zbHBv*wf^^D`BgXV;ET|$-h#44>PnrPFr#G<)0k4C%jIz?Gc?@=8F~n?d~~y z!&(fM2tTMz*PUm(Azr)a-{zjbbF9QHLzR}_dUccex5n|k9aoa~zj1qV<)dV#OWb#* zPn(1%x`Cv+PON;+{qcvt>LjbaD3E@G4u>Ng0vp*})-VcYI~OQeCd7`)Or~Kne%U|`(`Tsg%N!-NX^X+>DJ!QL1+V?&ez1e#rPw&WSvGZ~g tE(%F39TCh**BUxZ6_R)fGeH?{_rv-I!Tc!QLWvv@*VEO{Wt~$(698{M%CP_d literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-flow-009.htm b/test/render/flex/flex-flow-009.htm new file mode 100644 index 000000000..5aa71c010 --- /dev/null +++ b/test/render/flex/flex-flow-009.htm @@ -0,0 +1,41 @@ + + + + +CSS Flexbox Test: flex-flow - column wrap-reverse + + + + + + + + + + +

Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' + from left to right, top to bottom.

+
+
2
+
4
+
1
+
3
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-flow-009.htm.png b/test/render/flex/flex-flow-009.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..dd3f391cdd1b27a75dc325780268eb860a80ee8c GIT binary patch literal 1024 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZV)fKQ0)|NsAiOoj#q*Gq4{VMW5vVK?0s-JhBd|(lrX~Xra^kb~jtZQYF&uiLGgw=B=t14M9 z6O_#C>3pp|N&Vjkee=o-CZ2OGe1lYC=L!AXqZC!tGs(WlvrOY|nXD zCja?qX}@!4oA%0|;odv5SI@G0YE%@U`DE?U{o8fV)~@d8_-LNf{XyoAXlH10<<>Bz zLRBNTwTi{NI*za_8Qr}sJMmJGZcte3HKk5*f7cYvO6w;_V_bw@FI_P^V70j5xr+}A z_Sy9>@rr7mB|347>yjtk9bYzxWkz4x7kcRYZ>6>8JJtjV7FJe!Zp?B`DcdsfLf3_w z4_l6GnrZShEJe?Fd(_&F-J)RSDlZHp+9%EzyJ-2hizBzwBS+F?n@g{vkZH}mJm)@{ zDaljkKc2+XQv5S`(X=P0!!DQ=?YWrko%LLIiuuwhr#8k%Uk$b_yfaBI#kf+A{rEa- z-OT&9s%IrXPkT`>b5LGDZqMBZ_P5{t{wXP#9-fk;Z5Pkdu>VxSUin(So_$?9Qd?_< zbHBv*wf^^D`BgXV;ET|$-h#44>PnrPFr#G<)0k4C%jIz?Gc?@=8F~n?d~~y z!&(fM2tTMz*PUm(Azr)a-{zjbbF9QHLzR}_dUccex5n|k9aoa~zj1qV<)dV#OWb#* zPn(1%x`Cv+PON;+{qcvt>LjbaD3E@G4u>Ng0vp*})-VcYI~OQeCd7`)Or~Kne%U|`(`Tsg%N!-NX^X+>DJ!QL1+V?&ez1e#rPw&WSvGZ~g tE(%F39TCh**BUxZ6_R)fGeH?{_rv-I!Tc!QLWvv@*VEO{Wt~$(698{M%CP_d literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-flow-011.htm b/test/render/flex/flex-flow-011.htm new file mode 100644 index 000000000..d8491c9fa --- /dev/null +++ b/test/render/flex/flex-flow-011.htm @@ -0,0 +1,41 @@ + + + + +CSS Flexbox Test: flex-flow - column-reverse wrap + + + + + + + + + + +

Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' + from left to right, top to bottom.

+
+
3
+
1
+
4
+
2
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-flow-011.htm.png b/test/render/flex/flex-flow-011.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..dd3f391cdd1b27a75dc325780268eb860a80ee8c GIT binary patch literal 1024 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZV)fKQ0)|NsAiOoj#q*Gq4{VMW5vVK?0s-JhBd|(lrX~Xra^kb~jtZQYF&uiLGgw=B=t14M9 z6O_#C>3pp|N&Vjkee=o-CZ2OGe1lYC=L!AXqZC!tGs(WlvrOY|nXD zCja?qX}@!4oA%0|;odv5SI@G0YE%@U`DE?U{o8fV)~@d8_-LNf{XyoAXlH10<<>Bz zLRBNTwTi{NI*za_8Qr}sJMmJGZcte3HKk5*f7cYvO6w;_V_bw@FI_P^V70j5xr+}A z_Sy9>@rr7mB|347>yjtk9bYzxWkz4x7kcRYZ>6>8JJtjV7FJe!Zp?B`DcdsfLf3_w z4_l6GnrZShEJe?Fd(_&F-J)RSDlZHp+9%EzyJ-2hizBzwBS+F?n@g{vkZH}mJm)@{ zDaljkKc2+XQv5S`(X=P0!!DQ=?YWrko%LLIiuuwhr#8k%Uk$b_yfaBI#kf+A{rEa- z-OT&9s%IrXPkT`>b5LGDZqMBZ_P5{t{wXP#9-fk;Z5Pkdu>VxSUin(So_$?9Qd?_< zbHBv*wf^^D`BgXV;ET|$-h#44>PnrPFr#G<)0k4C%jIz?Gc?@=8F~n?d~~y z!&(fM2tTMz*PUm(Azr)a-{zjbbF9QHLzR}_dUccex5n|k9aoa~zj1qV<)dV#OWb#* zPn(1%x`Cv+PON;+{qcvt>LjbaD3E@G4u>Ng0vp*})-VcYI~OQeCd7`)Or~Kne%U|`(`Tsg%N!-NX^X+>DJ!QL1+V?&ez1e#rPw&WSvGZ~g tE(%F39TCh**BUxZ6_R)fGeH?{_rv-I!Tc!QLWvv@*VEO{Wt~$(698{M%CP_d literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-flow-012.htm b/test/render/flex/flex-flow-012.htm new file mode 100644 index 000000000..412310a46 --- /dev/null +++ b/test/render/flex/flex-flow-012.htm @@ -0,0 +1,41 @@ + + + + +CSS Flexbox Test: flex-flow - column-reverse wrap-reverse + + + + + + + + + + +

Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' + from left to right, top to bottom.

+
+
4
+
2
+
3
+
1
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-flow-012.htm.png b/test/render/flex/flex-flow-012.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..dd3f391cdd1b27a75dc325780268eb860a80ee8c GIT binary patch literal 1024 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZV)fKQ0)|NsAiOoj#q*Gq4{VMW5vVK?0s-JhBd|(lrX~Xra^kb~jtZQYF&uiLGgw=B=t14M9 z6O_#C>3pp|N&Vjkee=o-CZ2OGe1lYC=L!AXqZC!tGs(WlvrOY|nXD zCja?qX}@!4oA%0|;odv5SI@G0YE%@U`DE?U{o8fV)~@d8_-LNf{XyoAXlH10<<>Bz zLRBNTwTi{NI*za_8Qr}sJMmJGZcte3HKk5*f7cYvO6w;_V_bw@FI_P^V70j5xr+}A z_Sy9>@rr7mB|347>yjtk9bYzxWkz4x7kcRYZ>6>8JJtjV7FJe!Zp?B`DcdsfLf3_w z4_l6GnrZShEJe?Fd(_&F-J)RSDlZHp+9%EzyJ-2hizBzwBS+F?n@g{vkZH}mJm)@{ zDaljkKc2+XQv5S`(X=P0!!DQ=?YWrko%LLIiuuwhr#8k%Uk$b_yfaBI#kf+A{rEa- z-OT&9s%IrXPkT`>b5LGDZqMBZ_P5{t{wXP#9-fk;Z5Pkdu>VxSUin(So_$?9Qd?_< zbHBv*wf^^D`BgXV;ET|$-h#44>PnrPFr#G<)0k4C%jIz?Gc?@=8F~n?d~~y z!&(fM2tTMz*PUm(Azr)a-{zjbbF9QHLzR}_dUccex5n|k9aoa~zj1qV<)dV#OWb#* zPn(1%x`Cv+PON;+{qcvt>LjbaD3E@G4u>Ng0vp*})-VcYI~OQeCd7`)Or~Kne%U|`(`Tsg%N!-NX^X+>DJ!QL1+V?&ez1e#rPw&WSvGZ~g tE(%F39TCh**BUxZ6_R)fGeH?{_rv-I!Tc!QLWvv@*VEO{Wt~$(698{M%CP_d literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-grow-003.htm b/test/render/flex/flex-grow-003.htm new file mode 100644 index 000000000..aabafd877 --- /dev/null +++ b/test/render/flex/flex-grow-003.htm @@ -0,0 +1,49 @@ + + + + +CSS Flexbox Test: flex-grow - negative number + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-grow-003.htm.png b/test/render/flex/flex-grow-003.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + + +CSS Flexbox Test: flex-grow - (invalid when no space distributed) + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-grow-004.htm.png b/test/render/flex/flex-grow-004.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + + +CSS Flexbox Test: flex-grow - (invalid when applied to flex container) + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-grow-005.htm.png b/test/render/flex/flex-grow-005.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + + +CSS Flexbox Test: flex-grow - positive number(fill all space) + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-grow-006.htm.png b/test/render/flex/flex-grow-006.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bced80d6a35bdda2709474e8fec673dced029027 GIT binary patch literal 586 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FNfKQ0)|NsAiOoj#qAocxI zn-K#8<4;c)$B+ufw^Q@;?kEVj-{jxNcqhHzL1jmZ{>8;xKOc{~eKR!Lwe(Z)mwBq) za~a#&7ke^-%wS-+G2`<6)4_kr_Vf0CcYb0hwf%QeKkw`K{|PPN{QP3}QJY7F@@MxQ>3wp>%;tX1vi{pI zN~0ed&VP7c<7w{SPpL|Kzgawv>+XHC@%zFpS?ezs+ZEehUc1HS`D>f~eaRu$L{qzu zS*O=_b+e|#-iGyKct-ikN3q&EuPaPgWlefs%_Zhz)%*1fX1V}5<*nH$}j%IB3{&v~!7 z$^0Ytu4`|$ztL6RJ>~oSrS6k^<*qCa*UgSE5cFSwi;9nSy+{a53Y=n> z9iz7Cvi+_PoBstXeCprw`OtcCNT4En>gTe~DWM4fO$ihy literal 0 HcmV?d00001 diff --git a/test/render/flex/flex-margin-no-collapse.htm b/test/render/flex/flex-margin-no-collapse.htm new file mode 100644 index 000000000..93e204bda --- /dev/null +++ b/test/render/flex/flex-margin-no-collapse.htm @@ -0,0 +1,58 @@ + + + + + CSS Flexible Box Test: flex item margins + + + + + + + + +

The test passes if there are two green boxes and no red.

+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flex-margin-no-collapse.htm.png b/test/render/flex/flex-margin-no-collapse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..7748b717ced9102d08b87d9c443eeca1e618be12 GIT binary patch literal 754 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU}9ln28zrHS(Fc?I0Jk_T>t<74`eblFt}ba z6a%VQ;_2cTQo;D-jt5Mn+ zi$7-$umH8U=W5sfE~&EJ9iyKutzSO>j=c3(UGtI z=dVA#Yww=b^bHD zw9=gU%bx#rxi0VY%qZ_Bm`|}BftnuqS=Km}{VeyE$ zbxQ5CY{luXot=LPtva2kJ^ka9$m7AQY}@B~aqqm68aUtma)noK?(D+b`TnbK2WLw^ z{+jptdrWl3+ZkUQ6~CW~R<|iS$nmp#!qc-)K|zlN+^PBbjXVDT_nDl6lN>#y6f;|v z2u^aNIfDt+DK%R6Z_iIwW>8>gXx#gkJz(}FmaM{m>K-6f4>Xfy&)iOR>oJj7X&98e q + + + + + CSS Flexible Box Test: Minimum height of flex items + + + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-minimum-height-flex-items-001.htm.png b/test/render/flex/flex-minimum-height-flex-items-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + + + + CSS Flexible Box Test: Minimum height of flex items + + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-minimum-height-flex-items-002.htm.png b/test/render/flex/flex-minimum-height-flex-items-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..6b9fa9aa31302d67e580cbd9f577ad15a5ce177f GIT binary patch literal 610 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU}Ruo28x*J{(1tWI0Jk_T>t<74`eblFt}ba z6k}ju67h6#45?szdo@4rk%i3hhaZ}xRlYyukkj1xWM0wV%?llF|6QDwx!<}&=e+crw}tN;IZ=G8NkO@FQKzv|I@{o=)Qk9*G;Z{PcD zdtI7resy$y_?3vcf%`Y=>|eM4&!!36wteimz3a>3e=qOzduQjq4lFKx_I2jHX<=ut zmYUYv%DJEZ+V#}TYTxt7`$CuIKU=Q&+xbLA^n0go<%+lM*00!J%zrapw&+W^opV;; zm!}5Pj@mwXQF+`>{9#3YzG7|Ky|nrBk4Mk;{M_~Ji(A&4t@%sz8>3GcO$*nZ-) + + + + + CSS Flexible Box Test: Minimum width of flex items + + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-minimum-width-flex-items-002.htm.png b/test/render/flex/flex-minimum-width-flex-items-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + + + CSS Test: flex order + + + + + + + +
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flex-order.htm.png b/test/render/flex/flex-order.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ea4d0fc25535afcae374bd2d8bbdebdf7ef367fc GIT binary patch literal 197 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKOPH8}B*V*n?Ld+zz$e7@|Ns9CK)4i0FxbR& z=YSM>x;TbZFupx+$jG3;!Q$W@b!pP12jUSD@1*W9Hq4y8=ZU%!HNk0Rh6`a{>ZQ}% SuKb<^a-OHFpUXO@geCy-ATUJ$ literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-align-items-center-nested-001.htm b/test/render/flex/flexbox-align-items-center-nested-001.htm new file mode 100644 index 000000000..7e27baa1e --- /dev/null +++ b/test/render/flex/flexbox-align-items-center-nested-001.htm @@ -0,0 +1,52 @@ + + + + +CSS Test: Flexbox nested containers with align-items: center and flexible items + + + + + +
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-align-items-center-nested-001.htm.png b/test/render/flex/flexbox-align-items-center-nested-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..3f110032deb8b81ea7abbe8b9e173fe23356d846 GIT binary patch literal 121 zcmeAS@N?(olHy`uVBq!ia0vp^Cm0wQConPtSr={geg;x(0X`wF|NsAIVEA8gzy>6u z=jq}YQo;E4q@f@K0|$%3@9Ed>{?2F625LHKc1$9<#}G< + + + + CSS Test: Testing the sizing of a stretched horizontal flex container in a vertical flex container + + + + + + + + + +
+
+
+
+
A B C
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-align-self-stretch-vert-001.htm.png b/test/render/flex/flexbox-align-self-stretch-vert-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..45101bf3acad26b0ae8b4f5bde8e210eb4d1eb82 GIT binary patch literal 144 zcmeAS@N?(olHy`uVBq!ia0vp^H-K1%i5W=Nna{ifq&Ne7LR|m<|IhFr$YI!Gns*UM zIeEG`hEy=Vy?Bt5L4n6PaQYwblKFZUHAUwryj*#q|GK-#c{9@|Ryqq5LZ+Rx7c;(g qPc=2{TU7JXuVz1)C%oQ}n;?Gg*M*+6Nx@e^rh2;ixvX + + + + CSS Test: Testing the sizing of stretched flex items in a vertical multi-line flex container + + + + + + + + +
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-align-self-stretch-vert-002.htm.png b/test/render/flex/flexbox-align-self-stretch-vert-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..6467f563a89ecad900986c700ff98708546edf88 GIT binary patch literal 146 zcmeAS@N?(olHy`uVBq!ia0vp^6+o=P#0(@oTCQyaQk(%kA+G=b{|7P|82$$byIla% zE}kxqAr*{oFKy&xP~dU7s9@3c`v%7&6TRfeQ<|=twl|p-{nOi{ + + + + CSS Test: Testing that we gracefully handle cases where two anonymous flex items become adjacent due to "order" reordering + + + + + + + +
+ a a +
x x
+ b b +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-anonymous-items-001.htm.png b/test/render/flex/flexbox-anonymous-items-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ab14f71de428adc047fb9803bba648cd516b8626 GIT binary patch literal 145 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK6&Qg8!=cBD5kM-!)5S5Qg7NL8gPaEx1Y9mQ zgjRaxCUJ_T`c}`0C^VjFy}`KR4DmFG~x4{mM^8M03W(g%b~5 uDpGpiv-YjK*R&u1kJQJqHa0Xg{JFy%I3q+dH+x$d$SzM;KbLh*2~7ZsoiptK literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-baseline-empty-001a.htm b/test/render/flex/flexbox-baseline-empty-001a.htm new file mode 100644 index 000000000..1260239c3 --- /dev/null +++ b/test/render/flex/flexbox-baseline-empty-001a.htm @@ -0,0 +1,49 @@ + + + + + CSS Test: Testing the baseline of an empty horizontal flex container + + + + + + + + + A +
+
+
+
+
+
+ + + + + diff --git a/test/render/flex/flexbox-baseline-empty-001a.htm.png b/test/render/flex/flexbox-baseline-empty-001a.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8fd3b78035c1e22588b76c903c122ba6d84d2fd1 GIT binary patch literal 180 zcmeAS@N?(olHy`uVBq!ia0vp^SAf`pi5W=#FtaNHQk(%kA+G=b|8HPu0P=cwaPI?B zX`U{QAr*{oFK^^*aNucusBq(s$|DoAe9q+soYk*=R<;Kod}YDuR#Tt+@b?a_Lv}IT z2?7TNMX&x3xpb%Y!Rj~uD`#y#FX8xh_5!WU-dD3aUxnmdKI;Vst0K;BK3;+NC literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-baseline-empty-001b.htm b/test/render/flex/flexbox-baseline-empty-001b.htm new file mode 100644 index 000000000..325751b47 --- /dev/null +++ b/test/render/flex/flexbox-baseline-empty-001b.htm @@ -0,0 +1,50 @@ + + + + + CSS Test: Testing the baseline of an empty vertical flex container + + + + + + + + + A +
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-baseline-empty-001b.htm.png b/test/render/flex/flexbox-baseline-empty-001b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8fd3b78035c1e22588b76c903c122ba6d84d2fd1 GIT binary patch literal 180 zcmeAS@N?(olHy`uVBq!ia0vp^SAf`pi5W=#FtaNHQk(%kA+G=b|8HPu0P=cwaPI?B zX`U{QAr*{oFK^^*aNucusBq(s$|DoAe9q+soYk*=R<;Kod}YDuR#Tt+@b?a_Lv}IT z2?7TNMX&x3xpb%Y!Rj~uD`#y#FX8xh_5!WU-dD3aUxnmdKI;Vst0K;BK3;+NC literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-basic-block-horiz-001.htm b/test/render/flex/flexbox-basic-block-horiz-001.htm new file mode 100644 index 000000000..86a2404aa --- /dev/null +++ b/test/render/flex/flexbox-basic-block-horiz-001.htm @@ -0,0 +1,67 @@ + + + + + + CSS Test: Testing flexbox layout algorithm property on block flex items in a horizontal flex container + + + + + + +
+
+
+
+
+
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-basic-block-horiz-001.htm.png b/test/render/flex/flexbox-basic-block-horiz-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..f2887b3f7b0d026b6be564306b22033b40492749 GIT binary patch literal 473 zcmeAS@N?(olHy`uVBq!ia0vp^w-^|hN?4eIthQYW@jyxFgRSiD|GDb0bk~WD&+^+Y$6)O zqdk6Gax_hNpdy^^a4-MC!T%GdY@e{$b@i(q|7M@JzMNqq)$6wSB3`O9>O`Po?&Bvb ze>?3bLb*xQBC(EHSLwcc zGCQ_C)E4ZA-x=F8uX^D34Bwho8PQ9ter4*b-<`heMHC+2Z?WCtUR`Vej0YwMoz_38 sn|JunK9FNJ`)u0gn>p*Z>GDjlI{U5VmGGa6nLsrRp00i_>zopr05MR}X8-^I literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-basic-block-vert-001.htm.png b/test/render/flex/flexbox-basic-block-vert-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..fa14514dfee1d2b8bcf08b8c3db5267dfa9d8a3f GIT binary patch literal 333 zcmeAS@N?(olHy`uVBq!ia0y~yVDtd8Z?P}~Nwdet{s1Y70G|-o|Ns9pF#MnJZUT`0 zzm%Z?2pAgvA2|K?!UtQRnh%~Xjv*C{Z_inC9deLpy;#V8EPTDSK)AvVM(*ti`A@&; zvT#3~Bw&&<$&xH;Fyj l)FL)ndADS^is# + + + + CSS Test: Testing page-break-before in horizontal multi-line flex containers + + + + + + + + + +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-break-request-horiz-001a.htm.png b/test/render/flex/flexbox-break-request-horiz-001a.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ae52642a0a51bc48644de53deba0cc9d06368611 GIT binary patch literal 337 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK8s%?MZj%3Y~ng z=lTNv{X5hX=K~FJh~E*Q6#DI(lXTv0qimU!OM8yJU%dB%$CI^B4ByS_w^_ckfkUZ7 zp$S2pFm)|c?KjMf`#k5FlXQ&6M6K#-Muu}9=Iyqz^Cs%vUDtUuE@QWV{I7~-wcoqm zi&rxWx(GP3Ac%?CU2j-t`#kLis%z#}4NA?|XE-4F^4W&+;=kWE3kZVMCMy1ONV#UQ z#Pa%&+AZR@{zX;x{CF-?=~oOfZDPI9%T&c(V5c(yy>TGChM~(z#L9Z>EJ;wfc)I$z JtaD0e0svswg&F_= literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-break-request-horiz-001b.htm b/test/render/flex/flexbox-break-request-horiz-001b.htm new file mode 100644 index 000000000..e921f4a03 --- /dev/null +++ b/test/render/flex/flexbox-break-request-horiz-001b.htm @@ -0,0 +1,111 @@ + + + + + CSS Test: Testing page-break-after in horizontal multi-line flex containers + + + + + + + + + +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-break-request-horiz-001b.htm.png b/test/render/flex/flexbox-break-request-horiz-001b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ae52642a0a51bc48644de53deba0cc9d06368611 GIT binary patch literal 337 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK8s%?MZj%3Y~ng z=lTNv{X5hX=K~FJh~E*Q6#DI(lXTv0qimU!OM8yJU%dB%$CI^B4ByS_w^_ckfkUZ7 zp$S2pFm)|c?KjMf`#k5FlXQ&6M6K#-Muu}9=Iyqz^Cs%vUDtUuE@QWV{I7~-wcoqm zi&rxWx(GP3Ac%?CU2j-t`#kLis%z#}4NA?|XE-4F^4W&+;=kWE3kZVMCMy1ONV#UQ z#Pa%&+AZR@{zX;x{CF-?=~oOfZDPI9%T&c(V5c(yy>TGChM~(z#L9Z>EJ;wfc)I$z JtaD0e0svswg&F_= literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-break-request-vert-001a.htm b/test/render/flex/flexbox-break-request-vert-001a.htm new file mode 100644 index 000000000..0970a7f6c --- /dev/null +++ b/test/render/flex/flexbox-break-request-vert-001a.htm @@ -0,0 +1,112 @@ + + + + + CSS Test: Testing page-break-before in vertical multi-line flex containers + + + + + + + + + +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-break-request-vert-001a.htm.png b/test/render/flex/flexbox-break-request-vert-001a.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..00d088a40a304045e369d3466f0e8e956458e8d2 GIT binary patch literal 508 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKuQ4$L$q-w@VR8+-2<2)I48Jh1wQR}rVzm6l1l2UR!p2n%n2Ub^YoiG}KB za-H8dVWuoX<8yjucArY1qr8Q zER3^OinTi)omm~4EO!6XkB;}1wPDF(xD-Rp+3a%yVwuX?#F_HHueEER1KG22Z+p1S z=d7zUT5($kG~sp27pM!@2yZ$wf108J9_tW_ZTdvM?+kaoBsJ~lM*Yw4%WJ;X-MfF_ ze*ON&|2>h|{RVTcpNIT93y{N(R=n%~A(8*T>&Kd7I>+P#?7si}H#J}Xm=4cE!9--Y@V16osCyelF{r5}E*&soN+3 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-break-request-vert-001b.htm b/test/render/flex/flexbox-break-request-vert-001b.htm new file mode 100644 index 000000000..ca87ef6e7 --- /dev/null +++ b/test/render/flex/flexbox-break-request-vert-001b.htm @@ -0,0 +1,112 @@ + + + + + CSS Test: Testing page-break-after in vertical multi-line flex containers + + + + + + + + + +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-break-request-vert-001b.htm.png b/test/render/flex/flexbox-break-request-vert-001b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..00d088a40a304045e369d3466f0e8e956458e8d2 GIT binary patch literal 508 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKuQ4$L$q-w@VR8+-2<2)I48Jh1wQR}rVzm6l1l2UR!p2n%n2Ub^YoiG}KB za-H8dVWuoX<8yjucArY1qr8Q zER3^OinTi)omm~4EO!6XkB;}1wPDF(xD-Rp+3a%yVwuX?#F_HHueEER1KG22Z+p1S z=d7zUT5($kG~sp27pM!@2yZ$wf108J9_tW_ZTdvM?+kaoBsJ~lM*Yw4%WJ;X-MfF_ ze*ON&|2>h|{RVTcpNIT93y{N(R=n%~A(8*T>&Kd7I>+P#?7si}H#J}Xm=4cE!9--Y@V16osCyelF{r5}E*&soN+3 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-flex-direction-column-reverse.htm b/test/render/flex/flexbox-flex-direction-column-reverse.htm new file mode 100644 index 000000000..c7bff4e66 --- /dev/null +++ b/test/render/flex/flexbox-flex-direction-column-reverse.htm @@ -0,0 +1,61 @@ + + + + + CSS Flexbox Test: Flex-direction = column-reverse + + + + + + + + + +

The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.

+
+
7
4
1
+
8
5
2
+
9
6
3
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-flex-direction-column-reverse.htm.png b/test/render/flex/flexbox-flex-direction-column-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a23260e43b77514b178d88ecc1f3458c90a0b179 GIT binary patch literal 1202 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK4=^zU$;M6Zp8zSI0G|-o|Ns93nMP-g7#bK3 zN+~>GU|>n~ba4!+V0=3@FmJV$K%1lB`8_kfns^teY(AOy$n8|yriNF~&b&X^Ho-)F zi{)2`|Le01`evSKe_QCvq1Yne1SC{`-8-Ib{Busw`_~P1_Afoxo_qcO!s|z-Hs5z! z&b!>varwknzOyR)HII+4xzpV6^^Jxt|V8V|n>tu63zf^iB?g1|6!fS zjE*DQAE$Wu*q?DZQK11H9r?a5&4U1eyvzFzcYa_pppxXTBECamn? z&J=m+%CEeUp>6NOSv!tSe6*Fr?No)1^?I)t7rCapn8eKzTpJf4k$%MAbH$Rs=c>C;E&&y?T>$fXeEzk7K=+C=mqg;7LD`em0 z5juI-(vOdV9lbXknecof^QO+$@O|I;Y&U+ht-Qha!*#LpyN7?DtovD)Bds(wcVgbR z6L0=SE8P{pr>(et$i{i0)&|6laey1CcO_2y?JyX~=lQC;?U`@OG)K6~32fBSy;DuZ(u<8`|; zuDc9GIn9+0&N`89{7BtcX;!HI=@s{q12gTb!qgwB=ALN{(KYY-@na67ow(!7TE8dD z6s9lWi&|K4H7bOCODIbRW^!&7&i(h2Q)7g7t zx1T7SerbK#YC8e_$LD5j^-6aa?3&W9bZtS0sYViSS46YYwTgO=mv8D8pGcb~2D26B zfE@29Q-HcxmgZg8m~=V+bI+V>7RvJFF1Jj(=J-nsTJ}~i*$Z?*-a?PruE%oM*Mb~r zbZynt?wD;x%AdcOD-=Oot~IIq-JVb@>#l$$HZZfn{yg^E*(?3Kw5!?XEimW6T$UWH zbX5=Lbt~oNQ|hdDvRIJbqi|*0;O2BL?WK=clK+UaRQqQJT#B zF}GD|x{gu))N_4GBAWatzWVrY!lj#nz`(aZD1R_Y;`XyAn%jXT4}+(xpUXO@geCxD Ch(hH6 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-flex-direction-column.htm b/test/render/flex/flexbox-flex-direction-column.htm new file mode 100644 index 000000000..189c04ea7 --- /dev/null +++ b/test/render/flex/flexbox-flex-direction-column.htm @@ -0,0 +1,60 @@ + + + + + CSS Flexbox Test: Flex-direction = column + + + + + + + + + +

The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.

+
+
1
4
7
+
2
5
8
+
3
6
9
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-flex-direction-column.htm.png b/test/render/flex/flexbox-flex-direction-column.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a23260e43b77514b178d88ecc1f3458c90a0b179 GIT binary patch literal 1202 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK4=^zU$;M6Zp8zSI0G|-o|Ns93nMP-g7#bK3 zN+~>GU|>n~ba4!+V0=3@FmJV$K%1lB`8_kfns^teY(AOy$n8|yriNF~&b&X^Ho-)F zi{)2`|Le01`evSKe_QCvq1Yne1SC{`-8-Ib{Busw`_~P1_Afoxo_qcO!s|z-Hs5z! z&b!>varwknzOyR)HII+4xzpV6^^Jxt|V8V|n>tu63zf^iB?g1|6!fS zjE*DQAE$Wu*q?DZQK11H9r?a5&4U1eyvzFzcYa_pppxXTBECamn? z&J=m+%CEeUp>6NOSv!tSe6*Fr?No)1^?I)t7rCapn8eKzTpJf4k$%MAbH$Rs=c>C;E&&y?T>$fXeEzk7K=+C=mqg;7LD`em0 z5juI-(vOdV9lbXknecof^QO+$@O|I;Y&U+ht-Qha!*#LpyN7?DtovD)Bds(wcVgbR z6L0=SE8P{pr>(et$i{i0)&|6laey1CcO_2y?JyX~=lQC;?U`@OG)K6~32fBSy;DuZ(u<8`|; zuDc9GIn9+0&N`89{7BtcX;!HI=@s{q12gTb!qgwB=ALN{(KYY-@na67ow(!7TE8dD z6s9lWi&|K4H7bOCODIbRW^!&7&i(h2Q)7g7t zx1T7SerbK#YC8e_$LD5j^-6aa?3&W9bZtS0sYViSS46YYwTgO=mv8D8pGcb~2D26B zfE@29Q-HcxmgZg8m~=V+bI+V>7RvJFF1Jj(=J-nsTJ}~i*$Z?*-a?PruE%oM*Mb~r zbZynt?wD;x%AdcOD-=Oot~IIq-JVb@>#l$$HZZfn{yg^E*(?3Kw5!?XEimW6T$UWH zbX5=Lbt~oNQ|hdDvRIJbqi|*0;O2BL?WK=clK+UaRQqQJT#B zF}GD|x{gu))N_4GBAWatzWVrY!lj#nz`(aZD1R_Y;`XyAn%jXT4}+(xpUXO@geCxD Ch(hH6 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-flex-direction-default.htm b/test/render/flex/flexbox-flex-direction-default.htm new file mode 100644 index 000000000..e4e227468 --- /dev/null +++ b/test/render/flex/flexbox-flex-direction-default.htm @@ -0,0 +1,59 @@ + + + + + CSS Flexbox Test: Flex-direction = row by default + + + + + + + + + +

The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.

+
+
1
2
3
+
4
5
6
+
7
8
9
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-flex-direction-default.htm.png b/test/render/flex/flexbox-flex-direction-default.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a23260e43b77514b178d88ecc1f3458c90a0b179 GIT binary patch literal 1202 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK4=^zU$;M6Zp8zSI0G|-o|Ns93nMP-g7#bK3 zN+~>GU|>n~ba4!+V0=3@FmJV$K%1lB`8_kfns^teY(AOy$n8|yriNF~&b&X^Ho-)F zi{)2`|Le01`evSKe_QCvq1Yne1SC{`-8-Ib{Busw`_~P1_Afoxo_qcO!s|z-Hs5z! z&b!>varwknzOyR)HII+4xzpV6^^Jxt|V8V|n>tu63zf^iB?g1|6!fS zjE*DQAE$Wu*q?DZQK11H9r?a5&4U1eyvzFzcYa_pppxXTBECamn? z&J=m+%CEeUp>6NOSv!tSe6*Fr?No)1^?I)t7rCapn8eKzTpJf4k$%MAbH$Rs=c>C;E&&y?T>$fXeEzk7K=+C=mqg;7LD`em0 z5juI-(vOdV9lbXknecof^QO+$@O|I;Y&U+ht-Qha!*#LpyN7?DtovD)Bds(wcVgbR z6L0=SE8P{pr>(et$i{i0)&|6laey1CcO_2y?JyX~=lQC;?U`@OG)K6~32fBSy;DuZ(u<8`|; zuDc9GIn9+0&N`89{7BtcX;!HI=@s{q12gTb!qgwB=ALN{(KYY-@na67ow(!7TE8dD z6s9lWi&|K4H7bOCODIbRW^!&7&i(h2Q)7g7t zx1T7SerbK#YC8e_$LD5j^-6aa?3&W9bZtS0sYViSS46YYwTgO=mv8D8pGcb~2D26B zfE@29Q-HcxmgZg8m~=V+bI+V>7RvJFF1Jj(=J-nsTJ}~i*$Z?*-a?PruE%oM*Mb~r zbZynt?wD;x%AdcOD-=Oot~IIq-JVb@>#l$$HZZfn{yg^E*(?3Kw5!?XEimW6T$UWH zbX5=Lbt~oNQ|hdDvRIJbqi|*0;O2BL?WK=clK+UaRQqQJT#B zF}GD|x{gu))N_4GBAWatzWVrY!lj#nz`(aZD1R_Y;`XyAn%jXT4}+(xpUXO@geCxD Ch(hH6 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-flex-direction-row-reverse.htm b/test/render/flex/flexbox-flex-direction-row-reverse.htm new file mode 100644 index 000000000..aff8d1648 --- /dev/null +++ b/test/render/flex/flexbox-flex-direction-row-reverse.htm @@ -0,0 +1,61 @@ + + + + + CSS Flexbox Test: Flex-direction = row-reverse + + + + + + + + + +

The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.

+
+
3
2
1
+
6
5
4
+
9
8
7
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-flex-direction-row-reverse.htm.png b/test/render/flex/flexbox-flex-direction-row-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a23260e43b77514b178d88ecc1f3458c90a0b179 GIT binary patch literal 1202 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK4=^zU$;M6Zp8zSI0G|-o|Ns93nMP-g7#bK3 zN+~>GU|>n~ba4!+V0=3@FmJV$K%1lB`8_kfns^teY(AOy$n8|yriNF~&b&X^Ho-)F zi{)2`|Le01`evSKe_QCvq1Yne1SC{`-8-Ib{Busw`_~P1_Afoxo_qcO!s|z-Hs5z! z&b!>varwknzOyR)HII+4xzpV6^^Jxt|V8V|n>tu63zf^iB?g1|6!fS zjE*DQAE$Wu*q?DZQK11H9r?a5&4U1eyvzFzcYa_pppxXTBECamn? z&J=m+%CEeUp>6NOSv!tSe6*Fr?No)1^?I)t7rCapn8eKzTpJf4k$%MAbH$Rs=c>C;E&&y?T>$fXeEzk7K=+C=mqg;7LD`em0 z5juI-(vOdV9lbXknecof^QO+$@O|I;Y&U+ht-Qha!*#LpyN7?DtovD)Bds(wcVgbR z6L0=SE8P{pr>(et$i{i0)&|6laey1CcO_2y?JyX~=lQC;?U`@OG)K6~32fBSy;DuZ(u<8`|; zuDc9GIn9+0&N`89{7BtcX;!HI=@s{q12gTb!qgwB=ALN{(KYY-@na67ow(!7TE8dD z6s9lWi&|K4H7bOCODIbRW^!&7&i(h2Q)7g7t zx1T7SerbK#YC8e_$LD5j^-6aa?3&W9bZtS0sYViSS46YYwTgO=mv8D8pGcb~2D26B zfE@29Q-HcxmgZg8m~=V+bI+V>7RvJFF1Jj(=J-nsTJ}~i*$Z?*-a?PruE%oM*Mb~r zbZynt?wD;x%AdcOD-=Oot~IIq-JVb@>#l$$HZZfn{yg^E*(?3Kw5!?XEimW6T$UWH zbX5=Lbt~oNQ|hdDvRIJbqi|*0;O2BL?WK=clK+UaRQqQJT#B zF}GD|x{gu))N_4GBAWatzWVrY!lj#nz`(aZD1R_Y;`XyAn%jXT4}+(xpUXO@geCxD Ch(hH6 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-flex-direction-row.htm b/test/render/flex/flexbox-flex-direction-row.htm new file mode 100644 index 000000000..fa53bd57e --- /dev/null +++ b/test/render/flex/flexbox-flex-direction-row.htm @@ -0,0 +1,60 @@ + + + + + CSS Flexbox Test: Flex-direction = row + + + + + + + + + +

The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.

+
+
1
2
3
+
4
5
6
+
7
8
9
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-flex-direction-row.htm.png b/test/render/flex/flexbox-flex-direction-row.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a23260e43b77514b178d88ecc1f3458c90a0b179 GIT binary patch literal 1202 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK4=^zU$;M6Zp8zSI0G|-o|Ns93nMP-g7#bK3 zN+~>GU|>n~ba4!+V0=3@FmJV$K%1lB`8_kfns^teY(AOy$n8|yriNF~&b&X^Ho-)F zi{)2`|Le01`evSKe_QCvq1Yne1SC{`-8-Ib{Busw`_~P1_Afoxo_qcO!s|z-Hs5z! z&b!>varwknzOyR)HII+4xzpV6^^Jxt|V8V|n>tu63zf^iB?g1|6!fS zjE*DQAE$Wu*q?DZQK11H9r?a5&4U1eyvzFzcYa_pppxXTBECamn? z&J=m+%CEeUp>6NOSv!tSe6*Fr?No)1^?I)t7rCapn8eKzTpJf4k$%MAbH$Rs=c>C;E&&y?T>$fXeEzk7K=+C=mqg;7LD`em0 z5juI-(vOdV9lbXknecof^QO+$@O|I;Y&U+ht-Qha!*#LpyN7?DtovD)Bds(wcVgbR z6L0=SE8P{pr>(et$i{i0)&|6laey1CcO_2y?JyX~=lQC;?U`@OG)K6~32fBSy;DuZ(u<8`|; zuDc9GIn9+0&N`89{7BtcX;!HI=@s{q12gTb!qgwB=ALN{(KYY-@na67ow(!7TE8dD z6s9lWi&|K4H7bOCODIbRW^!&7&i(h2Q)7g7t zx1T7SerbK#YC8e_$LD5j^-6aa?3&W9bZtS0sYViSS46YYwTgO=mv8D8pGcb~2D26B zfE@29Q-HcxmgZg8m~=V+bI+V>7RvJFF1Jj(=J-nsTJ}~i*$Z?*-a?PruE%oM*Mb~r zbZynt?wD;x%AdcOD-=Oot~IIq-JVb@>#l$$HZZfn{yg^E*(?3Kw5!?XEimW6T$UWH zbX5=Lbt~oNQ|hdDvRIJbqi|*0;O2BL?WK=clK+UaRQqQJT#B zF}GD|x{gu))N_4GBAWatzWVrY!lj#nz`(aZD1R_Y;`XyAn%jXT4}+(xpUXO@geCxD Ch(hH6 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-flex-wrap-flexing.htm b/test/render/flex/flexbox-flex-wrap-flexing.htm new file mode 100644 index 000000000..72f823b91 --- /dev/null +++ b/test/render/flex/flexbox-flex-wrap-flexing.htm @@ -0,0 +1,40 @@ + + + + + CSS Flexbox Test: flex-wrap flexes widths after line breaking + + + + + + + + + + + +

Test passes if there is a green rectangle and no red.

+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-flex-wrap-flexing.htm.png b/test/render/flex/flexbox-flex-wrap-flexing.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..1b9a92e7b6fe17e7bac035594e880fa5417f45bd GIT binary patch literal 568 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq8UNHe9T}Gu`~>&+B)T^4rh64c&HMzuI@FhK9cQ$+xk>op&}XZJy`xtWW9t z1c8-d(ck};b)V4R?>;$2Z_|ET@tG&wL!whw)tmc9oBWGfBW5c2yer$)+VMzNuX=Id*M>o^dwwo)h|9tZ6=bie`E*Kqd)s^xzTtM@E_Z{hb@@89iowZDk@>@B>t-JNa z8{fdQ$JRu-)%obq;oEBf}SlJ&QW%u1trJ^O$q_cYe} z+i*idD&X;Z + + + + CSS Test: Ensure that min-width is honored for horizontal multi-line flex containers + + + + + + + + + +
+
+ + +
+
+
+ + +
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-flex-wrap-horiz-002.htm.png b/test/render/flex/flexbox-flex-wrap-horiz-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..062333d6ebac93cdc8a7ac2bbd4e7b09b2d38951 GIT binary patch literal 211 zcmeAS@N?(olHy`uVBq!ia0vp^n}9fgi5W;9$T(gEq<8{+LR|m<{|{s`F#KP8tk+hVA5_zvy}`!IQl9DUAG2?tIDf6>3k$AVvt9bmT>ZEI za^F1N7wi literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-flex-wrap-wrap.htm b/test/render/flex/flexbox-flex-wrap-wrap.htm new file mode 100644 index 000000000..d14b2082e --- /dev/null +++ b/test/render/flex/flexbox-flex-wrap-wrap.htm @@ -0,0 +1,60 @@ + + + + + CSS Flexbox Test: Flex-wrap = wrap + + + + + + + + + +

The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.

+
+
1
2
3
+
4
5
6
+
7
8
9
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-flex-wrap-wrap.htm.png b/test/render/flex/flexbox-flex-wrap-wrap.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a23260e43b77514b178d88ecc1f3458c90a0b179 GIT binary patch literal 1202 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK4=^zU$;M6Zp8zSI0G|-o|Ns93nMP-g7#bK3 zN+~>GU|>n~ba4!+V0=3@FmJV$K%1lB`8_kfns^teY(AOy$n8|yriNF~&b&X^Ho-)F zi{)2`|Le01`evSKe_QCvq1Yne1SC{`-8-Ib{Busw`_~P1_Afoxo_qcO!s|z-Hs5z! z&b!>varwknzOyR)HII+4xzpV6^^Jxt|V8V|n>tu63zf^iB?g1|6!fS zjE*DQAE$Wu*q?DZQK11H9r?a5&4U1eyvzFzcYa_pppxXTBECamn? z&J=m+%CEeUp>6NOSv!tSe6*Fr?No)1^?I)t7rCapn8eKzTpJf4k$%MAbH$Rs=c>C;E&&y?T>$fXeEzk7K=+C=mqg;7LD`em0 z5juI-(vOdV9lbXknecof^QO+$@O|I;Y&U+ht-Qha!*#LpyN7?DtovD)Bds(wcVgbR z6L0=SE8P{pr>(et$i{i0)&|6laey1CcO_2y?JyX~=lQC;?U`@OG)K6~32fBSy;DuZ(u<8`|; zuDc9GIn9+0&N`89{7BtcX;!HI=@s{q12gTb!qgwB=ALN{(KYY-@na67ow(!7TE8dD z6s9lWi&|K4H7bOCODIbRW^!&7&i(h2Q)7g7t zx1T7SerbK#YC8e_$LD5j^-6aa?3&W9bZtS0sYViSS46YYwTgO=mv8D8pGcb~2D26B zfE@29Q-HcxmgZg8m~=V+bI+V>7RvJFF1Jj(=J-nsTJ}~i*$Z?*-a?PruE%oM*Mb~r zbZynt?wD;x%AdcOD-=Oot~IIq-JVb@>#l$$HZZfn{yg^E*(?3Kw5!?XEimW6T$UWH zbX5=Lbt~oNQ|hdDvRIJbqi|*0;O2BL?WK=clK+UaRQqQJT#B zF}GD|x{gu))N_4GBAWatzWVrY!lj#nz`(aZD1R_Y;`XyAn%jXT4}+(xpUXO@geCxD Ch(hH6 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-items-as-stacking-contexts-002.htm b/test/render/flex/flexbox-items-as-stacking-contexts-002.htm new file mode 100644 index 000000000..593dfb543 --- /dev/null +++ b/test/render/flex/flexbox-items-as-stacking-contexts-002.htm @@ -0,0 +1,73 @@ + + + + + CSS Test: Testing that flex items paint as pseudo-stacking contexts (like inline-blocks): atomically, in the absence of 'z-index' on descendants + + + + + + + +
ThisIsALongUnbrokenString
HereIsSomeMoreLongText
+ + +
ThisIsALongUnbrokenString
HereIsSomeMoreLongText
+ + +
ThisIsALongUnbrokenString
HereIsSomeMoreLongText
+ + +
ThisIsALongUnbrokenString
HereIsSomeMoreLongText
+ + +
ThisIsALongUnbrokenString
HereIsSomeMoreLongText
+ + +
ThisIsALongUnbrokenString
HereIsSomeMoreLongText
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-items-as-stacking-contexts-002.htm.png b/test/render/flex/flexbox-items-as-stacking-contexts-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0972738babfbb7c5c73a55a3ed03893d28aeb72d GIT binary patch literal 724 zcmeAS@N?(olHy`uVBq!ia0vp^7l62mg&9cN@E$l1r1%4TLR|j?!BU2`H=h0f4-{g^ zJpJnd0|Qfor;B4q1>@VPuQx6>;A#E&kZp!1>&y}dE`f-@*SA=?n-$7Q-|#Ja{%GO} ziTJ!l&2rbwTUuLdj~}xw(^>d=@5PTL`SGGrb^?=PomQO=YSrUfIQiL}@Tsf)J{zd4 zwfA^7ecnfpC4xay%}*`%ypo}i?)3Qvm#?Ig(%0je7eelM3s!Z#DR)}+{B+Vohfhn4 zTi30M6wRJ@7IU$c3bCfK?3=%46_ zq__&<;@*xIJEcM|?Y{DG6O*CR^oK@Qzdk$NydYfU=-l;A8k2K49obAjU77j+tFd=- z=GRw3{DQpqg}rhY&1*FaO0RVGPH?@x@!dVPEekW5r*NM1xhHo|=nba{^VLh-OV6I1 z@ZFECvOdqe<;{+F!kc!q$s2|IpB_+uExxyDgX0Z_904LV}j&i@*|7|fAw;XNc* zSoJ;q@6{KaMH`M!`+wc(G`o}k^71X2*W~<#zPZI7%2M&WJ-MGTZcd`-SId>Volk62 zd9x`fTz{MV>jioDwx4;)uDEhe{X{F_O%6RpGt4TL63@?BB3?7i_3M#~CuhE#z*<^! zqv*^mffZf$wq?JqB00_0InB8=Q)x%f2KA#h?Ndwj9_;?OAjj~*k(FBe5?^gOcCD?w zV+HFhBPH*+i3hB2KYKHyLL@2XsQt~T2T_-QIcW&9?Yxo^*Ls1c=Y?KR+HDTeUVEWg z<=jh!M1sR@_Y3YaDh>bEEO;%ebt_;h literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-items-as-stacking-contexts-003.htm b/test/render/flex/flexbox-items-as-stacking-contexts-003.htm new file mode 100644 index 000000000..8eb99bc4b --- /dev/null +++ b/test/render/flex/flexbox-items-as-stacking-contexts-003.htm @@ -0,0 +1,73 @@ + + + + + CSS Test: Testing that flex items paint as pseudo-stacking contexts (like inline-blocks), instead of full stacking contexts: 'z-index' should let descendants interleave + + + + + + + +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-items-as-stacking-contexts-003.htm.png b/test/render/flex/flexbox-items-as-stacking-contexts-003.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..05fd667bc0a498dcef60a5d9424e56a0bb8d690a GIT binary patch literal 168 zcmeAS@N?(olHy`uVBq!ia0vp^DL|~j!VDyTg*g=fDbWC*5ZC`eu#{o#jc5P=Gc*9< ze+GtzhK(Vy`alJKo-U3d6^w7Mcyl@^inKh8ei*VtbWH-Q_6_?cZFw0%wi<)(pVJQQ zpLo%~LNdwzr!DurP8Gi(<9S*uJ=ruP&u@x1+LLnY$)VLXpAK`(W%_OZc + + + + + CSS Test: Testing borders on flex items in a row-reverse horizontal flex container + + + + + + +
+
+
+
+
+
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-mbp-horiz-001-reverse.htm.png b/test/render/flex/flexbox-mbp-horiz-001-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..185155f9d584a22fdb895e110b7160f3a394f0f8 GIT binary patch literal 442 zcmeAS@N?(olHy`uVBq!ia0vp^Hy9Y0GFX^_tZ&gqO+ZQ_z$e7@|Ns9$CXkr$Zo>bi z3=Iqo{|}sQXlOX|>pmv~17obGi(^OyzV>YS}%t0;mna>^l8+b5D{&_AYG-s zd_Ctzg;^c@kM4c_`h4VX|4aE^m%ivs0`Cx(pJ}TnojsHIynFuKZ8nIe( z_Ox$rKdc3r7p7^ZFH68+)*C;{wwmkdz z=_S?qlgoDK;`JfO_gDMo-kzPT1Po^ur@zs&4?X4QQkeYI_(9hC1py%sK1G}b$}o7k L`njxgN@xNA$&8<| literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-mbp-horiz-001.htm b/test/render/flex/flexbox-mbp-horiz-001.htm new file mode 100644 index 000000000..ea948a10f --- /dev/null +++ b/test/render/flex/flexbox-mbp-horiz-001.htm @@ -0,0 +1,71 @@ + + + + + + CSS Test: Testing borders on flex items in a horizontal flex container + + + + + + +
+
+
+
+
+
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-mbp-horiz-001.htm.png b/test/render/flex/flexbox-mbp-horiz-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..020f1648c13981747f344b99e4a6dc5062b40471 GIT binary patch literal 440 zcmeAS@N?(olHy`uVBq!ia0vp^Hy9Y0GFX^_tZ&gqO+ZQ_z$e7@|Ns9$=7e_>fb{>R z3=Iqo{|}sQXlUSLeRYO`fic?C#WAFU@y)r5E1L=!jy~Ld$T83MHQOU5+Z|2X7LFHw ziC$_JNzqjNv;RKBbL;v^b-}Y#pT=FS4V9MQVQW5^V1SQ`I2ds${{kmLbrL*b2HRFy z{XZ-MHd8vey^ssPrnju#tKRwM{t6}F0*LG6ucggk2RZge*bNJQLMCU=Tb<88DcssJ zPHyh+qXaDovnb2W@9P8xvH-`|{9LZ-_8JX7)6O@nW_&+)MWFh#Lmz-r44$rjF6*2U FngD^Rnq&X~ literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-mbp-horiz-002a.htm b/test/render/flex/flexbox-mbp-horiz-002a.htm new file mode 100644 index 000000000..02ab2ec17 --- /dev/null +++ b/test/render/flex/flexbox-mbp-horiz-002a.htm @@ -0,0 +1,75 @@ + + + + + + CSS Test: Testing margins and borders on flex items in a horizontal flex container + + + + + + +
+
+
+
+
+
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-mbp-horiz-002a.htm.png b/test/render/flex/flexbox-mbp-horiz-002a.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8a2b239e00a34b294ca9c5ccb8836345a95acfa5 GIT binary patch literal 457 zcmeAS@N?(olHy`uVBq!ia0vp^Hy9Y0GFX^_tZ&gqO+ZQ_z$e7@|Ns9$=7e_>fb{>R z3=Iqo{|}sQXlUSLeRYO`ficI^#WAFU@y$6$ul53g;};79b7gHE?>X#o;9mbg)W-3` z*We|stW!1WTkii}(_VRh!j~DVmi^v*eT}lwX4$^$>O5@C2NMh=@KI|La!ikLR}oYP zG()s|uD0>KWx8PV^p4GY4q@T6piEc?=#0A6=Q}=z;CBSrfg3JuY+ieNSuI#;Z0p(I zI1L8->W1%zRWJ8VKV7*s=f_9&*A+j1ysG_EPS76FzS?c($6bJ-&e8H~yIJdLc@YP- d)9DAUGH`^NH?37l{sxp{@O1TaS?83{1OWNIrqcib literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-mbp-horiz-002b.htm b/test/render/flex/flexbox-mbp-horiz-002b.htm new file mode 100644 index 000000000..c1f7cfbc3 --- /dev/null +++ b/test/render/flex/flexbox-mbp-horiz-002b.htm @@ -0,0 +1,82 @@ + + + + + + CSS Test: Testing margins, borders, and padding on flex items in a horizontal flex container + + + + + + +
+
+
+
+
+
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-mbp-horiz-002b.htm.png b/test/render/flex/flexbox-mbp-horiz-002b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8a2b239e00a34b294ca9c5ccb8836345a95acfa5 GIT binary patch literal 457 zcmeAS@N?(olHy`uVBq!ia0vp^Hy9Y0GFX^_tZ&gqO+ZQ_z$e7@|Ns9$=7e_>fb{>R z3=Iqo{|}sQXlUSLeRYO`ficI^#WAFU@y$6$ul53g;};79b7gHE?>X#o;9mbg)W-3` z*We|stW!1WTkii}(_VRh!j~DVmi^v*eT}lwX4$^$>O5@C2NMh=@KI|La!ikLR}oYP zG()s|uD0>KWx8PV^p4GY4q@T6piEc?=#0A6=Q}=z;CBSrfg3JuY+ieNSuI#;Z0p(I zI1L8->W1%zRWJ8VKV7*s=f_9&*A+j1ysG_EPS76FzS?c($6bJ-&e8H~yIJdLc@YP- d)9DAUGH`^NH?37l{sxp{@O1TaS?83{1OWNIrqcib literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-mbp-horiz-003-reverse.htm b/test/render/flex/flexbox-mbp-horiz-003-reverse.htm new file mode 100644 index 000000000..0417ff1eb --- /dev/null +++ b/test/render/flex/flexbox-mbp-horiz-003-reverse.htm @@ -0,0 +1,77 @@ + + + + + + CSS Test: Testing borders and padding on a row-reverse horizontal flex container and its flex items + + + + + + +
+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-mbp-horiz-003-reverse.htm.png b/test/render/flex/flexbox-mbp-horiz-003-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8f27a88005382865df8222f0cac8dc5e5f7848c0 GIT binary patch literal 372 zcmeAS@N?(olHy`uVBq!ia0y~yU<5K54Op0g)GD=2KY$c}fKQ0)|NsAiOdv7g-Gl~) z2G)YIB|vowo-U3d6^w7M9?WDm6mbodj%k>$&f8-pv8<8hQoXOISeuTJK$M4kO&%-z zyd(QPF8O=P<*u-`to8yL1_4>jDzW?jKfGa{bMo3}-u^ov`@z7AS;ezz+aC?MfDXII zq$Sti7Dq9(GRk}2ia1$TR`P@wrhI`(0?_rLjI+!S+AA}JFzoTK%rS2`)u7UEc4gii zTUD4khOLa#B}3VKxEU6xIT)+|DCTS6YOp;1qTHN;p + + + + + CSS Test: Testing borders and padding on a horizontal flex container and its flex items + + + + + + +
+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-mbp-horiz-003.htm.png b/test/render/flex/flexbox-mbp-horiz-003.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bd332091831bede56f1b9ade915e69dc9eb2c778 GIT binary patch literal 368 zcmeAS@N?(olHy`uVBq!ia0y~yU<5K54Op0g)GD=2KY$c}fKQ0)|NsAi%n9!%0OGF)Xr7MhqW6% zRARTk&tz0#tI1uuSUIY64ajv6;K4gXgux-K;hFD;G?oUQhVz>JZy6^@3Se57XMBoh zh8Tl`UqhPThxalJk_^Rt7w^jfjfrFotm?WJ*KP&!I~XXKCqzM5HyON{7)~%xD7o+D z?!M(!#77pW5(W?62`VqIep(C{*dU|e33TZud5t!g#ix%)JOiopboFyt=akR{0B + + + + CSS Test: flex container layout starts with lowest order item + + + + + + + + +

Test passes if the paragraph below reads 'First,Second,Third'.

+
+

Third

+

Second,

+

First,

+
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-order-from-lowest.htm.png b/test/render/flex/flexbox-order-from-lowest.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..91f98b3a92e67d6a414a2adf7a633733ca829dc4 GIT binary patch literal 496 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKGZ=vcgW`*okqius+dW+zLn;{GUb5ZvSb>NA zgMrBUFM>9D-#J#5nDzEOQ&LSYSZW-Q`QKsF`_%o%DushQ6AhRw_j6u6dS9TCMaV;; zk>yj`5x?BOvW&rXdrK-Fo_9X>+-jO=JLmn#8275g&s9I&2Pn@;{ppBheRwHQv2-#5vmCD&DRkMt(HMio}4Ri5mV zCKSp$1UXwg+@siYY1TUq`^JJ?kF_!EhvEg_aa`M~ymrcSg_m^VgpJiGL~52$6AXIa=)ojl2#EKd%L9jkZJ zy>mir)<^Fg)}YS(6ISertdrhx_&aIs>IOP1zdJ{2Q?VV-*`+EDW%Dk^+MYU`EM#Pk dY}u2YKRER#yDfbnbkQCZm7cDCF6*2UngIW@&Ts$# literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-order-only-flexitems.htm b/test/render/flex/flexbox-order-only-flexitems.htm new file mode 100644 index 000000000..4211ac1c1 --- /dev/null +++ b/test/render/flex/flexbox-order-only-flexitems.htm @@ -0,0 +1,40 @@ + + + + + CSS Test: order only affects flex items + + + + + + + + + +

Test passes if the paragraph below reads 'First, Second, Third'.

+
+ First, + Second, + Third +
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-order-only-flexitems.htm.png b/test/render/flex/flexbox-order-only-flexitems.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..1c26ed8b0126b4e0a0f8e1294669a53da9205eb2 GIT binary patch literal 492 zcmVWZN_1++NwwX#^$*Zv1cTGL+lgby_KHw zpCJA>1W9e>6WPm6h)VRRA}apCE-JD`WzksbrsRv_736TpTvk=yf{PLNkAZ&9%0Dd5IGZGXCsRrGV zfQ;(`5(>fr=LKQ3dJZST%?Rg$Rngbv z8y-v)7OY5^u2mKDBz3G-j+;4#OGyf{vNR$!_);uc{#raDeYtuMbGfv9Q}AQAcP$h%EkeiJGI zglwYwzlqHS$;2PX+yh}PNH`Jhg5)w?+#NBmPm8P + + + + CSS Test: Testing that paint order isn't influenced + by "order" for absolutely positioned flex children + + + + + + + +
+ +
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-paint-ordering-003.htm.png b/test/render/flex/flexbox-paint-ordering-003.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ec539b62aa3527343e78572eceeaacd0668477b4 GIT binary patch literal 141 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKOBk7fq`T*la3IAN;1lBd|Nno6{|v{T>G1$X zoIG6|Ln;{Go>dfNVBlae__cf~V}#20D(wwSa?dh4U6dwzs0iVq9C8@z>o{YC!v2&2 PO=IwM^>bP0l+XkK2&X54 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-single-line-clamp-2.htm b/test/render/flex/flexbox-single-line-clamp-2.htm new file mode 100644 index 000000000..70346d7ab --- /dev/null +++ b/test/render/flex/flexbox-single-line-clamp-2.htm @@ -0,0 +1,43 @@ + + + + +CSS Test: Single-line flex containers should clamp their line's height to the container's computed min and max cross-size. + + + + +
+
+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox-single-line-clamp-2.htm.png b/test/render/flex/flexbox-single-line-clamp-2.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bc335cb09657dcef51936bbb2f24ff45aecce989 GIT binary patch literal 415 zcmeAS@N?(olHy`uVBq!ia0y~yU}6Pg7A9t($d`3nt$`FzfKQ0)|Ns9R7#h~zc-GL+ zaPHE9a0UiOKTj9OkP5~(7Y%tE0t8qcRpN@(0-E`*JY-;*aAA*j-HA0#o@JAll*@(+ zxBT_75+E5&Q!EMj+p^&R2Mej7MbOFpD$B#ZT_oE{a}E2dZ_RCH1O_Xc)4yxg{SUho fSXoPlw$C7^>bP0l+XkK=_pA> literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-table-fixup-001.htm b/test/render/flex/flexbox-table-fixup-001.htm new file mode 100644 index 000000000..b6dbb12d4 --- /dev/null +++ b/test/render/flex/flexbox-table-fixup-001.htm @@ -0,0 +1,64 @@ + + + + + + CSS Test: Testing that table cells in a flex container get blockified and each form their own flex item + + + + + + + + +
cell1cell2
+ + +
cell1t
+ + +
cell1
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-table-fixup-001.htm.png b/test/render/flex/flexbox-table-fixup-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..842f3a923c53dd555464d53a4da208abe2c92d1e GIT binary patch literal 297 zcmV+^0oMMBP)}d~XixEukS6!ZQ7BiOGW^6iQi^!2 zBmxOX-)#nP&rE&jo)8D7LkV2v)iBEH1p+e(oii~g!a(tF`)m5gEOkCvh z|Hh3JO&kqwBpY{R;d%-;V;_yaenMp2pKy;9OVl@o)S7n{&}e9_-Uc9_AS2RCtV2 v;X#hPoCpv1k#m18?n(G*{9DEMJqynr4qVr%{s6aA00000NkvXXu0mjf!%c`M literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-whitespace-handling-002.htm b/test/render/flex/flexbox-whitespace-handling-002.htm new file mode 100644 index 000000000..b63cbb34f --- /dev/null +++ b/test/render/flex/flexbox-whitespace-handling-002.htm @@ -0,0 +1,55 @@ + + + + + + CSS Test: Test that whitespace is preserved at the edges of anonymous flex items if 'white-space: pre' is set + + + + + + + + +
abc
+
abc
+
abc
+ + +
abc
+
abc
+
abc
+ + +
abc
+
abc
+
abc
+ + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-whitespace-handling-002.htm.png b/test/render/flex/flexbox-whitespace-handling-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d85892ca08a5cb82709b249689069644def9fa51 GIT binary patch literal 910 zcmeAS@N?(olHy`uVBq!ia0vp^w-^|hm$5JdS@qV_&I2j_0G|-o|Ns9pF#MnJZURtX z?Tu%bf-CL-)meGEIEGX(zPS{bCG9A{a>1gQ@hz{DpTULi`=isu)dZS#Z%bWwJFT7Z z%~{_6s;#|?%52?<`)}nQwEy?>_xwLqe}A8@U$NCMdO_${v$X$iyRN<{^I3BH3e)U4 zd-c{WeK)OUvOHg}+v1BECQ>*lx$E0p{4UAef3nwh-QL@eqh4=ejS9_A{+7Qax;O8* z%PwEt4JU8DeiZd8@1*(9l^5_C1(eHe-KJVJ>Dv#r_wS3I-VMuKds!?abZ_s?{S)&{ zcgYIBG~0SWEq#4=_R8I=_n)*o<9Axdmg8G>Cr;jSTYdYdse5epU$e?>47+-J#$V}| zVT*4YPRtAD&MEq~Ysa)*(Vu+x$>R1S#L;)bK8?%&WL@_2(;NIAjU(XC-m>`HLYAJp zYk$k#-+lXX23~*OUWg+G;;;PM;?1tkci2J1;iwkt8taH{OovS-IR9Fo`Bp%(=wg#W z^5Z@H&3*kpm7$)y<(?Vr#&>C7`MM9^GIoA{SC+K)+!om_9Xs_l@6+6UbkptPpt9^J zr^&g%Fpexg{b%xAf-&YZ+o)*5Hq*#c)l>H;`{udYdA-j|zuL5|IZWA0XY)SE-B&H+ zCU3g!eL7>)+tOU!w|SlQpXL*5>d&wD9-ohx_;j0T<@>vDk3`MQw9XJLj!ml#F6&O+ z{(Q-sYg<~>ZpVpV-}G+UPjzct0R>CHw`Q27F6r>d`p0nAQ^Q2-r?Me1KQVZ^`njxg HN@xNA>o~Ro literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-with-pseudo-elements-001.htm b/test/render/flex/flexbox-with-pseudo-elements-001.htm new file mode 100644 index 000000000..205dc9c22 --- /dev/null +++ b/test/render/flex/flexbox-with-pseudo-elements-001.htm @@ -0,0 +1,58 @@ + + + + + CSS Test: Testing that generated content nodes are treated as a flex items + + + + + + + +
+ x +
y
+ z +
+
+ x +
y
+ z +
+
+ x +
y
+ z +
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-with-pseudo-elements-001.htm.png b/test/render/flex/flexbox-with-pseudo-elements-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..eae89224f724e30540032aa0a1b28fb1108a6ab0 GIT binary patch literal 535 zcmV+y0_gpTP)8itz+D>1SpC-&;k?-6 zOwbCh_JIHMEYRm8)|v<*r)Zks17Y%_2Pb*jD#GLWOy$ zX^oectl_O~yteY3yxj2CCSGHCQSCLB7d0Al7_Uxc(Bw9zxf^)zxW;n};vJfa5JEmM Ze*kQB3aHRo%%uPT002ovPDHLkV1g5U4f6m1 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-with-pseudo-elements-002.htm b/test/render/flex/flexbox-with-pseudo-elements-002.htm new file mode 100644 index 000000000..a4e144d72 --- /dev/null +++ b/test/render/flex/flexbox-with-pseudo-elements-002.htm @@ -0,0 +1,81 @@ + + + + + CSS Test: Testing that generated content nodes are treated as a flex items, and honor 'order' + + + + + + + + +
+
I
+
+ + +
+
I
+
+ + +
+
I
+
+ + +
+
I
+
+ + +
+
I
+
+ + +
+
I
+
+ + +
+
I
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-with-pseudo-elements-002.htm.png b/test/render/flex/flexbox-with-pseudo-elements-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..4f5a43050f7c98eed6a94e7e454ce3b17c4ddb37 GIT binary patch literal 685 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKdsvu(WLd_AU?9aG;1lBd|NsBXmoNYS59Bkf zz47eXy5Bb#7?>hGT^vIy7~ft!$h+7;!X+`vq2xh`gPN?vf77)$GjiwbEtoy=kKNNL zmp%OVM}o8-NL=f+^-z~WVwFIqsND^YZu?DO0IFrNRB4*=H|E60LjGBI-?s`J$>C7aI|BB_GWLl- z+E`vVuG(D0KT8(sR2_zSKfcFIJypBSSlMHSVaJv(g)pGk)H@^{4{cFs|H7*zc;rQy z;_>IzitD#mUpezm+-U-XZpV%Z9N^G;Z0@qkUiABlnLyW-{teUuvIHR^0P^hXlaF?O z0vfB>u})!9_2n!7_&2?M=Nk+Z5qmPh&y&S)ckGFeft7nXAC>MGXky85Jksi-0P>#X ze#M|j)$hwz0*wvT`o7>MvY{~*+x~C}0e$n2P0(=-JUW|XE@^fuxY>&r)r7?510C`= zj>GXxo5CZfH{cko5_tKWcVZXN4^gTe~DWM4ft{WJa literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_absolute-atomic.htm b/test/render/flex/flexbox_absolute-atomic.htm new file mode 100644 index 000000000..a4890645e --- /dev/null +++ b/test/render/flex/flexbox_absolute-atomic.htm @@ -0,0 +1,33 @@ + + + +flexbox | abspos atomic flexitems + + + + + +
+
filler
+
filler
+
filler
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_absolute-atomic.htm.png b/test/render/flex/flexbox_absolute-atomic.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..9c4a7854612d034a0459e07bab580d11e5032ab3 GIT binary patch literal 237 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKEtr^rWJPhw1R%v3;1lBd{|tk1+8H3vUrBH= zkecu5;uuoF`1a~)-ev=VmWL*eT^^#DNwo`@FY~JwY*^jX>~dmeY-Z2b`s(=4Lp{~B;a_EG4iI*H6pImu5kLpci2kf5vO6m#E^ZL>m*Jo{S%lxx5T{Kfuk#6 e$#nsUJ)8IyRp&IP + + +flexbox | align-content: center + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-content-center.htm.png b/test/render/flex/flexbox_align-content-center.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e949f70c7a6d86e8d0d7fcbdae3ed6bfd53848e4 GIT binary patch literal 353 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@CKhHO`D|0HJCG6z@CkAK|NlRb$-n@j{~tKL z_Qtd6Ss$Z-%DFsU978G?-(EfF%WNp%_HfIG$#Ru!cmC8Vj{K5fugP2FQo}TFM;>3g z`y{nfd?# literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-content-flexend.htm b/test/render/flex/flexbox_align-content-flexend.htm new file mode 100644 index 000000000..34a770c23 --- /dev/null +++ b/test/render/flex/flexbox_align-content-flexend.htm @@ -0,0 +1,41 @@ + + + +flexbox | align-content: flex-end + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-content-flexend.htm.png b/test/render/flex/flexbox_align-content-flexend.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0013c5d519cd7825c5a4d4305e8ba82585352dfb GIT binary patch literal 352 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@CKhHO`D|0HJCG6z@CkAK|NlRb$-n@j{~tKL z_Qtd6Ss$Z-$~iq<978G?-(C&$I$|Ku{&DZ2``g$(*0Qg#ZM?)Ca^mm$M=CCYwZ@u0 zC%$iVmiz8*cG#{11oo)Dul1fEcAs^L$3&%4*&rbGi%%0s)wYWOseR5}UzUIQx#IQL z>*hJ>vF|ZOkugmWRA@wc2`n z#l@wS-!Dt&Zuvc1xAxxeXS?k`><1YPx# literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-content-flexstart.htm b/test/render/flex/flexbox_align-content-flexstart.htm new file mode 100644 index 000000000..6cf2fae9e --- /dev/null +++ b/test/render/flex/flexbox_align-content-flexstart.htm @@ -0,0 +1,41 @@ + + + +flexbox | align-content: flex-start + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-content-flexstart.htm.png b/test/render/flex/flexbox_align-content-flexstart.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..04c663e330060dff9c1c358c4bec1cacf77ee21e GIT binary patch literal 352 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@CKhHO`D|0HJCG6z@CkAK|NlRb$-n@j{~tKL z_Qtd6Ss$Z-$~iq<978G?-(J1Q+hicnkQips$k=7UVAR;gYVh*k>Wa0Yk5}uSH2wR( z;^pk0O|~yPKwypPwcj58msfwDb-nag?!8aDmcK9b*njDE!xp)f9{XRcN#ydFdtyPv z%`ZCIrCBkTrc^C+l-erl(XPDoS9)~k7X9skYrP-8YqyTd_?{m7YsdGa<@+CQ*9=!|(J36c8du<$&F-oqtW?jhw31nG=jNd8?vgH;Z$d250kxY*@*9Ad9 a@-?T$WX1onH|@WIg2~g>&t;ucLK6Thg`JlG literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-content-spacearound.htm b/test/render/flex/flexbox_align-content-spacearound.htm new file mode 100644 index 000000000..29c765a49 --- /dev/null +++ b/test/render/flex/flexbox_align-content-spacearound.htm @@ -0,0 +1,41 @@ + + + +flexbox | align-content: space-around + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-content-spacearound.htm.png b/test/render/flex/flexbox_align-content-spacearound.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..9c4fae5dc95d479427d93ae0013730fb02552adb GIT binary patch literal 354 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@CKhHO`D|0HJCG6z@CkAK|NlRb$-n@j{~tKL z_Qtd6Ss$Z-%DFvV978G?-(C&$I$|Ku{xR-h{%vNL*Nj>I3%)Rk7X4ps!5MgP-%K5! z6W=#F%YAn@JM8BI0{13;uUq1Oejm5TL?zc(yLNwhy5jZQ^X56}vGN}8FMVgtv=7R> zm)mE;yTmbyXZ7WC+b$&>+v~I1+V|3$w+_2(g0#LW&Apv_<;A5vzhCy6-THfWn%(=_ z&v)g2+!xUdS^_e(3(WYh`c(?V|HTIquD!nbi|MtmonQ3!UdxbQ;_TJDB`z~e^VZDc zOSjxvsWzwRsEAC9jpbzqeoc`R@3x2{02uMwghZybcn$QocW^ fGG7S + + +flexbox | align-content: space-between + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-content-spacebetween.htm.png b/test/render/flex/flexbox_align-content-spacebetween.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b305e476b65b7c296ad3e7cf32f072afb380c656 GIT binary patch literal 354 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@CKhHO`D|0HJCG6z@CkAK|NlRb$-n@j{~tKL z_Qtd6Ss$Z-%DFvV978G?-(HPf*JL2zkhsl2Ji=k;4u%v~DYFL8@B2lUZ~b@FJbH3w zmEW8%XKN1jmAHVwHKEtGOX@GL{cpPd@t1pho|gLEe>}l%>2k(Q+n|Yc7b6dgOt6~h zxN+0V$go#eb}Z5S>eFnJr9FXf|CCqrb5$?xyW_T1uXnfnyNrc*=a;^Gd{6xT-?sb9 zJSHl+c8O>PEdeopO}&x@qO+_)+^w=8(OY~V$=r64m#e=#_`FNu@053ouk&A0Tk4l` z=Wvfw+<6PNr7vfm(tCMjqu$r89$(F`M=wZP={Somb6Lprzj~(oe%tAT4Tss1>#B9_ ebq5Ial(HUttoT3Zz&aC9KzX|QxvX + + +flexbox | align-content: stretch + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-content-stretch-2.htm.png b/test/render/flex/flexbox_align-content-stretch-2.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..cfb61e9697f233259512f71c28fed76b82950f76 GIT binary patch literal 349 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@CKhHO`D|0HJCG6z@CkAK|NlRb$-n@j{~tKL z_Qtd6Ss$Z-%Go?!978G?-(C&$YjzN5co>(cBg3$UeT8k~GVuc~zvGWG20k{9-YmV( ze(sy-&#mvKOjhxn6cQa+ZGUO`$JNho?~6OWKla`4s{8xW75+}$SGwe_hw{1Wb8Z{4 zE^&65eq+b;$S|uVA9wk#OyA`Zp38jc-NZ|OHs`uj>1_{mpT2JQ{yP_)cGsU=8vlLY zk9YDva=oyETYJ8w-n)MM$BbFi{Ql07zvS%I-cc8|tbfMmnB`tCzxgD0y*;xs)@r-b z+50y6j$MmcUz#nkUb^$m{Y$6H>+gwcVg)b%doTXxH%Y}aD7BV}rF|El#3r5TpfK`u L^>bP0l+XkK%?z97 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-items-center-2.htm b/test/render/flex/flexbox_align-items-center-2.htm new file mode 100644 index 000000000..0881d30ac --- /dev/null +++ b/test/render/flex/flexbox_align-items-center-2.htm @@ -0,0 +1,46 @@ + + + +flexbox | align-items: center + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-items-center-2.htm.png b/test/render/flex/flexbox_align-items-center-2.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a4998fd8f5bf3b2dcf132cc7490cd43928a15a69 GIT binary patch literal 393 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa_MkYi~UJ zf8aEbw`69%9Z@VR7jqv42($%8&0yt9C=X^RWbMpo@c44y>)5o(HcwBA zZTdRjzvtcOgWv8nt9VXQ@x0|W_1gA7=kKr4d-B9^;^gNpe)EJaEB&54v3%?QFF)d% z_RoJ$u0OtDU-XIL=h9advd<$-zgYUV)YLsIUHkKm=VX5A>HqiZzW!@ox&QIsYv1hy zIzLsKY1La#T(A5-^`GkfZ+Y?Y`_?=^`TL)(>At+$w3Elv?M|uJF8H&B`RD26NcksE zc7BR`bvf?-AFx98Q>)K?pLg6M@RRrK_n#-UpIjaE^!XOv>Du$le*fq_{`T90-*Yg) zpUh8NmDR!E{{EV`Cr*OFcl~(nqEB;9oGeySKi@gWMjgnhdouN!Bhc5ARB{*ji + + +flexbox | align-items: center + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-items-center.htm.png b/test/render/flex/flexbox_align-items-center.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..13c9837666df1f1d9e9924f86cbe4d8c956533b1 GIT binary patch literal 396 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa=xJ{r|w} zwKtwk&-xezRBr0&;uuoF`1Wd`->U$DhKG5H?^;lu`#t{XZ3-|GKLB7yt9$yX@x8E0?_f)pOt8KYs(X>t&ArQC43+!TrzvXLpuq zPMEL6*V$h^PxMpGy^n@x4U^6k&lCEodG>nhs&_S$&i~qF-S4iGes12=cHSqC!#;J? zp8hO*e!HE08@Sv@$RzUmeYUjxelaNr~ll(r)>N5|MTu&{~Eqe uuLvD{vOTdI=1@F-;CC*`o&fgx?ibwEw=`}qQrP|k6r`T6elF{r5}E+euEX~L literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-items-flexend-2.htm b/test/render/flex/flexbox_align-items-flexend-2.htm new file mode 100644 index 000000000..c33c03151 --- /dev/null +++ b/test/render/flex/flexbox_align-items-flexend-2.htm @@ -0,0 +1,45 @@ + + + +flexbox | align-items: flex-end + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-items-flexend-2.htm.png b/test/render/flex/flexbox_align-items-flexend-2.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d755125b5385098ee6d6b03cfc6ba850ec700c42 GIT binary patch literal 375 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa_MkYi~UJ zf8aEbw`69%9Z@VR7js`Z2($%8&EOV!FnbBZBQBwf3=?1MpW36V&TGNH z?f>V_i+1v5l75p^JSVASN{2@6|5X2fv($-`$x7gd3J(Vw?F*Xb7(6@7YpYW2GQdCyG(KP^1lpL*i(lhBo)vTwDWo_c + + +flexbox | align-items: flex-end + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-items-flexend.htm.png b/test/render/flex/flexbox_align-items-flexend.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..81acb6161f78c28f7a9dfbbb09a27650e6d8e0e7 GIT binary patch literal 396 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa=xJ{r|w} zwKtwk&-xezRBr0&;uuoF`1b0>+(!WdZGllUVl^6oXlYY#MuW$@{ZnIaTmXN!j_eOPo7v#ocx?BoS)nOyf2OX zANTL@%WZ46Pk%mldFtND>-GQde?Rp;|K%Ub>hC9n|J~QK^W0?x`>?m{`|=*Ynb7}S z_T6WhRm%$Pmbuo+JUd;y>s`$>`!BWSao?-vC2!NYzg}VfwMpT*(RTMfe!SN2zu?#V zJ-LV1s@3yV9?qM;|FQ4xzb4auC9gMs`|WeYv-zLy-M#m(x-R;f|IbY)PELM0^_m~p b=edjc+n!I@Ybp?K3<^?DS3j3^P6 + + +flexbox | align-items: flex-start + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-items-flexstart-2.htm.png b/test/render/flex/flexbox_align-items-flexstart-2.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..f2a887bd66cc684df598730a8ae3203640dd5894 GIT binary patch literal 397 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa=xJ{r|w} zwKtwk&-xezRBq=4G-5msJ_h@b&JtUouRZ*DfNG7ftLf5++z>H ze|3pZ-+IWam$G?IQt_O$rFT(u{HOZk{qxqHuCl9pUlM)ob^qsck2l?WR?PS0^~w0M zt)G6^ov|%f6DcD-#)$nnH#zP>1ic(_4WO8@Pa*dMR4%xt-GJ!zwb{&CrhFauE9aj$`P;?so_f(IJDAjAfxA*bkE?iIQmbO``p)vxh55vFP?&nU`njxg HN@xNA2P(^5 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-items-flexstart.htm b/test/render/flex/flexbox_align-items-flexstart.htm new file mode 100644 index 000000000..19e850491 --- /dev/null +++ b/test/render/flex/flexbox_align-items-flexstart.htm @@ -0,0 +1,39 @@ + + + +flexbox | align-items: flex-start + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-items-flexstart.htm.png b/test/render/flex/flexbox_align-items-flexstart.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0ca4d0440980a13c362104906a3dd2b15ee38d2b GIT binary patch literal 398 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa=xJ{r|w} zwKtwk&-xezRBrC+;uuoF`1Wd`*I@^dwu?E5TVfrucQ@P;)wt`>`lepnFH7Xg@jDI= z?B(M=nH9|Wk~TrbbCQbZ?G;PED%V@peJzT;_WEP_^4pv4{hw1VH~p*O{9=W8|9{(7 zPrd&=`M75+pA~Kuid6|f31T2^-16R|1Nv_SN45=?SK9)zpV9d7py+{Tv7kV+spZTGPckE z6;%J`>!Q1L?@s@Tj@y0v^#14DQ~yra@18TqM!o3MoD(ODmDJC7QjsIyHtm`M$nTTP aE~>xso3PjW91ANbP(5A!T-G@yGywo4+QsDn literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-items-stretch-2.htm b/test/render/flex/flexbox_align-items-stretch-2.htm new file mode 100644 index 000000000..9bd23b324 --- /dev/null +++ b/test/render/flex/flexbox_align-items-stretch-2.htm @@ -0,0 +1,36 @@ + + + +flexbox | align-items: stretch + + + + + +
+ PASS + + x +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-items-stretch-2.htm.png b/test/render/flex/flexbox_align-items-stretch-2.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..3ac891b91548e21c084b1e97a188e4a8d85fbd87 GIT binary patch literal 149 zcmeAS@N?(olHy`uVBq!ia0y~yVEh1NPhbQR4EIA=mIA35PZ!6K3dXk=Hu5$Y2smF{ z;4}4A+wPUYjK&X`T&woix7xnbkU8G}NSWh!p$rQ8m~W%?Z1ZmBefN~&zN+_cJD>f& m;W}64mzpz+UoR>E>UqGwYLDgjKnaIlkbR!6elF{r5}E+zCpwn^ literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-items-stretch.htm b/test/render/flex/flexbox_align-items-stretch.htm new file mode 100644 index 000000000..9dec9f372 --- /dev/null +++ b/test/render/flex/flexbox_align-items-stretch.htm @@ -0,0 +1,44 @@ + + + +flexbox | align-items: stretch + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-items-stretch.htm.png b/test/render/flex/flexbox_align-items-stretch.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..178d4d19ea83e0ab668e4e1da522680ec430346a GIT binary patch literal 382 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa=xJz4pel z{|8RjNSyrwRIcvn;uuoF`1a~U-@^t14HwrHT;Q1y#HKMt-V%z=css2Qt=FucFq5LGG4F$-n-P=n7+4G)4%SlKkxC+=F>}?=k0U$wAnoR zI;}W;4znQ|v`WpZ@EdU%Kz@*MDWdgTyQeflA-XFV{exoup!Vk-uJ2 VZHc<#Whqb~db;|#taD0e0szZ2x8?u< literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-self-auto.htm b/test/render/flex/flexbox_align-self-auto.htm new file mode 100644 index 000000000..14fa46bdd --- /dev/null +++ b/test/render/flex/flexbox_align-self-auto.htm @@ -0,0 +1,42 @@ + + + +flexbox | align-self: auto + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-self-auto.htm.png b/test/render/flex/flexbox_align-self-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..81acb6161f78c28f7a9dfbbb09a27650e6d8e0e7 GIT binary patch literal 396 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa=xJ{r|w} zwKtwk&-xezRBr0&;uuoF`1b0>+(!WdZGllUVl^6oXlYY#MuW$@{ZnIaTmXN!j_eOPo7v#ocx?BoS)nOyf2OX zANTL@%WZ46Pk%mldFtND>-GQde?Rp;|K%Ub>hC9n|J~QK^W0?x`>?m{`|=*Ynb7}S z_T6WhRm%$Pmbuo+JUd;y>s`$>`!BWSao?-vC2!NYzg}VfwMpT*(RTMfe!SN2zu?#V zJ-LV1s@3yV9?qM;|FQ4xzb4auC9gMs`|WeYv-zLy-M#m(x-R;f|IbY)PELM0^_m~p b=edjc+n!I@Ybp?K3<^?DS3j3^P6 + + +flexbox | align-self: center + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-self-center.htm.png b/test/render/flex/flexbox_align-self-center.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..649ed6ea1814c5d6175141122525b7fe0cb24e30 GIT binary patch literal 388 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa=xJ{r|w} zwKtwk&-xezRIcmk;uuoF`1Wd`-ysKqhQxISOzawu7$*p4>~Qd{`oG#@ZRq3T=_!T# z?0vrdT>SQp-y{{!Nh)6hLteZ8EBW>6=dQKaFW*16J$LW?cb6UN?0?>FoU$~#m&%gg{(=96c^zGBV>Y3ZVI{vHp^wHvJ|C~JyK-2m@%P23inXaiAKfkhP z<2=i&Pl7`$_dWi3?YX^x=+oB|{ufv3ea^4kc-Jnsd(NCa|4*ERgWvsg-~hLT-;*b$ zO6u!{Ei31qIQiPeFK&5!Wk|L<(952acD)eh7W{Ji7)RkEP*8fh`njxgN@xNAMib5H literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-self-flexend.htm b/test/render/flex/flexbox_align-self-flexend.htm new file mode 100644 index 000000000..395137d63 --- /dev/null +++ b/test/render/flex/flexbox_align-self-flexend.htm @@ -0,0 +1,42 @@ + + + +flexbox | align-self: flex-end + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-self-flexend.htm.png b/test/render/flex/flexbox_align-self-flexend.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..129a5c72f8c7c6412e44ea546230c8ef4bc21c85 GIT binary patch literal 392 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa=xJ{r|w} zwKtwk&-xezRBq_$;uuoF`1b0>+*b|)ZGllUxJ455G#dgOm829V{mxg-KHfPcT{`n* zy`AB$=gn_#&QxwWU;)As3XzG^)G$!5ENx(c<*-EW+q{(fsFQ+fYW<#zx3Kiqcz zy)*6Cp6k2szny*m`S#L@lPBlv`*+T>q<~g~4<)?3b+qdug%RE&hzU@!{>DxyCr?tQR oRv7!_$;nS%+3Fx~PulfD*mcr`y)ySc9R~%cr>mdKI;Vst0C63~0RR91 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-self-flexstart.htm b/test/render/flex/flexbox_align-self-flexstart.htm new file mode 100644 index 000000000..1e4519cb9 --- /dev/null +++ b/test/render/flex/flexbox_align-self-flexstart.htm @@ -0,0 +1,42 @@ + + + +flexbox | align-self: flex-start + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-self-flexstart.htm.png b/test/render/flex/flexbox_align-self-flexstart.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..914e7dbe4a20ee14c48c878616fc82cd50e1764c GIT binary patch literal 390 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa_MkYi~RQ zGXEbqU35kw3#eS*)5S5Qg7NLugMo(}M2;s$RWPx-EM@RvwJ=#={N;YvY@aU+jz8J( z@&Dg8^XlfGCq7wtOj7Zjw8U=JmbxeY=YPLQjk$jNlO6NVx+m8k--vtigz?kDR~2)g zMVM|Yp2zX?)0x*%r*EqH+ATYETQ-0DzFOv~8u4v^=AXW8^nY6W+i!)jPo6xnoH+Tp zi{Ct9%Su1;IbXv6RmETbz21L^&9$$d`|N)npE+kwc;(fX*Phv(Wdl0u&WEoV>GwY^ zoSA<*=j$2upKJK1%>S;k-fQaoZMO@a)SiBR*Y58z^ILDHZ@cn*@4dfy_y7F=vr(_8 l=+oOLQ?EIKJgriCQ9RIe^4A%wGi*SC>FMg{vd$@?2>>0E%EkZy literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_align-self-stretch.htm b/test/render/flex/flexbox_align-self-stretch.htm new file mode 100644 index 000000000..a8a94caef --- /dev/null +++ b/test/render/flex/flexbox_align-self-stretch.htm @@ -0,0 +1,44 @@ + + + +flexbox | align-self: stretch + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_align-self-stretch.htm.png b/test/render/flex/flexbox_align-self-stretch.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..40f8b2b55519df4594c6e37f8ae3da4865e8b584 GIT binary patch literal 387 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa_MkYi~RQ zGXEbqU35kw3#eSj)5S5Qg7NLugTAjF1R5T0F*skyST}*GN1MZoSz+h@Fp20kW^q2V zOS68~rEb}-5x-|*PpyDu0PG5)W^&_{U-O{@T5Dzn5&UjDP>+`Q-gypFCN6N_pM)ImeCIPqcT~eKdT2b6bta=i1qe=lxWQ z|H}IG@60EHp--FVdQ&MBb@04gl5>Hq)$ literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_box-clear.htm b/test/render/flex/flexbox_box-clear.htm new file mode 100644 index 000000000..0bc063812 --- /dev/null +++ b/test/render/flex/flexbox_box-clear.htm @@ -0,0 +1,34 @@ + + + +flexbox | cleared box + + + + + +
filler
+ +
+
Yellow box should be below the blue box
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_box-clear.htm.png b/test/render/flex/flexbox_box-clear.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..4d382dc8515fcbd2820e584f674f1c5e9abe8a02 GIT binary patch literal 896 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK53n!;Nxn}~EgWJ>?*?>opV)r7Ej%ge$+C^ zjqS|&JN};kjKQEgqiXYu`#()NnY;xenhprDOjFpv(x}RziKfkp7xr3pN&)YpXdH`kfqVIVao0bTfNtc9uAjhyZ%47-jgV&KplMTtN>P* z66YUORcnGLu*Q73z#{mh%=`4DcmHc=$-9SF87+CZ^Y=d+`T72bUq9xqe^dQ&?nUQr zR?XtG`&mxfH#{+S*recGxlUNHg?Uo&Er(N9TNT&8{`Ya$y!PjEzuWg7{&n)X?DwhD zPrW|=ecJOy?P5%uN)G29zR4DG{rBU;#ijN8%Om9N-WRs@{En+l|8gP8;Z{KP1RK8P zfBtGu_)|UMlX+D}p~BNmpP5oBW2SENKB?)kyJqWGNssOMw=eJCUI*0j$YIy)U#pE% zUK-4sulV*@%=P8zC-&vrJOBD#_gnH4^NBM49||YJ?>nDbnz7P--SJwB(!IQU*S(&% z^WFU4K=*y9e4Ui{KL7WvberGjUMxJ?(9kV6OQDHFsY9VjK$uXHKn+4%35RG^%N4{X z<4A*F&o} + + +flexbox | multicol + + + + + +
    +
  • one two three four
    • +
  • filler
    • +
  • filler
    • +
  • filler
    • +
  • filler
    • +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_columns.htm.png b/test/render/flex/flexbox_columns.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..93570db1517305d27bff306d31fc13100b565aa1 GIT binary patch literal 103 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK6&Qg8!=cBD5kN}M)5S5Qg7NKDM?nS!9_E8T z%z3pA@w}baSQ~e)Sz*HaiC3B(6a-GNrJR#goDe3i!4dg;#*W{uAQL=Y{an^LB{Ts5 DEx8`; literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_direction-column-reverse.htm b/test/render/flex/flexbox_direction-column-reverse.htm new file mode 100644 index 000000000..504c3b1c1 --- /dev/null +++ b/test/render/flex/flexbox_direction-column-reverse.htm @@ -0,0 +1,36 @@ + + + +flexbox | flex-direction: column-reverse + + + + + +
+ filler + filler + filler + filler +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_direction-column-reverse.htm.png b/test/render/flex/flexbox_direction-column-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..20822b7d6d879904fa2abe183ace026effeae4c7 GIT binary patch literal 588 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKA2Bfl$@T*8+(^H2(&)TYUY`xqQ>QP;Kj8Wuj7SIvlu$wd0KEwBW&{F zpV@sD8JyzN!>|7TFZ4ioshJW8EPB0)F>6A6{hja99T5&!m==i%Y;9P<>Y}TV#oD4% zcJJ*g|F`@>xqi3rILl2wo6D#m#`H;N<==@5pS+SPniD2>Oq1)#_e|Ld8=px`$Z-f! zSo!95obLSzN6#@cEh+E#3^j@|kh>!a)pWQ}n8S&r=XclryYf%r>a#6pZJ!w4yd%bt zq^NLy(k*#OuXXDbk7qtjoU_QGX8tus$?QJHlWZ=mlTPh>d-W4<pG3|K-&`dH!z|$V+?c_Sr86`|0Pp^%4`V xbGfj7+V>tDcY%Q~loCIDwU`W*lO literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_direction-column.htm b/test/render/flex/flexbox_direction-column.htm new file mode 100644 index 000000000..0e7f5bbf1 --- /dev/null +++ b/test/render/flex/flexbox_direction-column.htm @@ -0,0 +1,33 @@ + + + +flexbox | flex-direction: column + + + + + +
+ filler + filler + filler + filler +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_direction-column.htm.png b/test/render/flex/flexbox_direction-column.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c54628855ea4c982af043c310dcab85b2adac4b9 GIT binary patch literal 562 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKA2Bfl$%ke4U-42RkGLcWa3UP0e1n=iQ(G#s|Vn zj&^{-z16BKod5mdz8|lU#2Cok5#?}&X_1(~)`k^R1&VI&Ie&ZpF1aN)Bj2^Q*YI2a z7IM&GeG=~dUpe}#n3R#<>Fs|{Fm={OF>f+I&sfO3h)MJ7&A(Yk+hWZ4IVN0HJje_& ziPc3{Aq&-Tgb=6V^s~SB{9XClan{_YaTO=NZ`iEQcqGW7ZtEBOO`-V<6(4V@x!tcb z;l^@Ph3d~T0_F-@6N2X7T_2WnBK30vL!_*b4Q|7SfoG=jToOug0fY5l + + +flexbox | display error-handling + + + + + +
    +
  • filler
    • +
  • Antidisestablishmentarianism
    • +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_display.htm.png b/test/render/flex/flexbox_display.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..140c04c286ed5d63ef474369eaf91ff5c3996696 GIT binary patch literal 559 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK7cnsd$s>J^TY(f$fKQ0)|NsAiOyjgO|IaXV z#&B$6U|_uG>Eakt!T9!yVV<<1fLmhxq=cQdRoAPzl+!(aO=Y}TV#TbYx zwANKo-8$xdxAUajyX$W*ua@{!zCAbQ_)EPb(;D_XwVUU0+Vrg5L+1(q7l%gQOrQTD za>7ma8onh?>fP$nul^GIe%0>Up0}5`OFc>7&AYML>5Sqx)}(NO-gk~(dOP!Vk1l^Y z%`0zTQuLkU`Gw;5P0M1w{d!+D;a1X?RsCUGZ~eKyarXM78NI)+SKYgKO5(ujec_fT zqIb1zDdGLN{K4b0f38BGes=zN@T1`C-ne-k{ga(fEnqV&oBO@fxu)Qc|9{3#$4}}> z@rwKSoh;$Ok4|_zsMA22WQ%mvv4FO#nrF_y_<1 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_first-line.htm b/test/render/flex/flexbox_first-line.htm new file mode 100644 index 000000000..72789ace1 --- /dev/null +++ b/test/render/flex/flexbox_first-line.htm @@ -0,0 +1,40 @@ + + + +flexbox | first-line + + + + + +
    +
  • filler
    • +
  • Antidisestablishmentarianism
    • +
  • filler
    • +
  • Antidisestablishmentarianism
    • +
  • Antidisestablishmentarianism
    • +
  • filler
    • +
  • Antidisestablishmentarianism
    • +
  • filler
    • +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_first-line.htm.png b/test/render/flex/flexbox_first-line.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e3315bc92346571c1f8966d408e9203c3bb0c54b GIT binary patch literal 978 zcmeAS@N?(olHy`uVBq!ia0y~yV4ebGA7Nq!l5_3aHUcT00G|-o|Ns9Rr=0=v{-0sc zzQ<<v=LP9yioR9TjIKU4 zoUVD=?0}AWr>E)T`y|o|L?`~t?#b?xq4*YttShfmd!{}Z+OEp!7_ruGO03dvhp;~P2c1; z_jmOMf0K|qaL)FCP+@1-yYMI9wmx0y%U3)7mr_G-*IorV#y5B5i*uP@-1(_@KF8^F z^qR@}-+tZZ4{+-G_A5HRbR$bW>#~gJc0LFD!V;C2hNWKJw=dmtf#-Q6yT7bk8STE< zn$@QQ17*@Q3)C=cX(cA4u?9abLHi3q_nvIt`SR({q}zoaljo&g`TpbXoiC4HM&$yd z$?5d#6!{LREjRYn-7!jCd+_{byK6lkEb^G91eo01CY}J)@HFHb^NVukl- zmI*6gyZ;wj`|sIx&yK$l{eH`2E2Ey! zWg&;W>y_C+@835PmtU51c#5g`?~N{7P34z8{WI%&*Q99^cVCa)FSShSdFJ!oG8dMl zYi{BVNRd7ux0d%t)l=7o4V(r`PF{R}$?fQ|mB(u8&zL!gDd-B?&I(^!I+wxd_`CAT zsL6|`nQ47{T*va^;>P1^av7rE+dR9q-DWMPu5E+Y*6VS5_rD7H^EE8j`?SGNkDs&t z&RBEm(2rkn4I;IZZ|{5h5}3AT|6kFZ!(SM%d{;=Hcm1BnUhylx$j1q%%vsi soZL84J$kU$O;Ckoofd&l`+u@qv+aHzXH&fnm@OGRUHx3vIVCg!0A0h(eE + + +flexbox | flex: 0 0 N unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-0-0-1-unitless-basis.htm.png b/test/render/flex/flexbox_flex-0-0-1-unitless-basis.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ab79088f36dfd8d116e113502ffccd63c07bd1d0 GIT binary patch literal 603 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($(bL5-q=ND7RogrzZ;|7H`3uju|GUShbE82uf`RdzE#vR_Lm|n> zRNC^6O#LA}cYaN%C;PQP(eJL4R6IdQF7k41t@plv>#KkDrv$33R*DooxymEVb(7Yl z(1~lhQbJLM=BlQz&RlDL`PRGTUkhhko9`Yx@yyhk`Tmpd=zjZ~-;|QA;;mvo{hi9m z`Kr;g_kNA!EnfQX?4IOpzV_=q_if*HgLiXA?)~$R{{;L`yD9%;Q}ed-PoGZzSFOT+ zc>Cp^yC)q#t+1?9zrAkmIlJlao=i`gU-q-kZuOHtY$yNnPCEZ#*M8OL)l*|+;tRxc zA5S{HeA1lW{5i8#{hcR0(VcYsuI(SUzBlhm<8K|`YrARp_S(q*llN@f&3^Lm^?!9@ zC$Da~Haj!-`{iF2KHU(%1Id&m70+d^lTxAvmP$W)-TlAzejBV|jv5W6({gsL7YE0k dif2_qJ>#TavqeTpHASEl;_2$=vd$@?2>>|b5GViu literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flex-0-0-N-unitless-basis.htm b/test/render/flex/flexbox_flex-0-0-N-unitless-basis.htm new file mode 100644 index 000000000..f83dcb1d5 --- /dev/null +++ b/test/render/flex/flexbox_flex-0-0-N-unitless-basis.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 0 N unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-0-0-N-unitless-basis.htm.png b/test/render/flex/flexbox_flex-0-0-N-unitless-basis.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ab79088f36dfd8d116e113502ffccd63c07bd1d0 GIT binary patch literal 603 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($(bL5-q=ND7RogrzZ;|7H`3uju|GUShbE82uf`RdzE#vR_Lm|n> zRNC^6O#LA}cYaN%C;PQP(eJL4R6IdQF7k41t@plv>#KkDrv$33R*DooxymEVb(7Yl z(1~lhQbJLM=BlQz&RlDL`PRGTUkhhko9`Yx@yyhk`Tmpd=zjZ~-;|QA;;mvo{hi9m z`Kr;g_kNA!EnfQX?4IOpzV_=q_if*HgLiXA?)~$R{{;L`yD9%;Q}ed-PoGZzSFOT+ zc>Cp^yC)q#t+1?9zrAkmIlJlao=i`gU-q-kZuOHtY$yNnPCEZ#*M8OL)l*|+;tRxc zA5S{HeA1lW{5i8#{hcR0(VcYsuI(SUzBlhm<8K|`YrARp_S(q*llN@f&3^Lm^?!9@ zC$Da~Haj!-`{iF2KHU(%1Id&m70+d^lTxAvmP$W)-TlAzejBV|jv5W6({gsL7YE0k dif2_qJ>#TavqeTpHASEl;_2$=vd$@?2>>|b5GViu literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flex-0-0-auto-shrink.htm b/test/render/flex/flexbox_flex-0-0-auto-shrink.htm new file mode 100644 index 000000000..69b319cf7 --- /dev/null +++ b/test/render/flex/flexbox_flex-0-0-auto-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 0 auto | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-0-0-auto-shrink.htm.png b/test/render/flex/flexbox_flex-0-0-auto-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..304f96b45b970b93be00fa6a3eb78d1212b7373b GIT binary patch literal 424 zcmeAS@N?(olHy`uVBq!ia0y~yUcZ<dEicS!yW)d`$N`s@PXzgS)>JnyDEP&7Nn-a*70*c~8|@g} + + +flexbox | flex: 0 0 auto + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-0-0-auto.htm.png b/test/render/flex/flexbox_flex-0-0-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ab79088f36dfd8d116e113502ffccd63c07bd1d0 GIT binary patch literal 603 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($(bL5-q=ND7RogrzZ;|7H`3uju|GUShbE82uf`RdzE#vR_Lm|n> zRNC^6O#LA}cYaN%C;PQP(eJL4R6IdQF7k41t@plv>#KkDrv$33R*DooxymEVb(7Yl z(1~lhQbJLM=BlQz&RlDL`PRGTUkhhko9`Yx@yyhk`Tmpd=zjZ~-;|QA;;mvo{hi9m z`Kr;g_kNA!EnfQX?4IOpzV_=q_if*HgLiXA?)~$R{{;L`yD9%;Q}ed-PoGZzSFOT+ zc>Cp^yC)q#t+1?9zrAkmIlJlao=i`gU-q-kZuOHtY$yNnPCEZ#*M8OL)l*|+;tRxc zA5S{HeA1lW{5i8#{hcR0(VcYsuI(SUzBlhm<8K|`YrARp_S(q*llN@f&3^Lm^?!9@ zC$Da~Haj!-`{iF2KHU(%1Id&m70+d^lTxAvmP$W)-TlAzejBV|jv5W6({gsL7YE0k dif2_qJ>#TavqeTpHASEl;_2$=vd$@?2>>|b5GViu literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flex-0-1-1-unitless-basis.htm b/test/render/flex/flexbox_flex-0-1-1-unitless-basis.htm new file mode 100644 index 000000000..d9dfb22d7 --- /dev/null +++ b/test/render/flex/flexbox_flex-0-1-1-unitless-basis.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 1 1 unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-0-1-1-unitless-basis.htm.png b/test/render/flex/flexbox_flex-0-1-1-unitless-basis.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ab79088f36dfd8d116e113502ffccd63c07bd1d0 GIT binary patch literal 603 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($(bL5-q=ND7RogrzZ;|7H`3uju|GUShbE82uf`RdzE#vR_Lm|n> zRNC^6O#LA}cYaN%C;PQP(eJL4R6IdQF7k41t@plv>#KkDrv$33R*DooxymEVb(7Yl z(1~lhQbJLM=BlQz&RlDL`PRGTUkhhko9`Yx@yyhk`Tmpd=zjZ~-;|QA;;mvo{hi9m z`Kr;g_kNA!EnfQX?4IOpzV_=q_if*HgLiXA?)~$R{{;L`yD9%;Q}ed-PoGZzSFOT+ zc>Cp^yC)q#t+1?9zrAkmIlJlao=i`gU-q-kZuOHtY$yNnPCEZ#*M8OL)l*|+;tRxc zA5S{HeA1lW{5i8#{hcR0(VcYsuI(SUzBlhm<8K|`YrARp_S(q*llN@f&3^Lm^?!9@ zC$Da~Haj!-`{iF2KHU(%1Id&m70+d^lTxAvmP$W)-TlAzejBV|jv5W6({gsL7YE0k dif2_qJ>#TavqeTpHASEl;_2$=vd$@?2>>|b5GViu literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flex-0-1-N-unitless-basis.htm b/test/render/flex/flexbox_flex-0-1-N-unitless-basis.htm new file mode 100644 index 000000000..25f3bb093 --- /dev/null +++ b/test/render/flex/flexbox_flex-0-1-N-unitless-basis.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 1 N unitless + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-0-1-N-unitless-basis.htm.png b/test/render/flex/flexbox_flex-0-1-N-unitless-basis.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ab79088f36dfd8d116e113502ffccd63c07bd1d0 GIT binary patch literal 603 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($(bL5-q=ND7RogrzZ;|7H`3uju|GUShbE82uf`RdzE#vR_Lm|n> zRNC^6O#LA}cYaN%C;PQP(eJL4R6IdQF7k41t@plv>#KkDrv$33R*DooxymEVb(7Yl z(1~lhQbJLM=BlQz&RlDL`PRGTUkhhko9`Yx@yyhk`Tmpd=zjZ~-;|QA;;mvo{hi9m z`Kr;g_kNA!EnfQX?4IOpzV_=q_if*HgLiXA?)~$R{{;L`yD9%;Q}ed-PoGZzSFOT+ zc>Cp^yC)q#t+1?9zrAkmIlJlao=i`gU-q-kZuOHtY$yNnPCEZ#*M8OL)l*|+;tRxc zA5S{HeA1lW{5i8#{hcR0(VcYsuI(SUzBlhm<8K|`YrARp_S(q*llN@f&3^Lm^?!9@ zC$Da~Haj!-`{iF2KHU(%1Id&m70+d^lTxAvmP$W)-TlAzejBV|jv5W6({gsL7YE0k dif2_qJ>#TavqeTpHASEl;_2$=vd$@?2>>|b5GViu literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flex-0-1-auto.htm b/test/render/flex/flexbox_flex-0-1-auto.htm new file mode 100644 index 000000000..e4483cd21 --- /dev/null +++ b/test/render/flex/flexbox_flex-0-1-auto.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 1 auto + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-0-1-auto.htm.png b/test/render/flex/flexbox_flex-0-1-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ab79088f36dfd8d116e113502ffccd63c07bd1d0 GIT binary patch literal 603 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($(bL5-q=ND7RogrzZ;|7H`3uju|GUShbE82uf`RdzE#vR_Lm|n> zRNC^6O#LA}cYaN%C;PQP(eJL4R6IdQF7k41t@plv>#KkDrv$33R*DooxymEVb(7Yl z(1~lhQbJLM=BlQz&RlDL`PRGTUkhhko9`Yx@yyhk`Tmpd=zjZ~-;|QA;;mvo{hi9m z`Kr;g_kNA!EnfQX?4IOpzV_=q_if*HgLiXA?)~$R{{;L`yD9%;Q}ed-PoGZzSFOT+ zc>Cp^yC)q#t+1?9zrAkmIlJlao=i`gU-q-kZuOHtY$yNnPCEZ#*M8OL)l*|+;tRxc zA5S{HeA1lW{5i8#{hcR0(VcYsuI(SUzBlhm<8K|`YrARp_S(q*llN@f&3^Lm^?!9@ zC$Da~Haj!-`{iF2KHU(%1Id&m70+d^lTxAvmP$W)-TlAzejBV|jv5W6({gsL7YE0k dif2_qJ>#TavqeTpHASEl;_2$=vd$@?2>>|b5GViu literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flex-0-N-auto.htm b/test/render/flex/flexbox_flex-0-N-auto.htm new file mode 100644 index 000000000..2f1a9338c --- /dev/null +++ b/test/render/flex/flexbox_flex-0-N-auto.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 0 N auto + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-0-N-auto.htm.png b/test/render/flex/flexbox_flex-0-N-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ab79088f36dfd8d116e113502ffccd63c07bd1d0 GIT binary patch literal 603 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($(bL5-q=ND7RogrzZ;|7H`3uju|GUShbE82uf`RdzE#vR_Lm|n> zRNC^6O#LA}cYaN%C;PQP(eJL4R6IdQF7k41t@plv>#KkDrv$33R*DooxymEVb(7Yl z(1~lhQbJLM=BlQz&RlDL`PRGTUkhhko9`Yx@yyhk`Tmpd=zjZ~-;|QA;;mvo{hi9m z`Kr;g_kNA!EnfQX?4IOpzV_=q_if*HgLiXA?)~$R{{;L`yD9%;Q}ed-PoGZzSFOT+ zc>Cp^yC)q#t+1?9zrAkmIlJlao=i`gU-q-kZuOHtY$yNnPCEZ#*M8OL)l*|+;tRxc zA5S{HeA1lW{5i8#{hcR0(VcYsuI(SUzBlhm<8K|`YrARp_S(q*llN@f&3^Lm^?!9@ zC$Da~Haj!-`{iF2KHU(%1Id&m70+d^lTxAvmP$W)-TlAzejBV|jv5W6({gsL7YE0k dif2_qJ>#TavqeTpHASEl;_2$=vd$@?2>>|b5GViu literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flex-1-0-auto-shrink.htm b/test/render/flex/flexbox_flex-1-0-auto-shrink.htm new file mode 100644 index 000000000..9ca1411b2 --- /dev/null +++ b/test/render/flex/flexbox_flex-1-0-auto-shrink.htm @@ -0,0 +1,40 @@ + + + +flexbox | flex: 1 0 auto | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-1-0-auto-shrink.htm.png b/test/render/flex/flexbox_flex-1-0-auto-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..304f96b45b970b93be00fa6a3eb78d1212b7373b GIT binary patch literal 424 zcmeAS@N?(olHy`uVBq!ia0y~yUcZ<dEicS!yW)d`$N`s@PXzgS)>JnyDEP&7Nn-a*70*c~8|@g} + + +flexbox | flex: N 0 auto | shrinking + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-N-0-auto-shrink.htm.png b/test/render/flex/flexbox_flex-N-0-auto-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..2ba886edeb0c0dfa7268a1fc09d693c9056572d0 GIT binary patch literal 426 zcmeAS@N?(olHy`uVBq!ia0y~yU5et4FV4Gb|Kw76_5IDipT~Ure<^(T{kuWm z|LRYjc5k`s_Ln+!zMf=(bmiE*<++dQjl6}sy^mF&t`aT5( NxTmY1%Q~loCIE#zzc>H@ literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flex-initial-2.htm b/test/render/flex/flexbox_flex-initial-2.htm new file mode 100644 index 000000000..02acae5a6 --- /dev/null +++ b/test/render/flex/flexbox_flex-initial-2.htm @@ -0,0 +1,45 @@ + + + +flexbox | flex: initial + + + + + +
+ one + two + three + four +
+ +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-initial-2.htm.png b/test/render/flex/flexbox_flex-initial-2.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c487b725d14568f940550fa47f546f9fc3e16ef1 GIT binary patch literal 581 zcmeAS@N?(olHy`uVBq!ia0y~yV4B3hz-Yq63>10fZ9N-EaR&H=xc>kDAIM~2_#YhX zb^)m3yQhm|NCo5Ds~dd}JBTzSnr}aNSIFmKn_X)@=Q0njDz1no&5eRV1s(jHvM*Tc z>v!$3c^$lHInN{&&!GERANby%YQKKNHZX{-XOdCUlqrIX@2vl1QSKuIYqj>z3rT=_pwg=h2UpIBoM{_}1Dk?#_p*Z5He9 z|Hzzkf4%M0?f>~b$pJTmB`v*9bp!^vfj#g$Km>RouH%)YYkA6MR=@iw$lDthytwQII7$a(uW{psV7WhSxpk4{gy{B4cT&Sh8M zRZe?$Hs-hH{L6p#Z24Jhn*KCt-#zWe^EKbkKDBV=n;+f!r-JI2opD|{zx?{CJCQTD z>pzix`e~8P{U6_C<@NI_Y@=na=l?M|_x}34Q@8)OFChoKS=l3_ntDV-QyJueQ?**z hANZP8JSSb*YQClTz&rh$Z%aUF!PC{xWt~$(69Czv9p3-| literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flex-natural-mixed-basis-auto.htm b/test/render/flex/flexbox_flex-natural-mixed-basis-auto.htm new file mode 100644 index 000000000..c81c8b50c --- /dev/null +++ b/test/render/flex/flexbox_flex-natural-mixed-basis-auto.htm @@ -0,0 +1,42 @@ + + + +flexbox | flex: larger integer, mixed basis, auto + + + + + + + +
+ a + aaa + aaaaa + aaaaaaaaaaaaaaa +
+ + + diff --git a/test/render/flex/flexbox_flex-natural-mixed-basis-auto.htm.png b/test/render/flex/flexbox_flex-natural-mixed-basis-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d288537188945fff723c4e3e94d013bfc96f2d69 GIT binary patch literal 396 zcmeAS@N?(olHy`uVBq!ia0y~yU~&MmC$KOBNg>gbU@E{T#PvT2F#JDodhLy84Gj%I z*-b|t_%JXqntHl8hEy=Vy>dFUAwZz*;+6-8*jTg$tS>Ot`21gcq?hH4(isl5BcBi6 zKalwD?*tXks$$<=>+Tfnez}o>k%{GnKf_i*&jogitfy!9NUS?;>h5!Os{V@DP2yM9 z$DfY9u%kBqUDLC@`(Cl?zT}QNzf?bCw_dGdb*bwDkN688cU&vBT<|zB_xjU@zT=z1 z**Pw(XZYD%$B=cY^l95|-+opO0R@K!kUfKg@nwFaisz)b8|u}Gf$g#uLZ5-*$l&Sf K=d#Wzp$PyPCw#jA literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flex-none.htm b/test/render/flex/flexbox_flex-none.htm new file mode 100644 index 000000000..edc748d95 --- /dev/null +++ b/test/render/flex/flexbox_flex-none.htm @@ -0,0 +1,46 @@ + + + +flexbox | flex: none + + + + + +
+ one + two + three + four +
+ +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flex-none.htm.png b/test/render/flex/flexbox_flex-none.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e0990312648690f5ca3b6dd8bbd910d09a3ed42b GIT binary patch literal 529 zcmeAS@N?(olHy`uVBq!ia0y~yU=m_rU^HQ328yuw8O;JxoB=)|uK)l42QnEL{s#xU zT>z>$?CIhdQo;E4ilHBqqe#QU%x7%I(?5vZz7c$8cgymIrh88M4>ejZNhjQ&i{PRzL^Kk@&jb2C1{=Rwm`HE@U_fFxI|Yu(EZ|EQf3y7!=_ q2GL+zPZJm<)pkYf@CABdSH*kB38BUlyVP|-@#^X7=d#Wzp$PywG2D0n literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flow-column-reverse-wrap-reverse.htm b/test/render/flex/flexbox_flow-column-reverse-wrap-reverse.htm new file mode 100644 index 000000000..0774e8023 --- /dev/null +++ b/test/render/flex/flexbox_flow-column-reverse-wrap-reverse.htm @@ -0,0 +1,36 @@ + + + +flexbox | flex-flow: column-reverse wrap-reverse + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flow-column-reverse-wrap-reverse.htm.png b/test/render/flex/flexbox_flow-column-reverse-wrap-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c9b70aeef7b6cab2c1c6321a6bea49cf802fa57c GIT binary patch literal 322 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@MNG^UA1vhbU#PaXd$+1lYs?aVLEVX(&Z>IOFIhe$NLQUN z`2LzX@q(6%%ap17?|!Y`SKt3uSQG|KBj=tjoBmsPV(hM0hF{HO1C?K=2Z{>^2i^~! zzD=lm{??g6%l~d(x4Sv(f%t{(i&xEy5*5B5o}O=A{lQ*LRP<}>m5B=%!9d#T;+yY^ z>XkN~4$GfBFD7=)tX(s1Z2NVwZ136q=~Hj*)4Kg?`WJKAttl&_R)yaWubw?`R~=Kj zZhvTc{Pl^}3xxJFum2+F;Ocrd(7mk-2!1X9^Rh5y&VT~K)78&q Iol`;+09DA0djJ3c literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flow-column-reverse-wrap.htm b/test/render/flex/flexbox_flow-column-reverse-wrap.htm new file mode 100644 index 000000000..e3b631fb9 --- /dev/null +++ b/test/render/flex/flexbox_flow-column-reverse-wrap.htm @@ -0,0 +1,36 @@ + + + +flexbox | flex-flow: column-reverse wrap + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flow-column-reverse-wrap.htm.png b/test/render/flex/flexbox_flow-column-reverse-wrap.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..572dd56c09570355acd697c65587a589801d3a9d GIT binary patch literal 324 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@MNG^E-~Cy-ude4UuP6+dM$SF;*6+IT#Mo_C+ZVi&%u1QQR&SY7S$wR| zuOQp1>-(mjh`k=0oA@=gJ<2G=c7fH-h$p;f*1nIC|JCj4>RPK-nz8~8ZoUf1E8jJ* zOGkjX&$=;;{aeQLFNE>vv{%u6q65 z;%k!DM010mtK9A%5d6;`5E%G + + +flexbox | flex-flow: column wrap-reverse + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flow-column-wrap-reverse.htm.png b/test/render/flex/flexbox_flow-column-wrap-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e3b1b681f5f43947e91d231c5067be7c84eea67f GIT binary patch literal 326 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@MNG^UA1vhbU#PaXd$+0)YwQw#LEVX(&a7^$0&EzSQXJn) zzN@QM;F;Ok(c$*gy8M6W{r%tH3X1~4SAX5Pv;TgpQQ9QE)=q8j4y$OhQp1g`BGU@3$sqm+q-_7nQrM%mUFZELc8@}pRisaRL_2{gny2wY;pGD zMKI78=pFSQZ05QupIV>jD<^)1Ub%TBGle?I>y@Dt6nV) zHT<|QYR|hj59;4My=u7KObZ3PiVV5Gvsy`Mk>g*6s?FQxT#Vrn0|kbstDnm{r-UW| D8=Z?V literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flow-column-wrap.htm b/test/render/flex/flexbox_flow-column-wrap.htm new file mode 100644 index 000000000..33dfe03be --- /dev/null +++ b/test/render/flex/flexbox_flow-column-wrap.htm @@ -0,0 +1,35 @@ + + + +flexbox | flex-flow: column wrap + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flow-column-wrap.htm.png b/test/render/flex/flexbox_flow-column-wrap.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..75b3343fc1e443b9c7be8357d9bcc19a21789a2b GIT binary patch literal 327 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@MNG^UA1vhbKd831d$+0)Yv>MtLEVX(&a7??41pzXB^z}2 zJpXo`UCe}AP%!nWb@{)bc>8Z}c}0QXYxG-b{ogNtxu$АB=f>%dZb>^=Ad}HP5 zSKpTZ(zB{txY;ZB_3io8_}1le(F@dh^PT+|`>;Myzr_Z?#Rx^7W?Gx@-2`Sul+! zlz&B;c=w&gmA!Lc$Nt~A!g9Tt77BQ^dBwis=T0szp0!LzRJP4oqvxax3Jp(JKbLh* G2~7anQ;ysK literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flow-row-wrap-reverse.htm b/test/render/flex/flexbox_flow-row-wrap-reverse.htm new file mode 100644 index 000000000..6fc984c0d --- /dev/null +++ b/test/render/flex/flexbox_flow-row-wrap-reverse.htm @@ -0,0 +1,34 @@ + + + +flexbox | flex-flow: row wrap-reverse + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flow-row-wrap-reverse.htm.png b/test/render/flex/flexbox_flow-row-wrap-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..1a181cd7d2b1ab7bd178c4f251101e7ebc12588a GIT binary patch literal 315 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@CMISenfYnOb0EbT;1lBd|Nnm=lY!xXaIo72 zApO?U#WAFU@$Hq36Pq1)S|9peX}rP`np0%ic;!gwLAEF2GQKfWw;S}#-FT>(t>^xE z3*q~3Bm$f`6h)@W#_V5lzyA0)W>Kw>6#??EF5Gx?x2io|FG_c2?JCz5s`J?3;J>|9&BLL&N@4yRZD*wa@B?&FwmNuXV=9me*|z zNZw`!G;g6(D;LOM!&eiwy}o8`Qyd=Xy>GSEDviwOxl>k}eh;bdeErliyZW8#*X;RP zVhf9^_)AM{Za=+k6!hP^;J9r8t7%%cGti7z>8r~MYC$f(V(%@=;iPjiWELm{JYD@< J);T3K0RY~OgsK1l literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_flow-row-wrap.htm b/test/render/flex/flexbox_flow-row-wrap.htm new file mode 100644 index 000000000..880ed3d76 --- /dev/null +++ b/test/render/flex/flexbox_flow-row-wrap.htm @@ -0,0 +1,34 @@ + + + +flexbox | flex-flow: row wrap + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_flow-row-wrap.htm.png b/test/render/flex/flexbox_flow-row-wrap.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..303d31699409aab3af94fe7ef81d4178e39d211d GIT binary patch literal 315 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@CMISenfYnOb0EbT;1lBd|Nnm=lY!xXaIo72 zApO?U#WAFU@$Hq36Pq1)S|9peX}rP`np0%ic;!gwLAEF2GQKfWw;S}#-FT>(t>^xE z3*q~3Bm$f`6h)@W#_V5lzyA0)W>Kw>6#??EF5Gx?x2iq;omSS#@=$kC)!fySjkZ3U z_e#HTuT6UH`Mpc(-Uc643h{ftu&*zDcTKe0t9tf#JJ{DPIF^&UB4D9YD;L^i(#_>jEm5C-zFM* + + +flexbox | flexcontainer via generated content + + + + + +
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_generated-flex.htm.png b/test/render/flex/flexbox_generated-flex.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..3466de6b5d12339e29d424ca16b883141ef3903a GIT binary patch literal 241 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKgP53smdKI;Vst0MVaSk^lez literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_generated-nested-flex.htm b/test/render/flex/flexbox_generated-nested-flex.htm new file mode 100644 index 000000000..48fc8c575 --- /dev/null +++ b/test/render/flex/flexbox_generated-nested-flex.htm @@ -0,0 +1,27 @@ + + + +flexbox | flexcontainer via generated content + + + + + +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_generated-nested-flex.htm.png b/test/render/flex/flexbox_generated-nested-flex.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..3466de6b5d12339e29d424ca16b883141ef3903a GIT binary patch literal 241 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKgP53smdKI;Vst0MVaSk^lez literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_generated.htm b/test/render/flex/flexbox_generated.htm new file mode 100644 index 000000000..53285a074 --- /dev/null +++ b/test/render/flex/flexbox_generated.htm @@ -0,0 +1,32 @@ + + + +flexbox | flexcontainer vs generated content + + + + + +
+

FAIL

+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_generated.htm.png b/test/render/flex/flexbox_generated.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ce63e0a9434d18dc59f29fe61dcfa93d30ff592f GIT binary patch literal 251 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK1DKeB7S!pexZwvypZav=OU9Bg-ZFDCDVmGrd*ut zaOsbrqRk1x#p~<+UKdMvM82~Me3kEHFhQ)CQ{lIMD~F(xONW4>QwxxxBKqVd=R(z% mX#!DB8BoSfg|xJ^+qI0pUbd{uR8#&0a=oXkpUXO@geCw2b6p1j literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_item-bottom-float.htm b/test/render/flex/flexbox_item-bottom-float.htm new file mode 100644 index 000000000..821102472 --- /dev/null +++ b/test/render/flex/flexbox_item-bottom-float.htm @@ -0,0 +1,34 @@ + + + +flexbox | GCPM bottom float + + + + + +
+

+

+

+

+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_item-bottom-float.htm.png b/test/render/flex/flexbox_item-bottom-float.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bc7d80a9476d3f0153d9be8709f388978590ffb6 GIT binary patch literal 163 zcmeAS@N?(olHy`uVBq!ia0y~yU_1b1H!v{+$%iR{7C?$Kz$e7@|Ns9$rg7StpPU=? zfUHnY7srqa# + + +flexbox | cleared item + + + + + +
filler
+ +
+
Yellow box should be to the right of the blue box, and + never below
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_item-clear.htm.png b/test/render/flex/flexbox_item-clear.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..7f8e75d72064c2abeef4d311f6bf1140f944653d GIT binary patch literal 684 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKConMs$zGf1!a#~Az$e7@|NsBSX=nbQ0rDBF zG&J}=x7@nT z&V5t=Wv_C);=>Jj=ey=k9Ewj2`R)spvAJGYz#%2#*sPQhz{1l2e(U+vz-JTbQ4YuFXQ!qTdX$U(4C|;(OY}s zoNG#DlOhggPn?q_xO;NGtJjh`{`?~|0WYx!D9(Z6B@|BI~ZY6*2cWGi?- zp|fR|Qg=s2mS+8nYxS!5W!`)hBabWD6MoG(`7}o|XwO{JZ~o__?I)Hv zOI^;*iZO0counHbwP|LDZRX53oVIVbsL9Q}o~!UlVD`P#oJ}GP9@6u)HoaYZqw&Q5 sCvWB80Sb;EtdT|~!N + + +flexbox | floated item + + + + + +
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_item-float.htm.png b/test/render/flex/flexbox_item-float.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..71a3008ff05682d2e9ce25e2cb5ac275a180952e GIT binary patch literal 224 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK8bG(WD!FtBC_1%pU@)#Ym8oFUie%PINhSt{54)u+qxQaZ Tu`Xo+x{krq)z4*}Q$iB}|7J_S literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_item-top-float.htm b/test/render/flex/flexbox_item-top-float.htm new file mode 100644 index 000000000..16bea62c2 --- /dev/null +++ b/test/render/flex/flexbox_item-top-float.htm @@ -0,0 +1,33 @@ + + + +flexbox | floated item + + + + + +
+

+

+

+

+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_item-top-float.htm.png b/test/render/flex/flexbox_item-top-float.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bc7d80a9476d3f0153d9be8709f388978590ffb6 GIT binary patch literal 163 zcmeAS@N?(olHy`uVBq!ia0y~yU_1b1H!v{+$%iR{7C?$Kz$e7@|Ns9$rg7StpPU=? zfUHnY7srqa# + + +flexbox | vertical-align + + + + + +
+

+

+

+

+

+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_item-vertical-align.htm.png b/test/render/flex/flexbox_item-vertical-align.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..62a6f301773e73e14692dd6b14b7c16627fdf9fa GIT binary patch literal 208 zcmeAS@N?(olHy`uVBq!ia0y~yV9Elri

!d!14!l+djq*MYOtQKYa_l~zIxBWrWo4f7rn+0p zR5#A-MFzSGW@cvFzUREI+j=)H{(TMxsNax!^cXUjCLk>>eY^N}#~O1_t=o)NFFM#X TFW%$@I)%a0)z4*}Q$iB}aG_F> literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_justifycontent-spacearound-negative.htm b/test/render/flex/flexbox_justifycontent-spacearound-negative.htm new file mode 100644 index 000000000..e7f8444b7 --- /dev/null +++ b/test/render/flex/flexbox_justifycontent-spacearound-negative.htm @@ -0,0 +1,39 @@ + + + +flexbox | justify-content: space-around / negative + + + + + +

+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_justifycontent-spacearound-negative.htm.png b/test/render/flex/flexbox_justifycontent-spacearound-negative.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..44e7ae5cecd0275d23753351122b4baf0cc915ab GIT binary patch literal 359 zcmeAS@N?(olHy`uVBq!ia0y~yVAKS%7qKt{$@kmUM2jkkvUY(86$Nh&Y@cdz~8{PoMGUMnpKSS7nM?)TSw>-IgYh`rr?bDqcQh}L z*_9vqlkeRV`Svc-z^mz5+<{Q=)>Sn6rGn?AC0ezN0lp`BwSMl@0EL#PtDnm{r-UW| DR-~g; literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_justifycontent-spacebetween-negative.htm b/test/render/flex/flexbox_justifycontent-spacebetween-negative.htm new file mode 100644 index 000000000..6e431f659 --- /dev/null +++ b/test/render/flex/flexbox_justifycontent-spacebetween-negative.htm @@ -0,0 +1,39 @@ + + + +flexbox | justify-content: space-between / negative + + + + + +
+ one + two + three +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_justifycontent-spacebetween-negative.htm.png b/test/render/flex/flexbox_justifycontent-spacebetween-negative.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d98579cf4c7742e4ae1098d40a68c833585be80b GIT binary patch literal 361 zcmeAS@N?(olHy`uVBq!ia0y~yU^E1>7qKt{$=m0iGXW`~0G|-o|Ns93nG6gd`u~B` zYi~T8p7k*bs9ea?#WAFU@$J<>ufq-k4G-fIw^%xCv2{4hIVDbkf9LJ2Tm;2`ZjJ)vnsL6K!p_2Ku`}!8gxuHfz2YefC}cx+>rN{QTu#kNsDu zw#}Q|dv}WbruP$FZQ_dBDz#E-j~Esfp55#=?R@!To7f{$(r0Q#&R=%gXluFI>8^GE z&L#CcJ##a-Y>%_qUG450;nUt5+|S}l{ymp>_vvXr-)`D8`*Z%9B6I(pQ&RP{%RkRK z{X_Bgw%PSB?sxW(2y)zS`d^ZGyzAr_`hmjB)78&qol`;+ E0HkcGl>h($ literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_justifycontent-spacebetween-only.htm b/test/render/flex/flexbox_justifycontent-spacebetween-only.htm new file mode 100644 index 000000000..812a6a005 --- /dev/null +++ b/test/render/flex/flexbox_justifycontent-spacebetween-only.htm @@ -0,0 +1,35 @@ + + + +flexbox | justify-content: space-between | single item + + + + + +
+ one +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_justifycontent-spacebetween-only.htm.png b/test/render/flex/flexbox_justifycontent-spacebetween-only.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..636907279614e194eca6303d6dfb8d81219b20ec GIT binary patch literal 233 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRFJfW_lE>MW14#zX0G|-o|NsAk*bM)JgWWCw z>Ditxjv*C{Z?A0RJ!Bx_8fbn`A+jkms7C*wh{;RM8BLmwAs#E&s;fS)YEbs}-|snT ziLseeuKnMC=e{ht{IbMqu3c#TmSl6Q+Ex3mN9_&zwOapvd2Frh#r?;_reFOYRh9QS ye4iOmncs4-YMj*nDkX@b&tC+yvL~s$Y^h~<6%);5S81>i + + +flexbox | margin: auto in overflow + + + + + +
+ one + two +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_margin-auto-overflow.htm.png b/test/render/flex/flexbox_margin-auto-overflow.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..33425b1c489dbde6ba42e6a0fbe491ad3b1aeaaa GIT binary patch literal 348 zcmeAS@N?(olHy`uVBq!ia0y~yV7>@sFJfW_lGY5%gn$%JfKQ0)|NsAiOa=xJ&24&C znSp_k+tbA{q=ND7)s4BW1|n^NQf3W>N|*Nh6Ww;B(XKQsfp6IfF`q|PC%FPA)W0mW z<4=%{-c>$9#dDI1XL!hATjf`8PizZD0s9+%*%rMv(78Wz--_Mezj^xJb^fbSEa_eU zbJk yuku%KPt5J#V~Jww*R59z&UZus{W3}A?`C;@{ioYboj9cd3L;NeKbLh*2~7YxM}T?& literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_margin.htm b/test/render/flex/flexbox_margin.htm new file mode 100644 index 000000000..f5dbba6da --- /dev/null +++ b/test/render/flex/flexbox_margin.htm @@ -0,0 +1,22 @@ + + + +flexbox | margins + + + + + +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_margin.htm.png b/test/render/flex/flexbox_margin.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b9d24bbb69fd429e36c3dab7f32ce45e103a2ee8 GIT binary patch literal 122 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK6BvO6!`a>1CP2#3)5S5Qg7NKHMqUO59_9@{ z&3U!l4&9f^IL9p1>7o=lafz4GL=P1Z8<~2te~BMR;PGVc2B}X+E^3{e0W#Fn)z4*} HQ$iB}El4BJ literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_nested-flex.htm b/test/render/flex/flexbox_nested-flex.htm new file mode 100644 index 000000000..23109575d --- /dev/null +++ b/test/render/flex/flexbox_nested-flex.htm @@ -0,0 +1,28 @@ + + + +flexbox | nested flexcontainer + + + + + +
+

xxx

+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_nested-flex.htm.png b/test/render/flex/flexbox_nested-flex.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..3466de6b5d12339e29d424ca16b883141ef3903a GIT binary patch literal 241 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKgP53smdKI;Vst0MVaSk^lez literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_object.htm b/test/render/flex/flexbox_object.htm new file mode 100644 index 000000000..3f745c30e --- /dev/null +++ b/test/render/flex/flexbox_object.htm @@ -0,0 +1,26 @@ + + + +flexbox | object fallback as a flex item + + + + + +
+ this is supposed to be a flex item +

this is supposed to be a flex item

+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_object.htm.png b/test/render/flex/flexbox_object.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..cee494f6e289a91be74fda7d954fe1db9b725997 GIT binary patch literal 388 zcmV-~0ek+5P)O0d7#^4BhSm_a=BctF}=SFCg|Ojfy2KBiGUCaU)K0T2_Q;>+g7M?xfx2l0b<}V z2PAGctw1gv&Okcq+N@{SAd?-AKpHlTC0BYyVy>8YFJrF!2f+CnH47yp@;^{`w_zW| zz~Q7LDHN`TMx^!fNX9kcsJYgUZpw-qkLe>_c4W50IEd6$Z0Oho3-5H&i36)k+{0+tmxcY!J43!99?v4l_ZvFW3yE<8TBL zsJW5m0=+JgrbN}5qH~3Ro^~@uzTk+I`3 i1|425m&@gH4e1k+ig6CT%Z~5>0000 + + +flexbox | flex-flow: column-reverse wrap-reverse; order + + + + + +
+
+ one + two +
+ +
+ three + four +
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_order-box.htm.png b/test/render/flex/flexbox_order-box.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..eb2a5e2fff61aab5dcad049e8a3f863c4f378757 GIT binary patch literal 426 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK%bA#gWLxbSO(4Y+;1lBd|Nnm=lYs$5bDN%3 zW?*29^mK6ysbGA2bz|Nq1AzmD)gS)o{;2)Ldvm?eapwzQ7KsXq;DQcmBw-{g_i{3K7(W0$#$ zn3bTyeFbsfS)b~At@wA=_$;~M|L;JZ!=@D}E1g49!e?jOOuR8Y|BaS z{--;yJfEc)YrG_y;Zq7br)PC;Q_F0HUHh$7eEvSKW1YEMp~1(osB%xl-mT|?(()Rf zwB24I@;%ZgZ>_<7aTT2}a-3oME+F?siXPb{c*F?iRFIo<_=OqHs)`J4v)78&qol`;+0F^?p&;S4c literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_order-noninteger-invalid.htm.png b/test/render/flex/flexbox_order-noninteger-invalid.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a766852212a1dd25a5ef901343b766eedd73bd2d GIT binary patch literal 92 zcmeAS@N?(olHy`uVBq!ia0vp^CxEzt5lAqkX-FFZDP>O=$B+ufw + + +flexbox | flex-flow: column-reverse wrap-reverse; order + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_order.htm.png b/test/render/flex/flexbox_order.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b043d02fba13a1ae3753ba5921ff3be472804183 GIT binary patch literal 436 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@MJ&uf@}XQrA&?RZ@CkAK|NlRb$-wac|AEs$ zCJ-JKQdkUB9_#7i7*fIb_G+}(;Q)d5k0+h)8Jluv?9o|J#_A;=!18^+sJi&lkbqM& z5BxW|-|igO^2cJHp_>a3ESa|YyYgMzEOQ0dE|HZb9ut*ZSIGt~@tBy^E}|K<pyK)sFLmW zt#e*xT{^gzf6e?yGZpX7-df0bi{bXpy?@pI)Gk|Ga!GCO%QZb4Z=e5epSgdM$?tjV z)N&_wc_+VIzSsZO- + + +flexbox | flexcontainer versus stf :: abspos + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_stf-abspos.htm.png b/test/render/flex/flexbox_stf-abspos.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bb85baad6dd0638233fe91b44a7d373603443fa9 GIT binary patch literal 116 zcmeAS@N?(olHy`uVBq!ia0y~yV6*{ZAOr%oW8Z6ml(naeV@L(#+f#}_Q4VH + + +flexbox | flexcontainer versus stf :: fixed + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_stf-fixpos.htm.png b/test/render/flex/flexbox_stf-fixpos.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0a2c6183753e9e6f5eb27b58c8a7602cf032f7b8 GIT binary patch literal 78 zcmeAS@N?(olHy`uVBq!ia0vp^93adHBpBY5G^+tAQBN1gkP61ogN7hc2ZO)f#kW5& X+h1V+$*}kDU64XgS3j3^P6 + + +flexbox | flexcontainer versus stf :: float + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_stf-float.htm.png b/test/render/flex/flexbox_stf-float.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bb85baad6dd0638233fe91b44a7d373603443fa9 GIT binary patch literal 116 zcmeAS@N?(olHy`uVBq!ia0y~yV6*{ZAOr%oW8Z6ml(naeV@L(#+f#}_Q4VH + + +flexbox | flexcontainer versus stf :: inline-block + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_stf-inline-block.htm.png b/test/render/flex/flexbox_stf-inline-block.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bb85baad6dd0638233fe91b44a7d373603443fa9 GIT binary patch literal 116 zcmeAS@N?(olHy`uVBq!ia0y~yV6*{ZAOr%oW8Z6ml(naeV@L(#+f#}_Q4VH + + +flexbox | flexcontainer versus stf :: table-caption + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_stf-table-caption.htm.png b/test/render/flex/flexbox_stf-table-caption.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..19332923713c98a57ea503f117dde72e5adb66bc GIT binary patch literal 81 zcmeAS@N?(olHy`uVBq!ia0vp^3Lwk~Bp9L@-6MgNgr|#RNCo5BBZeT+CWGJ8#gaB8 a?>@wM>t%i8`pqpFAhn*ZelF{r5}E*uW)$H7 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_stf-table-cell.htm b/test/render/flex/flexbox_stf-table-cell.htm new file mode 100644 index 000000000..d456db2d0 --- /dev/null +++ b/test/render/flex/flexbox_stf-table-cell.htm @@ -0,0 +1,38 @@ + + + +flexbox | flexcontainer versus stf :: table cell + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_stf-table-cell.htm.png b/test/render/flex/flexbox_stf-table-cell.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bb85baad6dd0638233fe91b44a7d373603443fa9 GIT binary patch literal 116 zcmeAS@N?(olHy`uVBq!ia0y~yV6*{ZAOr%oW8Z6ml(naeV@L(#+f#}_Q4VH + + +flexbox | flexcontainer versus stf :: table row group + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_stf-table-row-group.htm.png b/test/render/flex/flexbox_stf-table-row-group.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bb85baad6dd0638233fe91b44a7d373603443fa9 GIT binary patch literal 116 zcmeAS@N?(olHy`uVBq!ia0y~yV6*{ZAOr%oW8Z6ml(naeV@L(#+f#}_Q4VH + + +flexbox | flexcontainer versus stf :: table row + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_stf-table-row.htm.png b/test/render/flex/flexbox_stf-table-row.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bb85baad6dd0638233fe91b44a7d373603443fa9 GIT binary patch literal 116 zcmeAS@N?(olHy`uVBq!ia0y~yV6*{ZAOr%oW8Z6ml(naeV@L(#+f#}_Q4VH + + +flexbox | flexcontainer versus stf :: table + + + + + +
+
+

filler

+

filler

+

filler

+

filler

+

filler

+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_stf-table.htm.png b/test/render/flex/flexbox_stf-table.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bb85baad6dd0638233fe91b44a7d373603443fa9 GIT binary patch literal 116 zcmeAS@N?(olHy`uVBq!ia0y~yV6*{ZAOr%oW8Z6ml(naeV@L(#+f#}_Q4VH + + +flexbox | visibility: collapse and line wrapping + + + + + +
+

filler

+

filler

+

FAIL

+

FAIL

+

filler

+

filler

+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_visibility-collapse-line-wrapping.htm.png b/test/render/flex/flexbox_visibility-collapse-line-wrapping.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b90ec28cd82329eee6c9baaf2a0eed12008cbbfc GIT binary patch literal 395 zcmeAS@N?(olHy`uVBq!ia0y~yV2T2=CowSt$p?Zxoj{5+z$e5NNE@e}`G1Dt)8@za z3=E96o-U3d6^w7MZsa^{Aky-%-Rt{3#SAX}hqWzgg_`%K6o#}cx#rmS;s2}t^G3%W z-m0@IdvK`rv|7xLf}bs~<6}%^v-hn#k$cB|vvAN#*B zUbw(B=J(4RjojjTvkM*`dMd0Jv!muvEBAE&9R&|Raf<83*gXU~KppG=prZMhicVe+ zy}a?+>#jS;YDKbltrY8@b=&4O@7*gUOV2Hxl_i*ZrhSiB|5d|>SAN@mTYdHG?;zjW zok7pNX0CP(-^mgz|9z^_^n_D4O;5ePBY$z1w^`~R`Cq1t(~oSO-zN)n!zPFueu+=d a^gq7lbjN + + +flexbox | visibility: collapse + + + + + +
+

filler

+

FAIL

+

filler

+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_visibility-collapse.htm.png b/test/render/flex/flexbox_visibility-collapse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..294a0821d480e0264d3c6498369dc02e69cfb1e7 GIT binary patch literal 318 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKgP53sw%c)wm+WwzY;TYAv*@5aBk7|qsJyvX>_X6@gg_d%B@ zoOx#C(QBi!S@05H857HPfnoU89ZJ6T-G@yGywn%3Wb*d literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_width-overflow.htm b/test/render/flex/flexbox_width-overflow.htm new file mode 100644 index 000000000..94175b786 --- /dev/null +++ b/test/render/flex/flexbox_width-overflow.htm @@ -0,0 +1,30 @@ + + + +flexbox | overflow + + + + + +
+

one two three four

+

filler

+

filler

+

filler

+

filler

+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_width-overflow.htm.png b/test/render/flex/flexbox_width-overflow.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8832cc7aea565c16425bc0ba025c2718e0ca7789 GIT binary patch literal 80 zcmeAS@N?(olHy`uVBq!ia0vp^0ze$V2qYLRE}U2Zq{Ka4978G?pB`f51@aCl{GNVH dA-(4c^DejfiL>6%Y6J>0c)I$ztaD0e0sz5!70>_x literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_wrap-reverse.htm b/test/render/flex/flexbox_wrap-reverse.htm new file mode 100644 index 000000000..b1aaee73b --- /dev/null +++ b/test/render/flex/flexbox_wrap-reverse.htm @@ -0,0 +1,34 @@ + + + +flexbox | flex-wrap: wrap + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_wrap-reverse.htm.png b/test/render/flex/flexbox_wrap-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..1a181cd7d2b1ab7bd178c4f251101e7ebc12588a GIT binary patch literal 315 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@CMISenfYnOb0EbT;1lBd|Nnm=lY!xXaIo72 zApO?U#WAFU@$Hq36Pq1)S|9peX}rP`np0%ic;!gwLAEF2GQKfWw;S}#-FT>(t>^xE z3*q~3Bm$f`6h)@W#_V5lzyA0)W>Kw>6#??EF5Gx?x2io|FG_c2?JCz5s`J?3;J>|9&BLL&N@4yRZD*wa@B?&FwmNuXV=9me*|z zNZw`!G;g6(D;LOM!&eiwy}o8`Qyd=Xy>GSEDviwOxl>k}eh;bdeErliyZW8#*X;RP zVhf9^_)AM{Za=+k6!hP^;J9r8t7%%cGti7z>8r~MYC$f(V(%@=;iPjiWELm{JYD@< J);T3K0RY~OgsK1l literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_wrap.htm b/test/render/flex/flexbox_wrap.htm new file mode 100644 index 000000000..a5f7cb6bc --- /dev/null +++ b/test/render/flex/flexbox_wrap.htm @@ -0,0 +1,34 @@ + + + +flexbox | flex-wrap: wrap + + + + + +
+ one + two + three + four +
+ + + \ No newline at end of file diff --git a/test/render/flex/flexbox_wrap.htm.png b/test/render/flex/flexbox_wrap.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..303d31699409aab3af94fe7ef81d4178e39d211d GIT binary patch literal 315 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@CMISenfYnOb0EbT;1lBd|Nnm=lY!xXaIo72 zApO?U#WAFU@$Hq36Pq1)S|9peX}rP`np0%ic;!gwLAEF2GQKfWw;S}#-FT>(t>^xE z3*q~3Bm$f`6h)@W#_V5lzyA0)W>Kw>6#??EF5Gx?x2iq;omSS#@=$kC)!fySjkZ3U z_e#HTuT6UH`Mpc(-Uc643h{ftu&*zDcTKe0t9tf#JJ{DPIF^&UB4D9YD;L^i(#_>jEm5C-zFM* + + flexible box flex item float effect + + + + + + + +

'float' have no effect on a flex item.

+

The test passes if there is a green square, a blue square and no red square.

+
+

 

 

 

+
+ + + \ No newline at end of file diff --git a/test/render/flex/flexible-box-float.htm.chrome.png b/test/render/flex/flexible-box-float.htm.chrome.png new file mode 100644 index 0000000000000000000000000000000000000000..0ecd77b094d4dfd60a4c2d69b5b496bfe2ad25c0 GIT binary patch literal 14012 zcmeHucT|+;y6+ehO*9swfJ#d=HV_b{SB)SF3X$GX&?rce-oeD6I5Z1IsoBENi}cPI z1jc|u04Y)h1f-55Roa~2%h`Lav(7zhuezuSyf1qSF@QzX_-%`#hpVV=WndtE- zk8oODV7Yajr0r|{^{{sEnTQ8FEhmgECYH1={964-lD7x5=k&;>(*ax8ojo)_q2yT;6wrLb+-4`ImT8Fa>YT<@lCDIU)Jk=M>6| z)BnnwhrPadQPk(lLuaor2NNG^P={YdtA_F`SOf|e28dbKW~_4PSM7Brni<(vAHyrR-7{`<~lEwxlUf| zczWsFqodzhw`G)cyWHV*d@*md8g^KFph1plGC62wDrm>{Tb+(yn9cTENywTmqOaIa zl#XZl*VpqWQz#iRoEu&oh_?AgMMb6QiArFVOT72Tv#;?v40$7goY~mEbbJ^ zF6#AcO1Y5GVUzbtu)^n6l+vs09G&isx~B6!FXI&CLZk-*4DzovZ8K{NrRCb1#xnY; zI`SIpCiVEf8X2ej10uKoF&^kC3&i?YeW zK)asOniv_U2;=#8e>_Y`O#EKfWo#!|qshW95o%!IU{=|bpj+8@r*12sJ$shdYa%CS zB+je$*ROV@b;pgh_0av;?#nEOC3(C9?T(+s0Z4>ie z_)sOQxbXIt^rv?Z6Wo}+O*xi~U6M8i%F5kd%!&&}MtejnX0&1)>khMi-zcCXTgz?c z{+))*P?+@WYi-Lre69iX)!A&0zAs+>cJdbXm5a5y#AI-&@^Z|MwFW-aR4l2RjFoe< zi*X;g>%gkvX7qY7`4qh7f^u_n)$EO13$rG8HKHYjLu7^@Vb@Pjpesm4l0GW5?b7?C zkc6t0EOj3JM&I1WC7fZUJHE6yo;`??4{6IZX5cQl$@MmD*;Bo4Bk%S=E@A5R>8=ZA`wuPcAg`Xt}UF z-Kfp%t!QcVoy!w<|L|7F$S7)Yc097p+;1iS@*fYvwA4=B*?Jz`@7=FB67T2Rc`YHh zxx2(ks3(gv)9cyIbylcsVYhf{yU)sO`{=@8sAy3CZ63QbSTxtg56`!?pwhLv3T<1+ z0;nA}b#79z$}DITv{~|9nv7hW8Py&tr=y;%re8^EZsr!j1J1lW-k8`~a6K7VB<%BP zC~~xNX-b{regnWx+~ecB8B{qf;Lt=M6<|^B{NeYF$@wo?Gk6yLlGVCGx@NqhRlLuf zVXBNt?&Y(c9wV_W=;6neD|211E4=2(B?Q~&vExYt0|Sl>i<-gwv{~{wR`37(+u^;< zD%_@FsH+Nb$9FHtayn1sFp@a-olb0SZqDyB3b^~`HMr7p_K;lNr_e#>C z2#^M$k*B&)WY-gJG^eX?$_e~X-O0(RqO2S# zVrqc`4-(2M-iuGwTXH;ch?x3h20*H>*Y<{}qM8ZqL-YnUSV%=COZ|__ZIWO1JXK zR&SB&-Y(#~aLK0f)38I63U`eFdx7yt($Lq09~O<>i&CB*el-{@)oWm9m|i-SR=zYBU5ITOxwln{(Q=@_uP;V#t-L(H$`clXr)HeOH zxsP;f)PzQ2*rv!pDwU9*5bs9HGrv56NuF*__G)#re&_h>)EzV$EvL(_Oob7`X9-yF zKW?2Vq8|S`JUqNcjKRA@z;D^%YhLN6&3WI?PP{pe4bOBR&n&Wd`A971`BpisV%(RN zc)TGy_9?UQY#R+wOUTMxf{oP#|Rbz5pJn3A;Zte$RE zGM^Iv1Jy$XPAfHmk9Ns8UM>-Rq_i}V=l^h1#x()wi4F%^(bX$6!@_vzundX3iN5`*f1noY4pcla7j+U|nk&F2(&Qy)`k-8=t zvwZnuy_nlnw>3jsPfu?uLH01MN*d3!1As_{Dyezjlwb)FCk8emkI`>wq|R6Za#uSr z`1I}G5OEl^OKfkc>*SuIZbx-q--Z6BEYmW<5!!%sL`b$?rco1-6%f&zFG$*T7pEBJ z{lx3?`a-yfy~_A1(7A5%R$bOOP)*$W^&xVZ^&7qpxSmyVzz)jiJvb=Fx%un`y6;K{ zWbXhJ43&J7-}C+7e)zQ&2!dkS74N%fRsLx>x;{ADkG;z3zavnqt*OAt!2z`!02CH$ zP+~7vc~`sju~KdNbi}VV#OzY^b|;`jKE#BQIBgNWKv=s3$&qc z6mFm4w>X-dYTs80!kH>##sM88P}q@#-jKryv3WTJH)rysMXFfUZbAd20h9#i5AfSedHF zc@YJuGUqnKt29vOYf!s$yQ!P5YzX|4oXgnj!`F79|Iq(j8#+rX)2N{Nl~i90z)xq?1v;SfdNvK9 zoCsV?Lg^%df2$nLaGlrao&2fN@g&O-nFBtvt@{4)ST?6rEXwH9=UdeSxka;_gEZw? z%GT{!remm~vEB-={;z)oN~OZfVa=fmA{8O7oF@y~lLF3wTh8w|s9|DfxJ~}U32PL# zbzh~=9ywQ=PAImPxi0(opI$!7>9!T>YJ+l=fFTf+u<1Cez^dNS+R%??Y6gEs%mE0* z{Z^OZD4sZ@w37qQz}uWzgf5CS9`Tv)iNvNpgzzt$X*0H`>HOhf)U&9e_~{+C9J2g8 zq-ziQCp9JI5LwP(^k~J$I-ykDo>i<%+gZQGmiT5+g%;MU8FZd5f0{yB93h4O6AcmFOs{J-m+)AygKtE(G8i-qvHc6_%wldO~(qM{W{5VHw82$yxC zWE}LsGZN#Z0iY8jDjXZ4D`E+I+LUch?|@A@9#rheZR&i17bSGvX64;{JAGAR4wX<0 zrzy1Z2`fF2TQ3p_W|Us)@ZCfp2{mYn72lhr8DE)nCr|5iC_mpF0blnR-^J1Eo`)zI z2ZX-9N6d|bg9Ef2e-lkTGR2(kOQZw&cL%oaiAJm}vB(QUqJFyxyk_3=f&}vWaEv?^ zI>cOf@Du$B@w4Qo(L4R6kB?tH4RdDs_Sw&@Zl}f?_*V;%>d;itgh@t0n~@lr=8=Mz z>l{n808XnGR(4#X(D&o@)->Ja>3DWfm=;aR92)hAQT`!C_VV`Jbn6^JG)*m3lV) zX;k`%(EhxujUoF&q%BH9cV(ur1{tdHiavVvk5;pn-aXWO0;JPjEzd16FkRZLr{cmG zty_)}7^bu4SLqHfDLS_Pp<{fq&IbKI2=)#?P#3vN>|2Q3)GipI!zM~#7h(YSg~}fz zQj;J&t-cISE+Ic(+{|;7COs6UJ#cHAVnCSI*L%bdHNZHp)dW!3|4L*;#A#r`VAW>P zpz~5a;+`|_Ibc+R$a(^?xdH9Q#L?Dgjxhb$UdzK$^t^1*s!zQrmVD%2opg_?|={b0y_fQaF;o-WTT?=+f zAk$ISQXgBf&D5=j^v?vMEEYW2nra4mQwcJ{tnM%^bvEpGeF@|znoJrPX_=l`NF^>{ z@7~kFdpP0r4M=z5JDSzCJodai_T>(QsC7dov2OvJMaz%kYw?;xczlfZArIvFJ$XfX z_>twny;EE7HpI#?V1@>1k!DokqV8kl@t|xV?}&1>e!@8_7bfe-@MrT)Y*b|6_CTK#UGJ*t@Dx149Ul!`k zcl>z4g&uA0%~FZ+99v65;6xP$NJi+pvPeR=!De;QVB%MZ0N*?Cw>$h)l%g_wbtOIa z)_(PfYP_EdPhm;o5LR^G@&S_ffLt>^N~fLEU2=j2Ac+cCnTjT001&xrYHA#SaN%X_ zShwEYaF>CQFcKp4<&T2xdAapG$1a}<3k$0TuJL$Hm0YDUi)*(@_a>c><|4M8d<&S& z4@;5e__9^OH3EwKN~9?l+4l8YrN1R5Nemkz8d!iFuqxMFKg3-ExZ2-RIL%|(4-`3& zk`O`#!qg5$n)Bn1SObBgaJ1&DA0tU?5o6`rnhkyCv3aA{0ZVK z4*Tp38qk-E8ykL$C06G)xp5M=ioD4gV5=uP4BJ3Mejy6OXEc;0aP;DdPVAacg{H2P z7!nomK?1zI6pg$Okz^t^ChJB6q*oLPh4X*kz>^4SN~{;9%PY+Mc`7|W^q^*33|Y*4 zQjRwig=CrK)6Iy>Vzkt(5I91-5Gyfin|$u^gR$21NYGv!78C7t263p>+{Bwv^zRwJ zh35iV%89EhOUWdgFoo|G>JEuh@Ja%2AqrXqvxe{8tAMy}v_(_tys=%$l`+KEo(NQ0 z05x&02q&rxgrXFEJWB>s(eM5)@*ke9AHBJL>zON8u3&lW5c=)pAo&#jLt6cHiPK1x z54PgXPL5GD+S$Xj*YH#`ca)aD!*-$iBcRA)xsDh-HJUS3A=xF-TKykMKqFG}?t!2^ z9a(51$e0Ffl2ce+7)*sRAiC8Go*o~=4`JZQn5PyNlrnBp(-wP7(B?#}d7@0UP$7uM z3vAxxK8=9~gtBXtpFVfVP;TPsDOoTq+K{|V!Z5UHB2kse@xHRN@0<4F2kCW#DaUjt z8;MIM6}B>QRZ0EU#%&rzH(~*-V5CGR>JP?yA0sioe?766C6-o(LV4wXJ9Q^%FjT4X zMm%;$$rcfZ)l_#$y)bi$*Iqs1$XRGUTTdXo*5Z^~Idrw|RLdB@95ixl7D~QqC?P~v z5Q*PU;Zx6b`VG>jSnM9RzVmSAXD2%g)QOfwX6NRK@VFUZd4I##yM8q2B~^jd*B&ii z=Ub<@z;{pA1y#vqc9Lu)>U|@UpFW>?6)P*N{t2o78sZ3=Pnx&=FVWFvfhIv=;b78; zvaS=m@bwZ&gM}p8gbO?Nu4w=W=RpDn0c&1ttL*#V+!1J55`%-7nN#r>Bn}A+fQL=< zY(z@~Y3W&1b1rp3ErkK^CPd{GAjqL&oI0it2_Eg3Q8i}Q{Vau zoC|k@h*LF(YBhwLMMI1Xfn&iDZzLiiB&Wd@cP7VqTBE%Hw4@Hhdl|&d6Q>P%Q(W~a zgNQVLnG}#X0;QsEU&A)g%65tCZ9(WkfR{+w#5W}04OLo|E`+wJihQdn-T!NqZ95|QqpNunoRcXmEA8rO?03t;O%0g?l^2;^7M68s;=* zV;<~U2v(7SD(BrO;C(|`nNT~CrMskWT)Z@)#QxN{*=gf5c2Vd0%cJaz17!#AkW3Ea zkdil0UiChgFI{;RBXe940n7WYB72&-GqXM09A&Ajun|gpSM# z)4YG#p8o0hN6vYDS zv*3uUWydpikO2tl?lkh3Oq1PbT^_zP0&qhPj|O6V3&-Py8F==g|era_I2c@yvJ z3`3_9%Z$>&lqZ~%jZ}t-ay7{}k@gd9>XKGjI33%!$d0Vm5;cwY4bgo?(kVGFR*f;2~~+G^ByQYHrAdkK&BNWu{Ja` z5=eH-z`a}J#M6~vO@iUWxO0DB{I43`xh92w(|8L!++mQQ0)@aq$`vjcekb$kII$X-_8v9I5Y!o`tC@ zEuP4&A3)Gx-aqO0qEZMjj#-5;fpHR?!Kq|78=wFU1D@*^q+#$ykDeZBWS^X_NOO9c z#%M~LYNSCOaj<&izE0P!akGv>>OGbJR!FOdC23h3q`SvnH#AnsIX>$>i+(KJwjDRI zx#`Pi?8wQT6`6t*3YRrG3-Ed`36mio6wMIKRJr^k?hNnseWRZy34k}Sub3Uc!ycKR zUq3}>uLcAVLx!o=5q@NZ#p79J1NMGP#{Kg1LetdtT=R>NEUpj?-x58tOUy!<#EKYr z<*PBJFm}U>d=?WOISy4{9VBFtM)>6e%37Gj-iW$|$ah)Lty#^HH}z}N$`^~C$Yj4v zn;N91MKw|ZFx(`g>9^EvB{@s}^>&e7_rc&@(A6jj-IDI`Hz9;oFhCvH=C^RF|LWf( z(9GA8BG(71?}}Zj`t?1=6>AYaAu~R=ZVrOw#0VU3l-C~eL3F;!yej01*%r;iWD@%X zNZSBZIwUA)l$x`A&qoU5+G}9){z3J0YluA7Y`ZxF1f@0FnBLW1#z>G zn0;@#8dD!rbY!N(j)MlJ4Z5+nbY(&+8&^#*0@u3$!(GLl7+E05)Dmt*=UwYAW;rG^ z<3LmW`z(YKN(VDt#@on!W3S27eKz5L<%WaVI0QsMlz!lD<47Y6(l0F)c})s6$zsscXwRWd2kBSNwv5woar{W2vXx#5Tg zOBm7t!~sXV!%{HnA+9cf8TUcoweaa!gg!3!zK`xFk3u2ftm^G1nGQDOs+`wpO5?Z3 zST`gf09jWJDPimdfk|XnKa?bkdwsvsqYmbh6 zmYW={@Wz0XT!2$?Rlm@bNSkxE<;6{9Po!gx5cakJ$m4MkRB43>yqa<<~7I zW=s^dD&h14BD~*p&=G6?4-PWfV|ti2)ALw$!&cr$d-qPl-B_VWMuGU}kPMwee4>`1 z8mjR>$KIG%!=2MG3rNPa?1->gxitBMNZ2qH2Aeoy7)De7E`Ia{iNQ&l3T=n5O20wr1)FR@bYfd{x(*t-OBql)M9I@_CXhBuR<(>CaVu`e-96FLvy48 z4d7NK+D#r}G8T4wn?RgV{=@Bm|rpHQU-X)phQ>+80gWSWUBvzpJ0oG&y>{a&%G7{-%yW`qN5x}rRDFeeMhG8C5?HM+ zG8c1xwr*o0);jsEWu-8ObC| zo1N?`IvRZJ;JSd*yxGz1q=Bj%pilorefVy7Ur)zljG`4aN%ca5cz6N|n?bqZWS$`oZV?=Li|M&48Lm?U zNDScUq}A%6^Ehp8gq-pruaI*rgsn&cj!EDgMl3SE(cf-u zRl^m9V(wcTA_ZH;sXR4ud_Yh{L<8jFQ40H3AN$2P$VQVK^sz?$mSX!__D7mLn1dCc znWwWWIvMQ#=Xa7xACf<0qSx(Cc8Scw@-ae72Hzh?YZf1kfECED>)U)Y{=purH;ux} zpOZV?iXfsG?znyC#|4gZ{D2rVSJiH+mKsqgwW-N*YtvGUJg=SK=0IDU5|Be$aIAWh z=HIZzVlfM3F_cyvf-}6%cVO(CfOw?7VyW6M8=*oCq({HK6D8x4;-fltzP5(UeiGwW z4WUie_!;UT2cMeVl(Qn`fig=#i(dEKh4V}|g8-me9n#|0SH2AqMQi3t{q)N zTay8SS zue;?r_&t8uefLpXWZTR=JpG5N&1<^QT@XDr7Jz+77-J zL1E<$>sAw^B0D}lIoFq^4HA?0Rr&8?pwCsg(BMbMxy-d}6|_7mJMuXB3Lf=QzyP@g;tj u>nR6R{Kb9W;z--+6Zi$M;G1}JG-aME>CxTy7Gd}g<*bT^a@G$QfB6q*K#<`8 literal 0 HcmV?d00001 diff --git a/test/render/flex/flexible-box-float.htm.png b/test/render/flex/flexible-box-float.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..40d5fba6583badae31f88e1ca9f2e258f7963002 GIT binary patch literal 815 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKr!X-CNwKv{S%DN!fKQ0)|NsAiOoj#^{-2T& z3slH-&(p;*q=ND7RNtc4S^{o~2lx`~qnvhgy_s4$i8bZJx5tIkCO+K#S6OAr>Lc6M z?3%QC-()S;a^`0YS=JzLscxk_5zn1{k3L*<$*>TN zj5}F+v6YqCK3edV|B{TSLK7$PYdJk$^fgs|yNXkugmzbicPMwDQ^j9~XxrT)+Tu3V~dOKpPnoV)-3ILS5ls7lqN87?Y% zYp1AAvQU3JMe~~7H2ovDMb@Uzo+@b6Ui*3F|7AaU&d>K)vZ7kfvwXgNVfUBf;;lQv zC&t)1=S3blmR&EGS(~-*oZabbhQGF0iltS=wv?v@s+cQnY8T6#K5^66l|NT{oIQ1} zU#U{b=-dXUB^j|=HA~c#*v}ka?{3p2a&7XweUmHp3-lGlh`BFI0h@L9(i0bzZ6=3j z39npVyhh1y{q&grXD%t{*JK?HJaTSboOrj7>l>wQH+P=+#KSHyG3x8A6OUEvloo|| z=nI8Qu2#LdYD&oB1=r7J+bXVgUAR7|>bj*;_#wBrTF{t_XQd`TojlDI~-V)1TuHbTmQV*C2#ueRQrj&DlNS#Fd3*Kn3)K= aBK#l2&B*+@zdd8kL86|nelF{r5}E*E-D3U# literal 0 HcmV?d00001 diff --git a/test/render/flex/flexible-order.htm b/test/render/flex/flexible-order.htm new file mode 100644 index 000000000..0bb4bd2c0 --- /dev/null +++ b/test/render/flex/flexible-order.htm @@ -0,0 +1,70 @@ + + + +CSS Test: Change the value of 'order' property + + + + + + + + + + + + + + + +
+
A
+
B
+
C
+
+ + + + + + + + \ No newline at end of file diff --git a/test/render/flex/flexible-order.htm.png b/test/render/flex/flexible-order.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b0f4badae083aed2915deaf1bd176a52447e998e GIT binary patch literal 184 zcmeAS@N?(olHy`uVBq!ia0y~yV9Efp6_}WT(ZCuo7Hop9<9DQ>!61<^YiJy*Pixq fi#lq;pz)N|gTe~DWM4frNT)@ literal 0 HcmV?d00001 diff --git a/test/render/flex/item-with-table-with-infinite-max-intrinsic-width.htm b/test/render/flex/item-with-table-with-infinite-max-intrinsic-width.htm new file mode 100644 index 000000000..ddc9dd7fb --- /dev/null +++ b/test/render/flex/item-with-table-with-infinite-max-intrinsic-width.htm @@ -0,0 +1,21 @@ + + + +Flex item with table with infinite max intrinsic inline size + + + +

Test passes if there is a filled green square.

+
+
+ + + + + +
  
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/item-with-table-with-infinite-max-intrinsic-width.htm.png b/test/render/flex/item-with-table-with-infinite-max-intrinsic-width.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..38b0d0675ff9d624aba3b35b6760e8799307051e GIT binary patch literal 575 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*GqVZlv7e+~&&E!h{ma!%1(mNX6PyX{`w|JUr} z=d8?G@kw>vOOP2rV0Pxwz5f&U_ih*Zx##qq#YNK9`)z!}*Z<$JCtYb`wce%nXA$+U zySLnldy?%MkaEJ=Fn;~hjz6Dv>zC#1Jn`>SOp22H#Hah_c~lo^1j_$8+0j1f^0#9r zl`Nm`I&N7i_w(uZ*zBcqbh19CTtAnPy>`XX>cIHNQl+n@r+5CyvlG>{o>&#dKCwtZ z(rc&Fkv+V#JWN`*d*pVvckG-u^;*lv!kXxewC8zb{<=FnFZK5e>~whY;pOf)7D$NH9r+|1uFoUr;^N@K z>v9E|=)IX1owMoXRaZMZd%Nk|zi%%`RRoux_I^iIVuykflTwz#A~vcKObiSk?thTJ W_VIkq7w3!MWZ>!Q=d#Wzp$PyX*ZOY& literal 0 HcmV?d00001 diff --git a/test/render/flex/justify-content_center.htm b/test/render/flex/justify-content_center.htm new file mode 100644 index 000000000..27aa76b76 --- /dev/null +++ b/test/render/flex/justify-content_center.htm @@ -0,0 +1,45 @@ + + + + + CSS Flexible Box Test: justify-content_center + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle and no gap between them.
+ 2. the rectangle 1, 2, 3 appear in middle of red rectangle.
+ 3. equal amounts of empty space between the left edge of the red rectangle and ractangle 1 and between the right edge of the red rectangle and rectangle 3.
+ 4. the height of the 1, 2, 3 is the same as the height of the red rectangle.

+
1
2
3
+ + + + + \ No newline at end of file diff --git a/test/render/flex/justify-content_center.htm.png b/test/render/flex/justify-content_center.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..4a3199da486744c2fab7ddad730bfc971c993415 GIT binary patch literal 2927 zcmeHJX*kqt8y~|k_OX*~EXB|vON}Mt&ycNSOGHOx%g&IAEHiVgiHs}>kq(KNhU|)z zW$e4`D%%^4eWJ$j>bxJ%hxg0-@%?aL_jCR3>v^u<{kxv$xqtVpEls#NPH})hAZ{~L zBU=!N84dz5S+g*oAhnBZuTK)c^<_KbtavwAJyH~nM9o2eQ<*AFyR+1uE@l-QQp zDP@`eBOTptE3?z#N(qzxR=Rl9r0yRSN%%Bsfb&cRi;0!$z}eaxDwa_eQ=C;&(<351 zRig|Td|Vfm2l;Rrw5!>4g$S#%)^ zgac_Ls7@5IaMm_K5HrFAlUigHx&!>pEl4Tk-lVb~+1k~k$ufYH?Nyv-Mwq?KVf2fp zvwB@-)ppF7B>8t~R`2X#@ef66sRNbaY-c*>!RP4x9R_f)2O>6%vXejpxk-WBFN56X zA?mbTeF$~RGn48k%-6UtW9HqE_zN>;EPz2 zLrrPeYm^1!4KG4?qjg?`EU355jS)A_>s-G{y2e8r%1nX4gasiCr5F~NmrLLk_l*Iy zx$VGqew=tT(NB>rzBaF5md*pSpiPQc{*)qi2JiuW7l={5K7pfZUgvHM&w~sZobZ(^ zfOp%r`3mG23ghz!^{@2mCc@JMZ)|5$|N4CqU8IN2K9)uP`NC<~0(PDo5ozHPN~mPJ z(Qy5F(pMmtMh#CS5L<)MOZicQD@-!_FM(|B+f2pnT|I^1YRSzqVBV8|2QyzEF2o&~ z60JSvEWJG8il%1ql0&{{*k+gc6MJ5bsm`;Z_K!q$PXz_4ZeH40tTOo7d(?YVDe?k@ zLXX&}jnW-jg%qaTx%Dlq%DLrT7=q~7`yoI0mD8T-n~TmbPp**fb=g)oxjPe*y*pJ?aKW~W;QwJ?F9`zFh7A_22OUwdL)lNatj;71F6G|f*VhI5w3JC%2#a9^+l z%|OojU6&U#Nc?0h24zTGCd14jYN<={&rlIQe{k2bzNZqAF9l2=#4~kc9#@@E)S21p z2h(#o1N653{GFL%F;Im==ctZh)Zls;l)?$ zcEslvi8WGM$m`>1o5;Iz>MZsv4AR_wdMmiSJ``Tos@8R%Sw?>jgMv`h&f6zug@nzZ zq*gzU9T*Bx9{08%OvHdG=~`D$9_aY1{)?Q=3`J8D?47=B@d{o*`Ha3aRw_7|-EX5m zrmtU5wB|Y&a$Wp>rKJXlMbh01RFq>qb@f{qPTi& zxi=}A32r{O6LVw0C4~R*jPzc77;!;!f~-S}P2Jx(khr+9_jWDESNa@AqGNDPwqU4m z<>mLA6jD{%bp^>UbweT!mRM4MX3Nl^rR4Z)-Va?y3Y7ZvL7SE0Ds@(!xeBR-=Re3P zdGst~94%lxeZnFvck^oPYUMh4kxuzoeFuH;EGYyvmw|5=r_4-U3+00~+o!oBEXKr@ zr!yogZ}nP!TZF;9Kv*<61RcWh2@t)=BVXEF6FgL#h9HCPl?AZJks9yhb>7$RM(#F) z9@3LjD=fkz+#@Q$O)QOG3g0oj&`qO&8s?>Ot<*LXW@szvP*0dsy(B0C-SfkM_M*4p zQGMNan?a@xQf*a#<~&oe&MpJ!nN|hMA~#S#c95eqF`!unE`i@Hf{jsb3<_YxY=qq6DHHFsg3l(fBDlnnY-fiDSjH zx06#+&DqhVeUwjEi)fengQE<-ZPN2jC4zs903qd#AZX!w#*tT7(a9%wN9a5M#Z%5- zAGf_HZ6AqFUe))zKm%$DYSo&%mT02{*AG^kow>2VB&_DitW_dDSOB8#5bQAJa_e|K z_CkdvL-Wj7G)D-I6xh~zS~ss{wr)Amzq~04v6pwQa7){F|1K9y#9K>Gad|e|3R{*) zi~rp5fX?Uci0d8n)tfx$;)9x=L}Ldd(4w$WrglrP+s8GGe*+;kRfx)r9c+?0x+_4; zNzMiojo;Yg$*GF&;y{ix%Bt*_`j4&H-wtj#0^Vw$6N-&h0-=$}JY-xDYow_NGA>PZ zH}hvtXG=B`Gqy1r$*_j^?pN?qTIS?(8kDKKB&(K*;_72{n80YVS(;m1V*bl$To1MA zx9D!c?x)m~CUiOs7XxxPI~It{*tBjZw%WR;sh6m=O~1_+aAUKg&|ckO!RlGvUo$N= zNiPP9d!v*9XeJm1T*uCy9$aqhTbP-~TD^9gy?eM$xW=Pxqs7CboTv0hHe_`t3m_w{ z*kGZjPnwSVs4MLE9q;eIMLN?F?gDoeU$IR-R;*pBo^jpxD=Qq~ozx0c5P7G3JLRv| z?8+cyZ{7H|iF@3=U60n1g02#m)yd?s$nuoR1(^F+`PFKAuP1r*LERIU_rmY-H^TVd(rH$vr@Efz^UGo%~b0vm+6Z^*1t8+-xUC?TV+(BO`Ucd&S!s= zOHqZ1`Cz3PqSC(-$XXMf(y4qt)I&J_okqAAbfGkKyh+B>fTGZ}y7!y2`GrH);Yi!5 zkxQatUDF4DsmbEFpic^giTAyW7kyWm5%jJeD-eG`ER0Fh91lPAghO#09tBuJlmq;cucqf!AV!(keG0O3g^;fd z3DHPp{;`c@14mtfYn7u&#Z8}P#vf9*2-8*qj% z5L&fh3am>aTfYSXuDgDL&wWJ53 z=zkk#Vh4e^Sc;A+AGrl@Ikkxyy2Z6a@A2`=$zL)}A&SbV{U7+>=n)Z29d0|Z#vo=H k+`7THh>{^R6a)f3g0$V`mb3i7pnlcNj4h2whOU498!?$n-T(jq literal 0 HcmV?d00001 diff --git a/test/render/flex/justify-content_flex-end.htm b/test/render/flex/justify-content_flex-end.htm new file mode 100644 index 000000000..948516a68 --- /dev/null +++ b/test/render/flex/justify-content_flex-end.htm @@ -0,0 +1,44 @@ + + + + + CSS Flexible Box Test: justify-content_flex-end + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle and no gap between them.
+ 2. the rectangle 1, 2, 3 appear in right of red rectangle.
+ 3. 3. the height of the 1, 2, 3 is the same as the height of the red rectangle.

+
1
2
3
+ + + + + \ No newline at end of file diff --git a/test/render/flex/justify-content_flex-end.htm.png b/test/render/flex/justify-content_flex-end.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..061a84fb938db56eb7ba077a42abff539a6454a7 GIT binary patch literal 2104 zcmeHI`8S(s8;L=GE#5jkfBu zrmbj1i^JG5miC)kg5r#=3zZ=vgAy@HY{{3-Z~Y7Am+wC3KKJunKiv2AT<1FXbKBd~ zMMe2bWf%;m;)-`7z+j4K7);^hUPU?5j)c$4i@LXmpR-IRlON?tm8VSRK$;HWF$!R? z{nM^a4t^;LAM!VuU8KcS2XU?OCB)kUmHBB z8CC`2(PfD5jKEOcYx!DV09J|q@MU^29929*F!G&@a%1=TQbOPP>OpO&NPVJx76!c+ z273XNF!~#=Qb$#0i;32ce<;lDzOqnyj_=>5tuZpS=i*wayJ4nLUSgrs&t~x}s=zV; zPQrlYD*B_IooO)A<1pdX8sE<`oE1`YPby+j3=G)UIL>CpQ|7yW|2mJmDm$rFu*k_C z%}I{1)fQI?Q{O)xNNkNO*UHvTGiMDTWJzvhAbRXVFs1f*d0xHhfk#1)CsJK5P1U84gwWRuzPO`zheZVL z+J_E}QzBDY(Sf*-m6(>OUo_2_fxO)2^YA-JudFiP<+s*=?O+u>N;L#t$kz~fDZS0z z@CO1)JFf??n`%27n(^h_ALS&*et0?b6obFtZ;g%OR2>qmnlwM%b{K4z<%)8eZ5g7R z;S)qXyU=4)>3`Hg%C_0(U0q|QFX#2Q=-g3TjKl2cVR(LwZsA6h z?5h*JBmBfl5kk1xeQ;5WX_ZnFGAKB$}fk z-lpS;c8y);$zFJV1D7&lK2CPb!l64EG%?06)yC}Rh=Ut3s?Lu}-fRzwF?CumuMbxN zY862@j~erCmUlFY6R1xa=xQ=c5j+8AD}>etPC4Y0pI(Lx$YkbUQtl;k#ZxAcdfkRm z)hSGDm`e%2e}ZA6IEw#5oOX^nG`Py@d5`-t3{c#N&o%U0Srg_tyoV=!m z&cubf_%p+2fo3?V^no@Yc1MB{kYa5+ih{CL)3s3*wakU1NPefLZJgN_{}- zuEp*VfGV}xb-)`IKnUnybXZ>%q;H5A?&W?ndjPCa1iCd%pbm(RbK)U}`@Mn98-GH< zVU_gj_UPF?dYLN1g#Sw4*+LIek zW>ddQ=2}5X@|HIc|LoIGqz=L{`yfq4kf!i&!M4s^>e3$yDss_&e<-c47Jpm$LIuEp t5l|=mwwk)0{y992uK9o9lOFPKT4F(MVUJZrR6?ID=j!a~R0D=({0}L9p{f7? literal 0 HcmV?d00001 diff --git a/test/render/flex/justify-content_flex-start.htm b/test/render/flex/justify-content_flex-start.htm new file mode 100644 index 000000000..fad6926bc --- /dev/null +++ b/test/render/flex/justify-content_flex-start.htm @@ -0,0 +1,44 @@ + + + + + CSS Flexible Box Test: justify-content_flex-start + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle and no gap between them.
+ 2. the rectangle 1, 2, 3 appear in left of red rectangle.
+ 3. the height of the 1, 2, 3 is the same as the height of the red rectangle.

+
1
2
3
+ + + + + \ No newline at end of file diff --git a/test/render/flex/justify-content_flex-start.htm.png b/test/render/flex/justify-content_flex-start.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..5281fb1645cc45c0e41c3c51cf064d2356523d2f GIT binary patch literal 2087 zcmeHH>o?m88V*`QwNj(1wB<)Tim8?^MS>=aBv^54wd>ZRRhKeoMS|$M42JS^OI;G` zR*mh5Tir_Z5}`@4Q_4;VLl8PGD;$xyWYXQU=j{Fk`(@t`@AIDL!*ibZJ@0w4-QCcK zRkT$g5XfOH#=#Q;QP6`x_cX#!6luD(tF-6v-Qe@bi3{MhfzlA`Q z{)TlxdMC(zF3BlaIH&qUg{u3Pv)@;|zKU+XTJ&bIiY-(pUyPrMsvw8%)1OAXLVUNK zn;=vA?;_b~lp5`#eA1KE8%<8-@IoA^6)(01>YTq^8%>$PpdNI>y#D>uaT zu~C~e|Lg;X>Xw#~oj7CmW1P4KGb*IFbBYfF$6NHyP)jXgKVgajaAnG)o*7{i3r{2Wi zs^Rq}W}y_%#n5j_+?jEmXGIJHW}Izj{e`^}a3stFHQfVBJ_=v*ez1e{ua3e|UCG}v zlbxX#taRV?TnX>*`aq}F7PVR)s=ii}_%r(6Oh>}XfO6SKzLjR-*qR?EDW0cXwna|i z9o#Zau;3vaDW-M4f%*7OSmgyOY|pJbRG>UZ(9C!rx9mEkQFSiGd5GBiScNc&We+}> z6?)vCH_u!2R=Y>>9n&Jsyhqmf35<+57QxSob?g0kYC;};XS;8GLNM0nF%=S7C;00I zPIs(5v;j)6AGKY=E8VNeusgAq!{7($Fkao(TX??sv-MowpEoNLZuclcAkBGfdV3*! zN>RvzdyRA&;W;~G!ToBzOdD})h70jL1CET1Nlf3gY%R+t>WHqFWpc)Q^CuMVWv#hU z0A`;--DLqzQ{SKg44TjPI-Eg`uXmI5=f4ei_ROhD5hC&gmPeNUb)Y+j9pH!1g{YBG(0hL)b2;r*{Z&`Y=~1^j1G+*Hs?PzY-0PaU77 z-fep{{av9bBKmdTp@8lcC}A1@9+$-!4@Hgl>hNEFa|R#dfeGL>g65f&XbM=ey-I%Z zp=IgGshB*v4va%P&9y=gO4UdKt69d#;@gP{r>7DaSWJ@L;gMirj(GoQY&e1xmxTW& zHh080ta_T#kv|~n`=$RTv^%!DJtYFIVy&(Vfjr!MmgHhH>J^7BB$g`f%vcc`*y4yA zGu`bQQPw7`faW%A_v$Q{?+>cpT?-1kb;aBKaZk>zw6`gvUnnHZW)Xi=J|x4Qj|hy8Oj=zU)!fm2RNzO#QSptF zq{WodzyCH)GHQb}3HyZ+*1I3gv*}a`za3WI@1jcWzl7H_Typs$U|}L2%;P_GE1d}Q zns|pIHY{d(Bl0sjd)7yN$lr=0VAuFFfqx~C8CL^>Z!LOGmt*~@2P ztRKBDXlg0+*1a2_cqg2 zTVBhpH&Km3xb_~5G!XIBB*bCDnf7FcDu%`ppDq4_Pto2PkLm5XLoqQr6G-+VIKzSS z9}h7IhW(rsv24%Wmg%e3*ZgtGgr@O;s{9_Otr-j7CmF5vTK1L#(UH%gDzp{WMIUBD z=7X=X{GatbWwyLw$z?-oX4l8^l>=B0VZj(XHb8tRQO^B+IY1)g2#4_v3Kh&OP% zX`orLf;@0-x&FBmCSD#0UY-GPP_Y&)DEA<+se#&uB_oIQBq+ArYvmKTK#a8>%)GJ* zX7_Kvb;tp4mz8Ns2T&}pBp4Q`mblbCci&3|k-HNJi$HB?_i3ovKhrb!UtX?cndvcQ z`l|mcns18Q??5a4L3T7~nxwOXb-7ypayk>5eN^4xj1wjo)B?; + + + + CSS Flexible Box Test: justify-content_space-around + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle.
+ 2. the rectangle 1, 2, 3 are distributed such that the empty space between any two adjacent rectangle is the same, and the empty space of the row before the first and after the last rectangle are half the size of the other empty spaces.
+ 3. the height of the 1, 2, 3 is the same as the height of the red rectangle.

+
1
2
3
+ + + + + \ No newline at end of file diff --git a/test/render/flex/justify-content_space-around.htm.png b/test/render/flex/justify-content_space-around.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..699d26127f11a4f218167f03673cab057cfd26bc GIT binary patch literal 3050 zcmeHJX*kpi7axr>Bg-I_F#LziRhGCh$krGd%cxvCxrI=c>?(|j|Fx85gyv?sC|s0n zB)d_Du@(`cFk>>Zq>(JyuI~NvKJWYC{qlZ%Kb+@xmJjFmob#OX{1Pr$o)hFh#t(r& z1WoZcD+mNC3xV)l;DzpGYNq+B_dxW5g|+eS?(UwuXHk2$yL8@sf=pV}2|lc-Xvg~FMdWRhijKhuJoZb!TY#37 zP+S|+|KEWoO}=o3PYP=xLtlEe$w3uY>zTnK!rmB2c*3>aICUf(9$%W#(mA)kFvV@< zN~48IHU_8ThtnAielJpzmnHl$zqM+4py`1Unhp3MqQ!qk(YXk9K;AqPf!beaK9fVn zKu*$6gJfe~#0X{-7EF z1BNvPCQ?H8xnfKpv(K4cLKGjJw8s&D9&nbYBOJ!_6nw%-VF*!ukn9fym^N5H<*&kM z9Gc(Mb(vuW{Zs(`_F|`F0e#L&F%}kz5-(k9+5~B#D-6ImM0CQK5YXH&0R;U@{J5KmWF0+@p?`>4U!9bUlg1( zerLcwt%fb<9J{3&;gFa-`P%6`&8G8MqQb%28~yP5^D}-4UsbT5 zyGMTP`LM~aSMuf;dFh|CN~V3i!vZhM6dP4KdT$>!Qnjli?{>0h)1Z>!^Xy1eQJ{V` z&|HK%$B1!pwe0)~f+xXX){Ydmyo|;V`PX@}1do`iYl9gN@@3i|5l`@~q!4`2)@hB9O z*S6w`MMzi7i7@VWGs%V?hf+q=Zzdu)UwCR;dR@L5a-L`&?~`2M8iSa%fmNir1;a|X!?$=u5{brRw&Kr> z@j2C1=SAL>CRu~;3koOL8SWv-n{5Q6c%-n^;YjQXb6yY$;5d^2y*r`rVDH&+T@{g+ zJN`w6TCWM%;f4lO!A$X3m>4yGQdQ*9;*tXH(xWzzEt;Wgerx~j#5>)Ro7a*xsI!_$ zX`yDxrDdG_Po7bEbsrICH2TXLvqm~y)0~iYa%^q++$Kuzz5!!U?J6y_g1WYvG^I6` z%;|BiQrpR%{uwquRXOknq`yn@^91do;CbZE2I$e2f(Ff3eu3mPF}t>-MmP4Zo}uhj zC_FS?FsZ2ZEiph zJmqV(w-Eh}b;>W6WZlzSRrE>ZD=IhSd9C0FNY)9Jr0sU~SCJ}4QayyLPNjA9ez(&u zZr`@u1q{YapL;g;S1q-(BK;FRRMjWH_0b#>?h@Du_a zPOXvq1-({bjb~qOmvCq{gniclf44sZQ{1^7VTgaqZ2;*|5ND3hGO)d?AnzykvOX7G zke;n&fChW#!vyB)A28nIv^ zD}g!-)g{EASh9nQRG)zjtkOWTv!lHW55D#uQB~KnLc#w`yddFD6L8$}^f9S|^fDQ< zUsAOlvZe!i^8!za_Rr+4T?}G{RdruvP=d2QN^-(CdL*p^Z74NK=Q#PUA4vXs2xpB7 z@0Wze^|P=rwZ?;JHl$!{0y6vb6Zm82arxqY@tZ~O6v#mEGlO8)#Dy!I?RA?J^Tv1n zB(e`Qrfs49=({t3u$X#aC{}0Fd|3o?|8DEPRm@D=t8D=(w9|^*xDWKYMaRAKne+`W zmd|*Wn(Vc~>Gc6Z7x$fQB)9SPiU#(JNo;%;J?QTjN-;eqHy(KL>y4@^%pVaO>TY6B zCyOER*d>CGB~<)PNVS3RV+%z@EtJGAOvV3l>uktMzC1xPgnv2rl|cSGD6*7 z?imnt)Btrbzv*gq@h*Fw?@Yh9to%+c2djSV5JFPEEJcRdm z`L-xY3&l;ZwKj=g){w}=9C92GLWC3N`ZTzOWixgy;dLh&E>tIBv8MzibQXN&cUV)% z#@CQRSv>>4(;Om%5cQD5tqJ>RE{LdWP4$4;y#bEcmFr~r<55b=Z!Gz;iE^*2w@B1M zVkoqsZKRGqzcItDM2V|sJQvb zd{Ek`NeN9sq>?(06h@!KeXP0~rE%^jbq|$&r?_`@0p6jub@@CeAVi35B2ypfove&$ zh+fyb7O^24-RIV`b3Iu$7X>bzPa)Sdnm=U6RMKJzRBDr_l@J|EXtwh@84)n#8XCR`W}ldo?d8#yRVs^@xYE z$z4;RMeGB_D8LKp0Og@*_Wsl0R#+T)cROSE0Jyc8yTt*WO^je#z+__D{Tg#TlMb&> ztiI7HgJwHu0clKK;EN}|lLqv))_vBnfhn} z6;twnm8@l_kr#}Iqy}_NRph%Lk5NUlb;kHNJeMx+R&T~eXalOP@Q44X9)%b&b%}py z9zeUR?{$3fUrXzUusg4j(qssv)etc^d0X)SUxj!!Aa8 + + + + CSS Flexible Box Test: justify-content_space-between + + + + + + + +

Test passes if:
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle.
+ 2. No gap between the left edge of red rectangle and the left of rectangle 1, no gap between the right edge of red rectangle and the right of rectangle 3 too, and rectangle 2 is distributed so that the empty space between rectangle 1 and rectangle 3 is the same.
+ 3. the height of the 1, 2, 3 is the same as the height of the red rectangle.

+
1
2
3
+ + + + + \ No newline at end of file diff --git a/test/render/flex/justify-content_space-between-001.htm.png b/test/render/flex/justify-content_space-between-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..1fa272066d2e82ba8c05f4800e51b9aef082b43f GIT binary patch literal 2933 zcmeHJSx}P+5)R5j5R@c1BLT!@xFj${ZWJ3+z|vii~xZ|>_rbBAj~Q87Y7bzf6>`ue}DfVjNb?SaQpja*C)srzX%XWQjuV8 z<{Txm=)e(KCigxuPL`gm09^Jtz3(LlTF@8kYQ5UR+{6iJnXP8IL~b z@i!Aj&@GCjPCw|Q*2kS&E|ydZGqwW9otrC8cgOj2Xfn?LSx@F-L+Hk%Gn;|jwW()~ z+i@1kH<3Z4;3h*mi#OZH<&ub!#8HNdBrpnyA%$)0V3CjnCFL9y0$#a|QByCCQ>4Ws z1L)xB)Pd}P3c+{}0Z z1b&(goBB;l-&Z$yvS59GX5EqCn5_TWV}^5|>J`4mr)y*W^hk7_ z2}^Cvpnu;(jFnHkZ;1|s!E8UN0I{`Kro(}VNpDubc1!{9=b~n4-*ARtbUD<9f9}oY zVT88rZBmy`(y=zK#_|&(BJNaA&^vC8ZRhT-W#-DsMCL>zjHm1VYLABCH0ea97FK{8 zQI`)GG(A7)`dtru4z=eT8g2RmcT%CyyrADRJc zd0hD!j_0SO=OW5}lH54v!99=gRmb(p0Qk)M+zjgnf=!>a@XZh57Yd-^V`R8NKIeta zOAUdqyz0}}0#eQ1uHYJR1Rs<5+<&cTp~Z6J zPnKIXb(b0gyvcrY>4r%}OS{R!sFL;Ii>oL(b@kU7t>Ap+zXDTZmWX3fn)=OgSSO&D z6R>HTHChcUE^slxx}fz^s4jAu4OSc7_O@BSrTzYE^SCZm&_=AOogmZ+?@p^PTI6@t ztd@d(a!K#0?2eqpyNWF_r3V}+?lh{n`gAs|$9&FX-`}~hRZBQGX=D}L$f4Z{DI}+xCSX^*`aSO6 z@#3=BypUh1*E2Q?6?=|{qm_h$CG}us3^M+>U0dYP2{oD@FGl4aAz#6#zTD>?dDTY) zy{8rpzpDytMY~&Y-$xYabczjI_5(udKZs|=)TR|)GI1Hl5FaI%I_IWi0 zv7uzE@OOUbUcqJlDT+kwNj=%Xn#{?kLO4t0WDH8!z)gnK0e#Sh3^l#gdRsQ@{K{9i z;yMWsXw}D5$Y_7fOxvS%U1b+ar7AWpRAh^N>9^Y;R`TWFGvGV@JVq6|wqSKQ}e0^xef6CZz?GTOL z_Ggz}`8N`-?5o|}4;c-&zr~2Kd-%xJk*y~ctdC)PmJ9T9SPa$Ok1pDS3Bmf7BX>u| zvPAk6bL0p=iPQO?wg|Yn&JQ4@zdnvb`Sxrkg>IW*C!+(Ossr#he67=VU)7gAw|OQQ zk1FnwmN;8gA&pR@WF)fkYCH{hnUD9_vR$Isu8<qK;?j znq1YAz8-|Fsj^j_=guF&$XMgAfa}RV>9~sc|0|rbQY?$diHWo@V1~{ z=q#VRq_6a_J*r$5>%T@8=aXSs-F+>ul-gHrhWzc-0D+7$oArgC+T-KZ_iB}P%DMBp zRE>kpfp9;cS5B~$*iN3SHN&NVfs0D3t1DM=o%@#HZ2@}oF!Fwiv?%a2ft{sqi~lAH zTqNbti3rZ+gW5B8o!I!JFkb$gB+yGLqOY2+;zC;VklcUL==o=C@Dv1squL8=k>)&r z^oW6TJ2a7drly@XDHKQsjHK;W_mp!2oZB`o*MZ>-nM-dULVf}v?}`ALVvssn(@xTV zmE2i5n3-LA7zP5#f^h;*blbOY%miJa6`Tr%DJfgx)9JEEZ5-+U!2gC1-nWs`!~^vN niQ$BUiNkAFCCLY$Bdtb+DYQENl9YJ+#|;uJY|U$MR}%gM7sfHC literal 0 HcmV?d00001 diff --git a/test/render/flex/layout-algorithm_algo-cross-line-001.htm b/test/render/flex/layout-algorithm_algo-cross-line-001.htm new file mode 100644 index 000000000..ae98e7d00 --- /dev/null +++ b/test/render/flex/layout-algorithm_algo-cross-line-001.htm @@ -0,0 +1,36 @@ + + + + + CSS Grid Layout Test: cross size determination with overflow:scroll + + + + + + + +

Test passes if there is a filled green square with scrollbars and no red.

+ +
+
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/layout-algorithm_algo-cross-line-001.htm.png b/test/render/flex/layout-algorithm_algo-cross-line-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e6e396079515853bdee906c75b64fdcc23c6c584 GIT binary patch literal 783 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU}Ruo28x*J{(1tWI0Jk_T>t<74`eblFt}ba z6k}juI_T-*7*fIb_G)6@Z7TtW#Gmc?4tLev6Bu4idOsz{C@RJ3QlTU_6Jd&?EQQ_ zeU|)tU5~!KygSuCul)B^vnD&zsn{3|y|8#i5 zy{g*ddvyy%)>qi)uDy19+Vg3Dcjs(hJN0={+`Rk!uQP6@e+i4umOsDIa`n0EQOCJ{ z+J*lV^Qf7f?{thasQk5P%ATe*$>%EUoTq(cTKReFHA$m=TsI$0^Yh5-+HrTQZr%jl zirX`0Z+Lf`TjkuDe!=I@Ki*Q$Jh#I!Y0m`q{ny3bmY1tMuX)>dMAuHiJ9qsZyXDqF z_tR~~ZrLt*FP#w=D8EQ{!kofpnc3giW@g`Y{$~1M!Z*VcZx#O^2+n>z{pTBr&ze)u z&& + + + + CSS Grid Layout Test: cross size determination with overflow:scroll + + + + + + + +

Test passes if there is a filled green square with scrollbars and no red.

+ +
+
+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/layout-algorithm_algo-cross-line-002.htm.png b/test/render/flex/layout-algorithm_algo-cross-line-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e6e396079515853bdee906c75b64fdcc23c6c584 GIT binary patch literal 783 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU}Ruo28x*J{(1tWI0Jk_T>t<74`eblFt}ba z6k}juI_T-*7*fIb_G)6@Z7TtW#Gmc?4tLev6Bu4idOsz{C@RJ3QlTU_6Jd&?EQQ_ zeU|)tU5~!KygSuCul)B^vnD&zsn{3|y|8#i5 zy{g*ddvyy%)>qi)uDy19+Vg3Dcjs(hJN0={+`Rk!uQP6@e+i4umOsDIa`n0EQOCJ{ z+J*lV^Qf7f?{thasQk5P%ATe*$>%EUoTq(cTKReFHA$m=TsI$0^Yh5-+HrTQZr%jl zirX`0Z+Lf`TjkuDe!=I@Ki*Q$Jh#I!Y0m`q{ny3bmY1tMuX)>dMAuHiJ9qsZyXDqF z_tR~~ZrLt*FP#w=D8EQ{!kofpnc3giW@g`Y{$~1M!Z*VcZx#O^2+n>z{pTBr&ze)u z&& + + + + CSS Test: flex container multiline wrapping-reverse in row-reverse direction. + + + + + + + + + +
+

3-1

+

2-2

+

2-1

+

1-3

+

1-2

+

1-1

+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/multi-line-wrap-reverse-row-reverse.htm.png b/test/render/flex/multi-line-wrap-reverse-row-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..2d73f1cd85c597a12517c85838f8e31f7e50d7f6 GIT binary patch literal 362 zcmV-w0hRuVP)MV)9#KY_Tq6pZi#8t9xQo92qPvL*J{U>i+ZiRMybY8%05cpUN5 + + + + CSS Test: flex container multiline wrapping in column-reverse direction + + + + + + + + + +
+

1-3

+

1-2

+

1-1

+

2-2

+

2-1

+

3-1

+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/multi-line-wrap-with-column-reverse.htm.png b/test/render/flex/multi-line-wrap-with-column-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a3d6d6ed14bcc2e475e6f13ff4c9b54cecad7e2e GIT binary patch literal 627 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYVANq^28y^j+ph#toB=)|uK)l4KXc{`kjKHQ z{EdNuN!8QEF{Fa=?bVHEmlz1J1x&h|u=@98#RB#V{Hg*Ew9e02*Ce~-^Vz-rPA+n1 z56f-t=;-iR>SA>IlULY}%0-<{6TWurnEyU|&+m#{%@cKLvm>UNUE3bgd;adBsZDdD zw{?CrJod|$H}dm@7-4^zwb%FBly7lALe=Pp&`$N2Mz$b{OMIn|Fo$xN_YcmH3lbbVdNPPJnnebUZ&Y&vva*tdav@aOx4 z8V3k?*7zj5!G=4szvHhCLnd=k9;-sN=!x1bi+GkC>RIEyzb^S-t%pmu(uB2KPu4Kp zT;EYA+5psn4P0rq5rBXRnF{MuTIDCSE54W8_>F18`6?G_{u4SAuJ>v%W?aEa~79WIA&S`&U}xQcqLHc) + + + + CSS Test: flex container multiline wrapping in row-reverse direction + + + + + + + + + +
+

1-3

+

1-2

+

1-1

+

2-2

+

2-1

+

3-1

+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/multi-line-wrap-with-row-reverse.htm.png b/test/render/flex/multi-line-wrap-with-row-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b715b147ae4993eaf802e789ed3ffbb1e8059c3f GIT binary patch literal 384 zcmV-`0e}99P)1RCodHlR=KdAPhyjNf$j`HqOE~F!$jIEbu7@x|kVhLhMA& zG*bSPs!DwNsEv650002s6VNL2k>C{Hl8O4~Pudq#*%Q3smhzgfFBaJoyh;7EHD4P2 zEN%KW>m}I}IDDi2@vwhO);jQQ1PA{gQ*6C5@*TX7vfr0#o0qzh_C*~9<9Vi4uJeAc z?gIb-0002@f@~g-$=)=dYe%yr_a;B ziQ5;u`nP1Qwoh2IxP1Lo+t-Tdg*bfT@jcD<{oJp|_cGh}?bF)krCL61^P;}{wfX4# zy}Azo00000+zSd~KFOB~(URkQMTj`qmjZnxvGsCr|46jP`r_~R%Dz6&sRs5hh`ag# e0002+&wK%xVTx7>M~jRA0000 + + + +CSS Flexible Box Test: Negative margins + + + + + + +

You should see a green rectangle with a black border, 40px wide. You should see no red.

+ +
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/negative-margins-001.htm.png b/test/render/flex/negative-margins-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..7d90389d34f3bfe22e7daf4d023ac8a71f006dfa GIT binary patch literal 587 zcmV-R0<`^!P)^p5Q*>u1M=N-Sh%D-Bw` zZ!|lJu^qo8cqc*#A%qY@2q7epc^}!|d7biIOoXVfk=D6IBa2&Q&v?j}mvGaVun$*| zUlNjD5Ry)Xq_2e($@fCidqQ&lz7SYOgrtLzZXd4TPRJrizmzH%rFAKoEjrU*e9LCD zs^b{hx2Uh$B+qNLrcQw>fYjS+j+GoBC zl52aWX>Ft@a`er1wRUgps6I7`5nJ1)ZKbVdv3@?+6&%;S6cP!~(_j}QmtBaB^dc># z`)<1s_r{LOw5?u*$NFZfARTK0i;2>%D>$q>CIpAt)9BSH)ylF|6K0-XfAK~%U-)z( zhrQN4^de9YVn8hg=edRuMBi7iuRA8hFH5A+nZK@0h<$vYrlSz}oC}E)krwZFOa48P zp$hhO|GSVpAY^|>LWuRUwni5M>$s5KB~OKTKR`FZXl}FCwXA>06n)4?Njs5x!`FJ% zEZ$f>5*d2e66-%91l`Urj(fR~s|sLi>y}F)1LPO&r^Npr`Ccub7czZb$nwS7%Ud;l z@8`SmCGO(BnfLY@YNJPitY8Wi$0YKKA|!H*F_2qA>L Z&0juEBB|V}8KnRK002ovPDHLkV1mW&1lRxo literal 0 HcmV?d00001 diff --git a/test/render/flex/order-001.htm b/test/render/flex/order-001.htm new file mode 100644 index 000000000..2f305fb9d --- /dev/null +++ b/test/render/flex/order-001.htm @@ -0,0 +1,42 @@ + + + + + CSS Test: The 'order' property on flex items set to a value of '-1' + + + + + + + +

Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.

+
+
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/order-001.htm.png b/test/render/flex/order-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..156126b1f60065e6fdfaca6e17cf15f6e0d71ec5 GIT binary patch literal 992 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZVifKQ0)|NsAiOa_Mk|Ccg& zCszCgD(v@kaSW+od^%`8lAZjI_6yOPTv zb^Aj9uGH>OG1TMD_Wu9n*3z&^As5;wex2KK-Yf5Ex$)MER{CG}?%378{@aa-vde>> z%k6GmdeoNbIb+JX-wHdK53ZAGOpw`g_9Z_0VkS9g-l_xSbqTQ8b@-9gP;Kc{ND z@(tDhcizmcc)KD$v+7Mp?YAG*db($~{`!$+d*a&4Mw#6Y-+e4^UZSnA!eY9^CB_r? z%#%bFZhxP@ch`bdF5cT0{Iu+jXzdhpPZRHK($|VQdO&}@vBdI|i>AK6xq5T(=SKER z78$&^iZ@NodAD%(y=a-$hbr&Q6G&G-w(ipR>c>BClw8cUuTnqp#Z%$)%a)(4yWid@ ze7EoRpHI7&uekp7dF%EMb4$J+SzTgYWNf;1#azDF{F=Q5HGCdFawnAf+A~XD5#7(v z(8=xhCG*#*!jF?>1LwS}`}AnZ|4o;L|8^|s<*4&?5|K;%xLNXZ?X>>6$0vWcb;?Ry z+Qj1dE8%PI;@tOP?_Jl=bEqiU;=R}V)0R!uS$jWTyj_#Wa#DMO<@f$6>=SAPm;AiL z(sXvZXh(^4&?X<(%O@r;w_D^^;6E*hugUQ5nrBVdVnem(Hgp@*2sJTLPvsy;GW2b5TpEE_qA% z+8qk7{>N>7lf5Z2Y^%|#Yq|>BOW*GNlt1ZgX0h>!^DnPE)ctxf$-E*6mZ$^YU#buP z@_)Xz5{Dy)lR%R|ivo)xZJ9L|9H1Ok8(q(M;zn&kiU=n^D4Tk^`njxgN@xNApbp0@ literal 0 HcmV?d00001 diff --git a/test/render/flex/order-with-column-reverse.htm b/test/render/flex/order-with-column-reverse.htm new file mode 100644 index 000000000..19880e25f --- /dev/null +++ b/test/render/flex/order-with-column-reverse.htm @@ -0,0 +1,44 @@ + + + + + CSS Test: flex container layout lowest order with column-reverse direction + + + + + + + + +

Test passes if the paragraph below reads 'First,Second,Third' from top.

+
+

Second,

+

First,

+

Third

+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/order-with-column-reverse.htm.png b/test/render/flex/order-with-column-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a9fdf56656b5c5167d4d759fa3dcd07888f1c987 GIT binary patch literal 545 zcmV++0^a?JP)xUs<>a$%qH0lHqIba5r|{VSQa%8QE2gG z9bzB@8OU1^J@n`?0w(=gv|HlqB;)7OZZjq){Lf_4h9_3bYI_-_r-_KKGuG>X~(VPhv?nv=_ri@AZr8826N?@7J*ts;*xvn{a#5*J|k#IHSYzxJL zur5f2_k}D4S&ku-03ne{8Zu$T^#U>#geS}wgpr!3Z-fiN#}Lj1$(eIQ_!i-c;67KR zq_RJvb%OLSM4wex*eygVa?BQ0DT$|oI=19=HKu{s~ZK(r6y-A)P;E~{@lDG2H8dp4ES-UO+Z> judWU;kbw+jAa9P}2tv%uj;!&100000NkvXXu0mjf;lt_Q literal 0 HcmV?d00001 diff --git a/test/render/flex/order-with-row-reverse.htm b/test/render/flex/order-with-row-reverse.htm new file mode 100644 index 000000000..f780761c7 --- /dev/null +++ b/test/render/flex/order-with-row-reverse.htm @@ -0,0 +1,42 @@ + + + + + CSS Test: flex container layout lowest order with row-reverse direction + + + + + + + + + +

Test passes if the paragraph below reads 'First,Second,Third' from leftmost.

+
+

First,

+

Second,

+

Third

+
+ + + + + \ No newline at end of file diff --git a/test/render/flex/order-with-row-reverse.htm.png b/test/render/flex/order-with-row-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..cfa0adb7b142f96c47d47dc2aa4d3416d53b939d GIT binary patch literal 555 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKGZ=vcgW`*okqiuspFCY0Ln;{GUNP)@Y{kR& zfJ1B97r~w>mQ337d>>ql*>OcO<|EIlA9bfr&SsgMV%(jvVYkBZakIDvCfIUpuS0e_j26~G~i9K zT{Oj2Mf`Hl8J)#E(J4BI?U|UM+b>a*@3^;e zkJx>;I(0dvPjx9dEJ7X%jY!0&=gOXES9S8wmW}xPudKz|$$HUZfj`&l-gopmUQ0fC zOleYgrkfeV&kLO&XHIC>eCgtBH(Am{*-rVhL<_6OE(IHo%oloc{TcSUml99FT=Jpg n-K)TSx%!v+;YgPKH~S<%W0ttK(xa_zpj6=L>gTe~DWM4fv6J*r literal 0 HcmV?d00001 diff --git a/test/render/flex/padding-overflow-crash.htm b/test/render/flex/padding-overflow-crash.htm new file mode 100644 index 000000000..d895c4dca --- /dev/null +++ b/test/render/flex/padding-overflow-crash.htm @@ -0,0 +1,15 @@ + + + + + + + +

Test passes if there is a filled green square only.

+ +
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/padding-overflow-crash.htm.png b/test/render/flex/padding-overflow-crash.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ced33bc8954ed750998366d6c5a47e01f51419f8 GIT binary patch literal 561 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq58d0A~$*~8^8Y*kEV9=yWu zpRNwl4b(r^@Xx+K6X##wS-nrzX#0xuual;?KE3*T`t4QuYTLj294S8UDt0~Qae3wY zzv5jf?=*_y1w~e_{g(J!_N?;mH}7;OTAu&6VNSZu`->Ugb3E)KcVAy^`?B!u+Be!Z z=IhtaQMu&RouBi6fos{#zZasGPJL)vUv$d&M)c|Iedk_B%Us;D_QMY$!QZp|U4J>M z_`P;qV&8G)-g*JaYiyd2d=uXagTe~DWM4fM??E3 literal 0 HcmV?d00001 diff --git a/test/render/flex/percentage-heights-004.htm b/test/render/flex/percentage-heights-004.htm new file mode 100644 index 000000000..c81c7ed32 --- /dev/null +++ b/test/render/flex/percentage-heights-004.htm @@ -0,0 +1,66 @@ + + + +CSS Flexbox: Percentages in stretched container + + + + + + +

You should not see tan (except perhaps as the background of a horizontal + scrollbar), and you should not see a vertical scrollbar.

+ +
+
+
+ hello +
+
+
+ +
+
+
+ hello +
+
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/percentage-heights-004.htm.png b/test/render/flex/percentage-heights-004.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..49b741d0c8495319a63141a1a4362504c4aa4087 GIT binary patch literal 1083 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK-!L%)$&YumRst!`0G|-o|Ns93nG6jKu9pnO zfU4elx;TbZFut7{IBBs3Pus(T<_*6KSeBo9-WEve zUoCT))V8N@$!(rX_gFKh3(K;3zLtFcaoXeU&ek!}cUWKUvQ;qO{H0yt^vAqr9iI1% zUo3CG-q#bkw(N!O$E^Nm_om;An*RLC3AftC_N)ItnfJ|j|GoEB=9N2ZEpJ-voSjqi zh0`n)zL}aD^IyxJr#HU%B5>NYm`6vZL8fIcS~mF zHKUvAyG@!RD+E=95r9?=e)x2%Qr8Tmwnr*z%P@_?@>R!XnkFoNz1I)wK*aSAG0b z78a2I{H>$x$I2SFd*|PCz526HS(&|t;U=Hazs>R~`_JD$apHMnPYu&2iwWC5x5rj% zT@ak#{zopr02Z9% A$^ZZW literal 0 HcmV?d00001 diff --git a/test/render/flex/support/a-green.css b/test/render/flex/support/a-green.css new file mode 100644 index 000000000..b0dbb071d --- /dev/null +++ b/test/render/flex/support/a-green.css @@ -0,0 +1 @@ +.a { color: green; } diff --git a/test/render/flex/support/b-green.css b/test/render/flex/support/b-green.css new file mode 100644 index 000000000..a0473f5ca --- /dev/null +++ b/test/render/flex/support/b-green.css @@ -0,0 +1 @@ +.b { color: green; } \ No newline at end of file diff --git a/test/render/flex/support/c-red.css b/test/render/flex/support/c-red.css new file mode 100644 index 000000000..d4ba5c64e --- /dev/null +++ b/test/render/flex/support/c-red.css @@ -0,0 +1 @@ +.c { color: red; } \ No newline at end of file diff --git a/test/render/flex/support/flexbox.css b/test/render/flex/support/flexbox.css new file mode 100644 index 000000000..83502cd14 --- /dev/null +++ b/test/render/flex/support/flexbox.css @@ -0,0 +1,143 @@ +.flexbox { + display: -webkit-flex; + display: flex; +} +.inline-flexbox { + display: -webkit-inline-flex; + display: inline-flex; +} + +.flex-none { + -webkit-flex: none; + flex: none; +} +.flex-auto { + -webkit-flex: auto; + flex: auto; +} +.flex-one { + -webkit-flex: 1; + flex: 1; +} +.flex-one-one-auto { + -webkit-flex: 1 1 auto; + flex: 1 1 auto; +} + +.row { + -webkit-flex-direction: row; + flex-direction: row; +} +.row-reverse { + -webkit-flex-direction: row-reverse; + flex-direction: row-reverse; +} +.column { + -webkit-flex-direction: column; + flex-direction: column; +} +.column-reverse { + -webkit-flex-direction: column-reverse; + flex-direction: column-reverse; +} + +.wrap { + -webkit-flex-wrap: wrap; + flex-wrap: wrap; +} +.wrap-reverse { + -webkit-flex-wrap: wrap-reverse; + flex-wrap: wrap-reverse; +} + +.align-content-flex-start { + -webkit-align-content: flex-start; + align-content: flex-start; +} +.align-content-flex-end { + -webkit-align-content: flex-end; + align-content: flex-end; +} +.align-content-center { + -webkit-align-content: center; + align-content: center; +} +.align-content-space-between { + -webkit-align-content: space-between; + align-content: space-between; +} +.align-content-space-around { + -webkit-align-content: space-around; + align-content: space-around; +} +.align-content-stretch { + -webkit-align-content: stretch; + align-content: stretch; +} + +.align-items-flex-start { + -webkit-align-items: flex-start; + align-items: flex-start; +} +.align-items-flex-end { + -webkit-align-items: flex-end; + align-items: flex-end; +} +.align-items-center { + -webkit-align-items: center; + align-items: center; +} +.align-items-baseline { + -webkit-align-items: baseline; + align-items: baseline; +} +.align-items-stretch { + -webkit-align-items: stretch; + align-items: stretch; +} + +.align-self-auto { + -webkit-align-self: auto; + align-self: auto; +} +.align-self-flex-start { + -webkit-align-self: flex-start; + align-self: flex-start; +} +.align-self-flex-end { + -webkit-align-self: flex-end; + align-self: flex-end; +} +.align-self-center { + -webkit-align-self: center; + align-self: center; +} +.align-self-baseline { + -webkit-align-self: baseline; + align-self: baseline; +} +.align-self-stretch { + -webkit-align-self: stretch; + align-self: stretch; +} + +.justify-content-flex-start { + -webkit-justify-content: flex-start; + justify-content: flex-start; +} +.justify-content-flex-end { + -webkit-justify-content: flex-end; + justify-content: flex-end; +} +.justify-content-center { + -webkit-justify-content: center; + justify-content: center; +} +.justify-content-space-between { + -webkit-justify-content: space-between; + justify-content: space-between; +} +.justify-content-space-around { + -webkit-justify-content: space-around; + justify-content: space-around; +} diff --git a/test/render/flex/support/import-green.css b/test/render/flex/support/import-green.css new file mode 100644 index 000000000..537104e66 --- /dev/null +++ b/test/render/flex/support/import-green.css @@ -0,0 +1 @@ +.import { color: green; } diff --git a/test/render/flex/support/import-red.css b/test/render/flex/support/import-red.css new file mode 100644 index 000000000..9945ef471 --- /dev/null +++ b/test/render/flex/support/import-red.css @@ -0,0 +1 @@ +.import { color: red; } diff --git a/test/render/flex/support/test-style.css b/test/render/flex/support/test-style.css new file mode 100644 index 000000000..17f44c117 --- /dev/null +++ b/test/render/flex/support/test-style.css @@ -0,0 +1,18 @@ + #test01, #test02, #test03{ + width: 50px; + height: 50px; + text-align:center; + font-size: 20px; + } + #test{ + background: #ff0000; + } + #test01{ + background: #7FFF00; + } + #test02{ + background: #00FFFF; + } + #test03{ + background: #4169E1; + } diff --git a/test/render/flex/table-as-item-auto-min-width.htm b/test/render/flex/table-as-item-auto-min-width.htm new file mode 100644 index 000000000..ae5f240e6 --- /dev/null +++ b/test/render/flex/table-as-item-auto-min-width.htm @@ -0,0 +1,16 @@ + + + +CSS Flexbox Test: Flex item as table, specified width less than minimum intrinsic width + + + +

Test passes if there is a filled green square and no red.

+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/table-as-item-auto-min-width.htm.png b/test/render/flex/table-as-item-auto-min-width.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + +CSS Flexbox Test: Flex item as table, specified width and min-width less than minimum intrinsic width + + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/table-as-item-fixed-min-width.htm.png b/test/render/flex/table-as-item-fixed-min-width.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + +CSS Flexbox Test: Flex item as table with narrow content + + + + + +

Test passes if there is a filled green square.

+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/table-as-item-narrow-content-2.htm.png b/test/render/flex/table-as-item-narrow-content-2.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..406efa719e84ba44deae3df544861f286627c7b4 GIT binary patch literal 575 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU}Ruo28x*J{(1tWI0Jk_T>t<74`eblFt}ba z6a%XG=;`7ZQo;E4YGB_jD~aQQ&l+V_ekXG73)*vX_o-jSCwQEf*Unh=Wc@1{l_wh) zp3*No%L>%axA*$*ugiaKzkNIG^V`H{wOjVyUH90u?exv-|4S<4Td&-?u6X^_p0oQu zJAd1Ge8PF{M#b#t?RM+7Ze+kp zaxM3Ld^BO(mdgIyMUsm@O1CfHJer1_NbV^=#{{*{FzqaKc`g!M`^RZJrE5Fw6*=C#h z|JdsJCvNDupGeJHf6I>Ff62SgbvioponQTnzh`ea|6ozeo?rV<#Pj^LSQlTG^)<}C zu6ADB-@1P>w{23MOI~>vS-N+=x2RFr@z)kxv-X-@{g;1ca`u@$7EcauH$VJo_WqVR z0-wHIF0bPN2Gjjd|JTo{O>}B$5t!uWA*GnvvP6(Rj9K++ETDKs0}uTFFdSH+S2#6q Q!3L0&r>mdKI;Vst0Qz4BJpcdz literal 0 HcmV?d00001 diff --git a/test/render/flex/table-as-item-percent-width-cell-001.htm b/test/render/flex/table-as-item-percent-width-cell-001.htm new file mode 100644 index 000000000..434aebe53 --- /dev/null +++ b/test/render/flex/table-as-item-percent-width-cell-001.htm @@ -0,0 +1,41 @@ + + + + +Flexbox Test: display:table flex items with percent-width cells and content keywords for used flex-basis + + + + + + +
+ +
12
+
+
+
12
+
+
+
12
+
+
+
12
+
+ + + + \ No newline at end of file diff --git a/test/render/flex/table-as-item-percent-width-cell-001.htm.png b/test/render/flex/table-as-item-percent-width-cell-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..6b8de0e9e1560b952071474949b0a63b2a81b195 GIT binary patch literal 236 zcmeAS@N?(olHy`uVBq!ia0vp^w}7~Ui5W<~T+Xrm~m1llom%`8~f}xBlgy;PT@7xI6Ms^^CXqG@VO&z4+c+vD}EgvlG7mJkPSbHsLPI z{m-mrZKb&kci&vxC3r{OliliL{`r9Nr(d<^?wNL7`@XuT`ue9^fy_^{7EiwZDJt%C icIDZNvUjq3EAppwsg|c*nsy54Oa@O^KbLh*2~7Y8fMx^$ literal 0 HcmV?d00001 diff --git a/test/render/flex/table-as-item-stretch-cross-size-4.htm b/test/render/flex/table-as-item-stretch-cross-size-4.htm new file mode 100644 index 000000000..31642cec1 --- /dev/null +++ b/test/render/flex/table-as-item-stretch-cross-size-4.htm @@ -0,0 +1,34 @@ + + + + + + + + + + + + +

Test passes if there is a filled green square and no red.

+
+ + +
+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/table-as-item-stretch-cross-size-4.htm.png b/test/render/flex/table-as-item-stretch-cross-size-4.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p + + +Table flex item with infinite max intrinsic inline size + + + +

Test passes if there is a filled green square.

+
+ + + + + +
  
+
+ + + \ No newline at end of file diff --git a/test/render/flex/table-with-infinite-max-intrinsic-width.htm.png b/test/render/flex/table-with-infinite-max-intrinsic-width.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ae0cbd172098738146d6f5effeb25b64c9aecc21 GIT binary patch literal 584 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*GqrP8c$L!Ib1PkHKUpi!^YVKw ztls@(%4_R$nIBH*|G(1{cIxCJv2wn*Jl8IEMcIgdRb6*+gUvaUHRDc z@#Y+lJ{pyB<$btSJKf3PqDmHa+ zbgXFXkU}O5Z|AUc?!LLUJo*09w}0RMRrvJj*QZ;%4P68T83j!R0+~TX^0u3NN@bg) y-yhp|`gr)4JRU(87Y7$!mn+mGfG(}$t!J!oIG=Oyo9Ype!#!R7T-G@yGywp0TLw@7 literal 0 HcmV?d00001 diff --git a/test/render/flex/zero-content-size-with-scrollbar-crash.htm b/test/render/flex/zero-content-size-with-scrollbar-crash.htm new file mode 100644 index 000000000..dceaffca0 --- /dev/null +++ b/test/render/flex/zero-content-size-with-scrollbar-crash.htm @@ -0,0 +1,11 @@ + + + + + +
+
+
+ + + \ No newline at end of file diff --git a/test/render/flex/zero-content-size-with-scrollbar-crash.htm.png b/test/render/flex/zero-content-size-with-scrollbar-crash.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..dcbee0d89a87c7fd5a82c8d1f3304dc517be0a50 GIT binary patch literal 89 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK1sH(@!?BraUxAc@r;B4q1>@VZj)DvfJWLC| o>f1*D_^^QCJF8Hqi_%PgreaAeX^umNS3!C_UHx3vIVCg!0BFh<&j0`b literal 0 HcmV?d00001 From e1bbe63d8ad6d60a77e8cf4ce5fad479109004c6 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Mon, 25 Dec 2023 03:12:05 +0300 Subject: [PATCH 47/73] fixed rendering block with negative top/bottom margins --- src/render_block_context.cpp | 30 ++++++++++++++++++------------ 1 file changed, 18 insertions(+), 12 deletions(-) diff --git a/src/render_block_context.cpp b/src/render_block_context.cpp index 7591378c2..df2f5057f 100644 --- a/src/render_block_context.cpp +++ b/src/render_block_context.cpp @@ -47,20 +47,26 @@ int litehtml::render_item_block_context::_render_content(int x, int y, bool seco // Collapse top margin if(is_first && collapse_top_margin()) { - child_top -= el->get_margins().top; - if(el->get_margins().top > get_margins().top) - { - m_margins.top = el->get_margins().top; - } + if(el->get_margins().top > 0) + { + child_top -= el->get_margins().top; + if (el->get_margins().top > get_margins().top) + { + m_margins.top = el->get_margins().top; + } + } } else { - if(last_margin > el->get_margins().top) - { - child_top -= el->get_margins().top; - } else - { - child_top -= last_margin; - } + if(el->get_margins().top > 0) + { + if (last_margin > el->get_margins().top) + { + child_top -= el->get_margins().top; + } else + { + child_top -= last_margin; + } + } } if(el->src_el()->is_replaced() || el->src_el()->is_block_formatting_context() || el->src_el()->css().get_display() == display_table) From 33407c6cc9f0023559eaf728c1b219eda73da78e Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Mon, 25 Dec 2023 03:35:44 +0300 Subject: [PATCH 48/73] flex test: some tests were fixed --- test/render/flex/--flexbox_flex-0-N-auto.htm.png | Bin 603 -> 0 bytes .../{--align-self-001.htm => align-self-001.htm} | 0 test/render/flex/align-self-001.htm.png | Bin 0 -> 577 bytes .../{--align-self-002.htm => align-self-002.htm} | 0 test/render/flex/align-self-002.htm.png | Bin 0 -> 577 bytes .../{--align-self-003.htm => align-self-003.htm} | 0 test/render/flex/align-self-003.htm.png | Bin 0 -> 577 bytes .../{--align-self-005.htm => align-self-005.htm} | 0 test/render/flex/align-self-005.htm.png | Bin 0 -> 577 bytes .../{--align-self-007.htm => align-self-007.htm} | 0 test/render/flex/align-self-007.htm.png | Bin 0 -> 577 bytes .../{--align-self-008.htm => align-self-008.htm} | 0 test/render/flex/align-self-008.htm.png | Bin 0 -> 577 bytes .../{--align-self-009.htm => align-self-009.htm} | 0 test/render/flex/align-self-009.htm.png | Bin 0 -> 577 bytes .../{--align-self-013.htm => align-self-013.htm} | 0 test/render/flex/align-self-013.htm.png | Bin 0 -> 577 bytes .../{--flex-basis-003.htm => flex-basis-003.htm} | 0 test/render/flex/flex-basis-003.htm.png | Bin 0 -> 577 bytes .../{--flex-basis-004.htm => flex-basis-004.htm} | 0 test/render/flex/flex-basis-004.htm.png | Bin 0 -> 577 bytes .../{--flex-basis-010.htm => flex-basis-010.htm} | 0 test/render/flex/flex-basis-010.htm.png | Bin 0 -> 577 bytes ...{--flex-shrink-004.htm => flex-shrink-004.htm} | 0 test/render/flex/flex-shrink-004.htm.png | Bin 0 -> 577 bytes ...{--flex-shrink-005.htm => flex-shrink-005.htm} | 0 test/render/flex/flex-shrink-005.htm.png | Bin 0 -> 577 bytes 27 files changed, 0 insertions(+), 0 deletions(-) delete mode 100644 test/render/flex/--flexbox_flex-0-N-auto.htm.png rename test/render/flex/{--align-self-001.htm => align-self-001.htm} (100%) create mode 100644 test/render/flex/align-self-001.htm.png rename test/render/flex/{--align-self-002.htm => align-self-002.htm} (100%) create mode 100644 test/render/flex/align-self-002.htm.png rename test/render/flex/{--align-self-003.htm => align-self-003.htm} (100%) create mode 100644 test/render/flex/align-self-003.htm.png rename test/render/flex/{--align-self-005.htm => align-self-005.htm} (100%) create mode 100644 test/render/flex/align-self-005.htm.png rename test/render/flex/{--align-self-007.htm => align-self-007.htm} (100%) create mode 100644 test/render/flex/align-self-007.htm.png rename test/render/flex/{--align-self-008.htm => align-self-008.htm} (100%) create mode 100644 test/render/flex/align-self-008.htm.png rename test/render/flex/{--align-self-009.htm => align-self-009.htm} (100%) create mode 100644 test/render/flex/align-self-009.htm.png rename test/render/flex/{--align-self-013.htm => align-self-013.htm} (100%) create mode 100644 test/render/flex/align-self-013.htm.png rename test/render/flex/{--flex-basis-003.htm => flex-basis-003.htm} (100%) create mode 100644 test/render/flex/flex-basis-003.htm.png rename test/render/flex/{--flex-basis-004.htm => flex-basis-004.htm} (100%) create mode 100644 test/render/flex/flex-basis-004.htm.png rename test/render/flex/{--flex-basis-010.htm => flex-basis-010.htm} (100%) create mode 100644 test/render/flex/flex-basis-010.htm.png rename test/render/flex/{--flex-shrink-004.htm => flex-shrink-004.htm} (100%) create mode 100644 test/render/flex/flex-shrink-004.htm.png rename test/render/flex/{--flex-shrink-005.htm => flex-shrink-005.htm} (100%) create mode 100644 test/render/flex/flex-shrink-005.htm.png diff --git a/test/render/flex/--flexbox_flex-0-N-auto.htm.png b/test/render/flex/--flexbox_flex-0-N-auto.htm.png deleted file mode 100644 index ab79088f36dfd8d116e113502ffccd63c07bd1d0..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 603 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($(bL5-q=ND7RogrzZ;|7H`3uju|GUShbE82uf`RdzE#vR_Lm|n> zRNC^6O#LA}cYaN%C;PQP(eJL4R6IdQF7k41t@plv>#KkDrv$33R*DooxymEVb(7Yl z(1~lhQbJLM=BlQz&RlDL`PRGTUkhhko9`Yx@yyhk`Tmpd=zjZ~-;|QA;;mvo{hi9m z`Kr;g_kNA!EnfQX?4IOpzV_=q_if*HgLiXA?)~$R{{;L`yD9%;Q}ed-PoGZzSFOT+ zc>Cp^yC)q#t+1?9zrAkmIlJlao=i`gU-q-kZuOHtY$yNnPCEZ#*M8OL)l*|+;tRxc zA5S{HeA1lW{5i8#{hcR0(VcYsuI(SUzBlhm<8K|`YrARp_S(q*llN@f&3^Lm^?!9@ zC$Da~Haj!-`{iF2KHU(%1Id&m70+d^lTxAvmP$W)-TlAzejBV|jv5W6({gsL7YE0k dif2_qJ>#TavqeTpHASEl;_2$=vd$@?2>>|b5GViu diff --git a/test/render/flex/--align-self-001.htm b/test/render/flex/align-self-001.htm similarity index 100% rename from test/render/flex/--align-self-001.htm rename to test/render/flex/align-self-001.htm diff --git a/test/render/flex/align-self-001.htm.png b/test/render/flex/align-self-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p Date: Mon, 25 Dec 2023 11:18:00 +0100 Subject: [PATCH 49/73] support for counter_s_ --- include/litehtml/element.h | 1 + include/litehtml/html.h | 2 +- src/el_before_after.cpp | 12 ++++++++++-- src/element.cpp | 33 +++++++++++++++++++++++++++++++++ src/html.cpp | 6 +++--- 5 files changed, 48 insertions(+), 6 deletions(-) diff --git a/include/litehtml/element.h b/include/litehtml/element.h index e9cfbafd6..27177993e 100644 --- a/include/litehtml/element.h +++ b/include/litehtml/element.h @@ -148,6 +148,7 @@ namespace litehtml } string get_counter_value(const string& counter_name); + string get_counters_value(const string_vector& parameters); void increment_counter(const string& counter_name, const int increment = 1); void reset_counter(const string& counter_name, const int value = 0); diff --git a/include/litehtml/html.h b/include/litehtml/html.h index cbd0d26b7..818d5ce56 100644 --- a/include/litehtml/html.h +++ b/include/litehtml/html.h @@ -23,7 +23,7 @@ namespace litehtml { - void trim(string &s); + void trim(string &s, const string& chars_to_trim = " \n\r\t"); void lcase(string &s); int value_index(const string& val, const string& strings, int defValue = -1, char delim = ';'); string index_value(int index, const string& strings, char delim = ';'); diff --git a/src/el_before_after.cpp b/src/el_before_after.cpp index 7f1ddf277..c7c2d680b 100644 --- a/src/el_before_after.cpp +++ b/src/el_before_after.cpp @@ -133,7 +133,7 @@ void litehtml::el_before_after_base::add_text( const string& txt ) void litehtml::el_before_after_base::add_function( const string& fnc, const string& params ) { - int idx = value_index(fnc, "attr;counter;url"); + int idx = value_index(fnc, "attr;counter;counters;url"); switch(idx) { // attr @@ -157,8 +157,16 @@ void litehtml::el_before_after_base::add_function( const string& fnc, const stri case 1: add_text(get_counter_value(params)); break; - // url + // counters case 2: + { + string_vector tokens; + split_string(params, tokens, ","); + add_text(get_counters_value(tokens)); + } + break; + // url + case 3: { string p_url = params; trim(p_url); diff --git a/src/element.cpp b/src/element.cpp index 310b5e59d..07efba7b5 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -298,6 +298,39 @@ litehtml::string litehtml::element::get_counter_value(const string& counter_name return "0"; } +string litehtml::element::get_counters_value(const string_vector& parameters) +{ + string result = ""; + if (parameters.size() >= 2) { + const string& counter_name = parameters[0]; + string delims = parameters[1]; + litehtml::trim(delims, "\"'"); + + string_vector values; + + element::ptr current = shared_from_this(); + while (current != nullptr) + { + auto map_iterator = current->m_counter_values.find(counter_name); + if (map_iterator != current->m_counter_values.end()) { + values.push_back(std::to_string(map_iterator->second)); + } + current = current->parent(); + } + if (values.empty()) { + // if no counter is found, instancieate one with value '0' + shared_from_this()->m_counter_values[counter_name] = 0; + result = "0"; + } + else { + std::reverse(values.begin(), values.end()); + litehtml::join_string(result, values, delims); + } + } + return result; +} + + bool litehtml::element::find_counter(const string& counter_name, std::map::iterator& map_iterator) { element::ptr current = shared_from_this(); diff --git a/src/html.cpp b/src/html.cpp index 4c25b9f3d..ee8ddad8d 100644 --- a/src/html.cpp +++ b/src/html.cpp @@ -2,9 +2,9 @@ #include "types.h" #include "utf8_strings.h" -void litehtml::trim(string &s) +void litehtml::trim(string &s, const string& chars_to_trim) { - string::size_type pos = s.find_first_not_of(" \n\r\t"); + string::size_type pos = s.find_first_not_of(chars_to_trim); if(pos != string::npos) { s.erase(s.begin(), s.begin() + pos); @@ -14,7 +14,7 @@ void litehtml::trim(string &s) s = ""; return; } - pos = s.find_last_not_of(" \n\r\t"); + pos = s.find_last_not_of(chars_to_trim); if(pos != string::npos) { s.erase(s.begin() + pos + 1, s.end()); From 05ae1051ee30fc8d71a44d3b65ce69748cbf0509 Mon Sep 17 00:00:00 2001 From: MichelCalonder Date: Tue, 26 Dec 2023 07:15:55 +0100 Subject: [PATCH 50/73] used string_id instead of string --- include/litehtml/element.h | 10 +++++----- src/element.cpp | 34 +++++++++++++++++----------------- src/html_tag.cpp | 8 ++++---- 3 files changed, 26 insertions(+), 26 deletions(-) diff --git a/include/litehtml/element.h b/include/litehtml/element.h index 27177993e..d2bc372e9 100644 --- a/include/litehtml/element.h +++ b/include/litehtml/element.h @@ -37,7 +37,7 @@ namespace litehtml element::ptr _add_before_after(int type, const style& style); private: - std::map m_counter_values; + std::map m_counter_values; public: explicit element(const std::shared_ptr& doc); @@ -149,13 +149,13 @@ namespace litehtml string get_counter_value(const string& counter_name); string get_counters_value(const string_vector& parameters); - void increment_counter(const string& counter_name, const int increment = 1); - void reset_counter(const string& counter_name, const int value = 0); + void increment_counter(const string_id& counter_name_id, const int increment = 1); + void reset_counter(const string_id& counter_name_id, const int value = 0); private: std::vector get_siblings_before() const; - bool find_counter(const string& counter_name, std::map::iterator& map_iterator); - void parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const; + bool find_counter(const string_id& counter_name_id, std::map::iterator& map_iterator); + void parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const; }; ////////////////////////////////////////////////////////////////////////// diff --git a/src/element.cpp b/src/element.cpp index 07efba7b5..f0184592d 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -290,8 +290,8 @@ bool element::is_block_formatting_context() const litehtml::string litehtml::element::get_counter_value(const string& counter_name) { - std::map::iterator i; - if (find_counter(counter_name, i)) + std::map::iterator i; + if (find_counter(_id(counter_name), i)) { return std::to_string(i->second); } @@ -302,7 +302,7 @@ string litehtml::element::get_counters_value(const string_vector& parameters) { string result = ""; if (parameters.size() >= 2) { - const string& counter_name = parameters[0]; + const string_id counter_name_id = _id(parameters[0]); string delims = parameters[1]; litehtml::trim(delims, "\"'"); @@ -311,15 +311,15 @@ string litehtml::element::get_counters_value(const string_vector& parameters) element::ptr current = shared_from_this(); while (current != nullptr) { - auto map_iterator = current->m_counter_values.find(counter_name); + auto map_iterator = current->m_counter_values.find(counter_name_id); if (map_iterator != current->m_counter_values.end()) { values.push_back(std::to_string(map_iterator->second)); } current = current->parent(); } if (values.empty()) { - // if no counter is found, instancieate one with value '0' - shared_from_this()->m_counter_values[counter_name] = 0; + // if no counter is found, instanciate one with value '0' + shared_from_this()->m_counter_values[counter_name_id] = 0; result = "0"; } else { @@ -331,13 +331,13 @@ string litehtml::element::get_counters_value(const string_vector& parameters) } -bool litehtml::element::find_counter(const string& counter_name, std::map::iterator& map_iterator) { +bool litehtml::element::find_counter(const string_id& counter_name_id, std::map::iterator& map_iterator) { element::ptr current = shared_from_this(); // search upwards while (current != nullptr) { - map_iterator = current->m_counter_values.find(counter_name); + map_iterator = current->m_counter_values.find(counter_name_id); if (map_iterator != current->m_counter_values.end()) { return true; } @@ -346,7 +346,7 @@ bool litehtml::element::find_counter(const string& counter_name, std::map siblings = current->get_siblings_before(); std::reverse(siblings.begin(), siblings.end()); for (const element::ptr& sibling : siblings) { - map_iterator = sibling->m_counter_values.find(counter_name); + map_iterator = sibling->m_counter_values.find(counter_name_id); if (map_iterator != sibling->m_counter_values.end()) { return true; } @@ -372,7 +372,7 @@ std::vector litehtml::element::get_siblings_before() const } -void litehtml::element::parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const { +void litehtml::element::parse_counter_tokens(const string_vector& tokens, const int default_value, std::function handler) const { int pos = 0; while (pos < tokens.size()) { string name = tokens[pos]; @@ -384,25 +384,25 @@ void litehtml::element::parse_counter_tokens(const string_vector& tokens, const else { pos += 1; } - handler(name, value); + handler(_id(name), value); } } -void litehtml::element::increment_counter(const string& counter_name, const int increment) +void litehtml::element::increment_counter(const string_id& counter_name_id, const int increment) { - std::map::iterator i; - if (find_counter(counter_name, i)) { + std::map::iterator i; + if (find_counter(counter_name_id, i)) { i->second = i->second + increment; } else { // if counter is not found, initialize one on this element - m_counter_values[counter_name] = increment; + m_counter_values[counter_name_id] = increment; } } -void litehtml::element::reset_counter(const string& counter_name, const int value) +void litehtml::element::reset_counter(const string_id& counter_name_id, const int value) { - m_counter_values[counter_name] = value; + m_counter_values[counter_name_id] = value; } const background* element::get_background(bool own_only) LITEHTML_RETURN_FUNC(nullptr) diff --git a/src/html_tag.cpp b/src/html_tag.cpp index b27d6eb6d..ab2c45e99 100644 --- a/src/html_tag.cpp +++ b/src/html_tag.cpp @@ -1553,8 +1553,8 @@ void litehtml::html_tag::handle_counter_properties() { const auto& reset_property = m_style.get_property(string_id::_counter_reset_); if (reset_property.m_type == prop_type_string_vector) { - auto reset_function = [&](const string&name, const int value) { - reset_counter(name, value); + auto reset_function = [&](const string_id&name_id, const int value) { + reset_counter(name_id, value); }; parse_counter_tokens(reset_property.m_string_vector, 0, reset_function); return; @@ -1562,8 +1562,8 @@ void litehtml::html_tag::handle_counter_properties() const auto& inc_property = m_style.get_property(string_id::_counter_increment_); if (inc_property.m_type == prop_type_string_vector) { - auto inc_function = [&](const string&name, const int value) { - increment_counter(name, value); + auto inc_function = [&](const string_id&name_id, const int value) { + increment_counter(name_id, value); }; parse_counter_tokens(inc_property.m_string_vector, 1, inc_function); return; From 76ffcfa84110bc787da6d2ea6b8cb7e9bbd5ddc1 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Thu, 28 Dec 2023 02:54:09 +0300 Subject: [PATCH 51/73] flex: more flex tests passed --- include/litehtml/types.h | 34 +++++++++--- src/css_properties.cpp | 5 ++ src/render_block.cpp | 21 +++++--- src/render_block_context.cpp | 5 +- src/render_flex.cpp | 44 +++++++++++---- src/render_image.cpp | 17 +++--- src/render_item.cpp | 51 +++++++++++++++++- src/render_table.cpp | 8 +-- ...ith-flex.htm => auto-height-with-flex.htm} | 0 .../render/flex/auto-height-with-flex.htm.png | Bin 0 -> 345 bytes ...play-flex-001.htm => display-flex-001.htm} | 0 test/render/flex/display-flex-001.htm.png | Bin 0 -> 516 bytes .../flex/{--flex-003.htm => flex-003.htm} | 0 test/render/flex/flex-003.htm.png | Bin 0 -> 992 bytes ...-flex-basis-002.htm => flex-basis-002.htm} | 0 test/render/flex/flex-basis-002.htm.png | Bin 0 -> 577 bytes ...-flex-basis-006.htm => flex-basis-006.htm} | 0 test/render/flex/flex-basis-006.htm.png | Bin 0 -> 577 bytes ....htm => flex-direction-row-001-visual.htm} | 0 .../flex-direction-row-001-visual.htm.png | Bin 0 -> 1733 bytes ...flex-direction-row-reverse-001-visual.htm} | 0 ...x-direction-row-reverse-001-visual.htm.png | Bin 0 -> 1948 bytes ...{--flex-grow-001.htm => flex-grow-001.htm} | 0 test/render/flex/flex-grow-001.htm.png | Bin 0 -> 169 bytes ...{--flex-grow-002.htm => flex-grow-002.htm} | 0 test/render/flex/flex-grow-002.htm.png | Bin 0 -> 577 bytes test/render/flex/flex-grow-006.htm.png | Bin 586 -> 577 bytes ...=> flex-minimum-height-flex-items-011.htm} | 0 ...flex-minimum-height-flex-items-011.htm.png | Bin 0 -> 577 bytes ...001a.htm => flexbox-abspos-child-001a.htm} | 0 .../flex/flexbox-abspos-child-001a.htm.png | Bin 0 -> 111 bytes ...001b.htm => flexbox-abspos-child-001b.htm} | 0 .../flex/flexbox-abspos-child-001b.htm.png | Bin 0 -> 111 bytes ...flow-001.htm => flexbox-flex-flow-001.htm} | 0 .../render/flex/flexbox-flex-flow-001.htm.png | Bin 0 -> 2077 bytes ...ault.htm => flexbox-flex-wrap-default.htm} | 0 .../flex/flexbox-flex-wrap-default.htm.png | Bin 0 -> 578 bytes ...owrap.htm => flexbox-flex-wrap-nowrap.htm} | 0 .../flex/flexbox-flex-wrap-nowrap.htm.png | Bin 0 -> 578 bytes ...001.htm => flexbox-overflow-horiz-001.htm} | 0 .../flex/flexbox-overflow-horiz-001.htm.png | Bin 0 -> 237 bytes ...002.htm => flexbox-overflow-horiz-002.htm} | 0 .../flex/flexbox-overflow-horiz-002.htm.png | Bin 0 -> 207 bytes ...003.htm => flexbox-overflow-horiz-003.htm} | 0 .../flex/flexbox-overflow-horiz-003.htm.png | Bin 0 -> 190 bytes ...005.htm => flexbox-overflow-horiz-005.htm} | 0 .../flex/flexbox-overflow-horiz-005.htm.png | Bin 0 -> 161 bytes ...-002.htm => flexbox-overflow-vert-002.htm} | 0 .../flex/flexbox-overflow-vert-002.htm.png | Bin 0 -> 192 bytes ...-003.htm => flexbox-overflow-vert-003.htm} | 0 .../flex/flexbox-overflow-vert-003.htm.png | Bin 0 -> 177 bytes ...-005.htm => flexbox-overflow-vert-005.htm} | 0 .../flex/flexbox-overflow-vert-005.htm.png | Bin 0 -> 160 bytes ...de-001a.htm => flexbox-root-node-001a.htm} | 0 .../flex/flexbox-root-node-001a.htm.png | Bin 0 -> 146 bytes ...de-001b.htm => flexbox-root-node-001b.htm} | 0 .../flex/flexbox-root-node-001b.htm.png | Bin 0 -> 146 bytes ....htm => flexbox_align-content-stretch.htm} | 0 .../flexbox_align-content-stretch.htm.png | Bin 0 -> 354 bytes ...ne.htm => flexbox_align-self-baseline.htm} | 0 .../flex/flexbox_align-self-baseline.htm.png | Bin 0 -> 392 bytes ..._flex-0-0-0.htm => flexbox_flex-0-0-0.htm} | 0 test/render/flex/flexbox_flex-0-0-0.htm.png | Bin 0 -> 621 bytes ...rink.htm => flexbox_flex-0-0-N-shrink.htm} | 0 .../flex/flexbox_flex-0-0-N-shrink.htm.png | Bin 0 -> 401 bytes ..._flex-0-0-N.htm => flexbox_flex-0-0-N.htm} | 0 test/render/flex/flexbox_flex-0-0-N.htm.png | Bin 0 -> 605 bytes ...m => flexbox_flex-0-0-Npercent-shrink.htm} | 0 .../flexbox_flex-0-0-Npercent-shrink.htm.png | Bin 0 -> 441 bytes ...cent.htm => flexbox_flex-0-0-Npercent.htm} | 0 .../flex/flexbox_flex-0-0-Npercent.htm.png | Bin 0 -> 558 bytes ..._flex-0-1-0.htm => flexbox_flex-0-1-0.htm} | 0 test/render/flex/flexbox_flex-0-1-0.htm.png | Bin 0 -> 621 bytes ...rink.htm => flexbox_flex-0-1-N-shrink.htm} | 0 .../flex/flexbox_flex-0-1-N-shrink.htm.png | Bin 0 -> 368 bytes ..._flex-0-1-N.htm => flexbox_flex-0-1-N.htm} | 0 test/render/flex/flexbox_flex-0-1-N.htm.png | Bin 0 -> 605 bytes ...m => flexbox_flex-0-1-Npercent-shrink.htm} | 0 .../flexbox_flex-0-1-Npercent-shrink.htm.png | Bin 0 -> 368 bytes ...cent.htm => flexbox_flex-0-1-Npercent.htm} | 0 .../flex/flexbox_flex-0-1-Npercent.htm.png | Bin 0 -> 558 bytes ..._flex-0-N-0.htm => flexbox_flex-0-N-0.htm} | 0 test/render/flex/flexbox_flex-0-N-0.htm.png | Bin 0 -> 621 bytes ...rink.htm => flexbox_flex-0-N-N-shrink.htm} | 0 .../flex/flexbox_flex-0-N-N-shrink.htm.png | Bin 0 -> 368 bytes ..._flex-0-N-N.htm => flexbox_flex-0-N-N.htm} | 0 test/render/flex/flexbox_flex-0-N-N.htm.png | Bin 0 -> 605 bytes ...m => flexbox_flex-0-N-Npercent-shrink.htm} | 0 .../flexbox_flex-0-N-Npercent-shrink.htm.png | Bin 0 -> 368 bytes ...cent.htm => flexbox_flex-0-N-Npercent.htm} | 0 .../flex/flexbox_flex-0-N-Npercent.htm.png | Bin 0 -> 558 bytes ...ss.htm => flexbox_flex-1-0-0-unitless.htm} | 0 .../flex/flexbox_flex-1-0-0-unitless.htm.png | Bin 0 -> 554 bytes ..._flex-1-0-0.htm => flexbox_flex-1-0-0.htm} | 0 test/render/flex/flexbox_flex-1-0-0.htm.png | Bin 0 -> 556 bytes ...rink.htm => flexbox_flex-1-0-N-shrink.htm} | 0 .../flex/flexbox_flex-1-0-N-shrink.htm.png | Bin 0 -> 401 bytes ..._flex-1-0-N.htm => flexbox_flex-1-0-N.htm} | 0 test/render/flex/flexbox_flex-1-0-N.htm.png | Bin 0 -> 554 bytes ...m => flexbox_flex-1-0-Npercent-shrink.htm} | 0 .../flexbox_flex-1-0-Npercent-shrink.htm.png | Bin 0 -> 441 bytes ...cent.htm => flexbox_flex-1-0-Npercent.htm} | 0 .../flex/flexbox_flex-1-0-Npercent.htm.png | Bin 0 -> 554 bytes ...1-0-auto.htm => flexbox_flex-1-0-auto.htm} | 0 .../render/flex/flexbox_flex-1-0-auto.htm.png | Bin 0 -> 554 bytes ...xbox_flex-1-0.htm => flexbox_flex-1-0.htm} | 0 test/render/flex/flexbox_flex-1-0.htm.png | Bin 0 -> 554 bytes ...ss.htm => flexbox_flex-1-1-0-unitless.htm} | 0 .../flex/flexbox_flex-1-1-0-unitless.htm.png | Bin 0 -> 554 bytes ..._flex-1-1-0.htm => flexbox_flex-1-1-0.htm} | 0 test/render/flex/flexbox_flex-1-1-0.htm.png | Bin 0 -> 556 bytes ...rink.htm => flexbox_flex-1-1-N-shrink.htm} | 0 .../flex/flexbox_flex-1-1-N-shrink.htm.png | Bin 0 -> 368 bytes ..._flex-1-1-N.htm => flexbox_flex-1-1-N.htm} | 0 test/render/flex/flexbox_flex-1-1-N.htm.png | Bin 0 -> 554 bytes ...m => flexbox_flex-1-1-Npercent-shrink.htm} | 0 .../flexbox_flex-1-1-Npercent-shrink.htm.png | Bin 0 -> 368 bytes ...cent.htm => flexbox_flex-1-1-Npercent.htm} | 0 .../flex/flexbox_flex-1-1-Npercent.htm.png | Bin 0 -> 554 bytes ...1-1-auto.htm => flexbox_flex-1-1-auto.htm} | 0 .../render/flex/flexbox_flex-1-1-auto.htm.png | Bin 0 -> 554 bytes ...xbox_flex-1-1.htm => flexbox_flex-1-1.htm} | 0 test/render/flex/flexbox_flex-1-1.htm.png | Bin 0 -> 554 bytes ...ss.htm => flexbox_flex-1-N-0-unitless.htm} | 0 .../flex/flexbox_flex-1-N-0-unitless.htm.png | Bin 0 -> 554 bytes ..._flex-1-N-0.htm => flexbox_flex-1-N-0.htm} | 0 test/render/flex/flexbox_flex-1-N-0.htm.png | Bin 0 -> 556 bytes ...rink.htm => flexbox_flex-1-N-N-shrink.htm} | 0 .../flex/flexbox_flex-1-N-N-shrink.htm.png | Bin 0 -> 368 bytes ..._flex-1-N-N.htm => flexbox_flex-1-N-N.htm} | 0 test/render/flex/flexbox_flex-1-N-N.htm.png | Bin 0 -> 554 bytes ...m => flexbox_flex-1-N-Npercent-shrink.htm} | 0 .../flexbox_flex-1-N-Npercent-shrink.htm.png | Bin 0 -> 368 bytes ...cent.htm => flexbox_flex-1-N-Npercent.htm} | 0 .../flex/flexbox_flex-1-N-Npercent.htm.png | Bin 0 -> 554 bytes ...1-N-auto.htm => flexbox_flex-1-N-auto.htm} | 0 .../render/flex/flexbox_flex-1-N-auto.htm.png | Bin 0 -> 554 bytes ...xbox_flex-1-N.htm => flexbox_flex-1-N.htm} | 0 test/render/flex/flexbox_flex-1-N.htm.png | Bin 0 -> 554 bytes ...ss.htm => flexbox_flex-N-0-0-unitless.htm} | 0 .../flex/flexbox_flex-N-0-0-unitless.htm.png | Bin 0 -> 556 bytes ..._flex-N-0-0.htm => flexbox_flex-N-0-0.htm} | 0 test/render/flex/flexbox_flex-N-0-0.htm.png | Bin 0 -> 556 bytes ...rink.htm => flexbox_flex-N-0-N-shrink.htm} | 0 .../flex/flexbox_flex-N-0-N-shrink.htm.png | Bin 0 -> 401 bytes ..._flex-N-0-N.htm => flexbox_flex-N-0-N.htm} | 0 test/render/flex/flexbox_flex-N-0-N.htm.png | Bin 0 -> 554 bytes ...m => flexbox_flex-N-0-Npercent-shrink.htm} | 0 .../flexbox_flex-N-0-Npercent-shrink.htm.png | Bin 0 -> 441 bytes ...cent.htm => flexbox_flex-N-0-Npercent.htm} | 0 .../flex/flexbox_flex-N-0-Npercent.htm.png | Bin 0 -> 554 bytes ...N-0-auto.htm => flexbox_flex-N-0-auto.htm} | 0 .../render/flex/flexbox_flex-N-0-auto.htm.png | Bin 0 -> 554 bytes ...xbox_flex-N-0.htm => flexbox_flex-N-0.htm} | 0 test/render/flex/flexbox_flex-N-0.htm.png | Bin 0 -> 554 bytes ...ss.htm => flexbox_flex-N-1-0-unitless.htm} | 0 .../flex/flexbox_flex-N-1-0-unitless.htm.png | Bin 0 -> 554 bytes ..._flex-N-1-0.htm => flexbox_flex-N-1-0.htm} | 0 test/render/flex/flexbox_flex-N-1-0.htm.png | Bin 0 -> 556 bytes ...rink.htm => flexbox_flex-N-1-N-shrink.htm} | 0 .../flex/flexbox_flex-N-1-N-shrink.htm.png | Bin 0 -> 368 bytes ..._flex-N-1-N.htm => flexbox_flex-N-1-N.htm} | 0 test/render/flex/flexbox_flex-N-1-N.htm.png | Bin 0 -> 554 bytes ...m => flexbox_flex-N-1-Npercent-shrink.htm} | 0 .../flexbox_flex-N-1-Npercent-shrink.htm.png | Bin 0 -> 368 bytes ...cent.htm => flexbox_flex-N-1-Npercent.htm} | 0 .../flex/flexbox_flex-N-1-Npercent.htm.png | Bin 0 -> 554 bytes ...N-1-auto.htm => flexbox_flex-N-1-auto.htm} | 0 .../render/flex/flexbox_flex-N-1-auto.htm.png | Bin 0 -> 554 bytes ...xbox_flex-N-1.htm => flexbox_flex-N-1.htm} | 0 test/render/flex/flexbox_flex-N-1.htm.png | Bin 0 -> 554 bytes ...ss.htm => flexbox_flex-N-N-0-unitless.htm} | 0 .../flex/flexbox_flex-N-N-0-unitless.htm.png | Bin 0 -> 554 bytes ..._flex-N-N-0.htm => flexbox_flex-N-N-0.htm} | 0 test/render/flex/flexbox_flex-N-N-0.htm.png | Bin 0 -> 556 bytes ...rink.htm => flexbox_flex-N-N-N-shrink.htm} | 0 .../flex/flexbox_flex-N-N-N-shrink.htm.png | Bin 0 -> 368 bytes ..._flex-N-N-N.htm => flexbox_flex-N-N-N.htm} | 0 test/render/flex/flexbox_flex-N-N-N.htm.png | Bin 0 -> 554 bytes ...m => flexbox_flex-N-N-Npercent-shrink.htm} | 0 .../flexbox_flex-N-N-Npercent-shrink.htm.png | Bin 0 -> 368 bytes ...cent.htm => flexbox_flex-N-N-Npercent.htm} | 0 .../flex/flexbox_flex-N-N-Npercent.htm.png | Bin 0 -> 554 bytes ...N-N-auto.htm => flexbox_flex-N-N-auto.htm} | 0 .../render/flex/flexbox_flex-N-N-auto.htm.png | Bin 0 -> 554 bytes ...xbox_flex-N-N.htm => flexbox_flex-N-N.htm} | 0 test/render/flex/flexbox_flex-N-N.htm.png | Bin 0 -> 554 bytes ...ox_flex-auto.htm => flexbox_flex-auto.htm} | 0 test/render/flex/flexbox_flex-auto.htm.png | Bin 0 -> 532 bytes ...rink.htm => flexbox_flex-basis-shrink.htm} | 0 .../flex/flexbox_flex-basis-shrink.htm.png | Bin 0 -> 452 bytes ..._flex-basis.htm => flexbox_flex-basis.htm} | 0 test/render/flex/flexbox_flex-basis.htm.png | Bin 0 -> 495 bytes ...xbox_flex-natural-variable-auto-basis.htm} | 0 ...x_flex-natural-variable-auto-basis.htm.png | Bin 0 -> 470 bytes ...x-natural.htm => flexbox_flex-natural.htm} | 0 test/render/flex/flexbox_flex-natural.htm.png | Bin 0 -> 1095 bytes ...x_justifycontent-spacebetween-only.htm.png | Bin 233 -> 233 bytes ...ulti-line-wrap-reverse-column-reverse.htm} | 0 ...i-line-wrap-reverse-column-reverse.htm.png | Bin 0 -> 1446 bytes ...hts-006.htm => percentage-heights-006.htm} | 0 .../flex/percentage-heights-006.htm.png | Bin 0 -> 577 bytes ...hts-007.htm => percentage-heights-007.htm} | 0 .../flex/percentage-heights-007.htm.png | Bin 0 -> 577 bytes ...tm => table-as-item-fixed-min-width-2.htm} | 0 .../table-as-item-fixed-min-width-2.htm.png | Bin 0 -> 577 bytes ...=> table-as-item-stretch-cross-size-3.htm} | 0 ...table-as-item-stretch-cross-size-3.htm.png | Bin 0 -> 577 bytes 208 files changed, 145 insertions(+), 40 deletions(-) rename test/render/flex/{--auto-height-with-flex.htm => auto-height-with-flex.htm} (100%) create mode 100644 test/render/flex/auto-height-with-flex.htm.png rename test/render/flex/{--display-flex-001.htm => display-flex-001.htm} (100%) create mode 100644 test/render/flex/display-flex-001.htm.png rename test/render/flex/{--flex-003.htm => flex-003.htm} (100%) create mode 100644 test/render/flex/flex-003.htm.png rename test/render/flex/{--flex-basis-002.htm => flex-basis-002.htm} (100%) create mode 100644 test/render/flex/flex-basis-002.htm.png rename test/render/flex/{--flex-basis-006.htm => flex-basis-006.htm} (100%) create mode 100644 test/render/flex/flex-basis-006.htm.png rename test/render/flex/{--flex-direction-row-001-visual.htm => flex-direction-row-001-visual.htm} (100%) create mode 100644 test/render/flex/flex-direction-row-001-visual.htm.png rename test/render/flex/{--flex-direction-row-reverse-001-visual.htm => flex-direction-row-reverse-001-visual.htm} (100%) create mode 100644 test/render/flex/flex-direction-row-reverse-001-visual.htm.png rename test/render/flex/{--flex-grow-001.htm => flex-grow-001.htm} (100%) create mode 100644 test/render/flex/flex-grow-001.htm.png rename test/render/flex/{--flex-grow-002.htm => flex-grow-002.htm} (100%) create mode 100644 test/render/flex/flex-grow-002.htm.png rename test/render/flex/{--flex-minimum-height-flex-items-011.htm => flex-minimum-height-flex-items-011.htm} (100%) create mode 100644 test/render/flex/flex-minimum-height-flex-items-011.htm.png rename test/render/flex/{--flexbox-abspos-child-001a.htm => flexbox-abspos-child-001a.htm} (100%) create mode 100644 test/render/flex/flexbox-abspos-child-001a.htm.png rename test/render/flex/{--flexbox-abspos-child-001b.htm => flexbox-abspos-child-001b.htm} (100%) create mode 100644 test/render/flex/flexbox-abspos-child-001b.htm.png rename test/render/flex/{--flexbox-flex-flow-001.htm => flexbox-flex-flow-001.htm} (100%) create mode 100644 test/render/flex/flexbox-flex-flow-001.htm.png rename test/render/flex/{--flexbox-flex-wrap-default.htm => flexbox-flex-wrap-default.htm} (100%) create mode 100644 test/render/flex/flexbox-flex-wrap-default.htm.png rename test/render/flex/{--flexbox-flex-wrap-nowrap.htm => flexbox-flex-wrap-nowrap.htm} (100%) create mode 100644 test/render/flex/flexbox-flex-wrap-nowrap.htm.png rename test/render/flex/{--flexbox-overflow-horiz-001.htm => flexbox-overflow-horiz-001.htm} (100%) create mode 100644 test/render/flex/flexbox-overflow-horiz-001.htm.png rename test/render/flex/{--flexbox-overflow-horiz-002.htm => flexbox-overflow-horiz-002.htm} (100%) create mode 100644 test/render/flex/flexbox-overflow-horiz-002.htm.png rename test/render/flex/{--flexbox-overflow-horiz-003.htm => flexbox-overflow-horiz-003.htm} (100%) create mode 100644 test/render/flex/flexbox-overflow-horiz-003.htm.png rename test/render/flex/{--flexbox-overflow-horiz-005.htm => flexbox-overflow-horiz-005.htm} (100%) create mode 100644 test/render/flex/flexbox-overflow-horiz-005.htm.png rename test/render/flex/{--flexbox-overflow-vert-002.htm => flexbox-overflow-vert-002.htm} (100%) create mode 100644 test/render/flex/flexbox-overflow-vert-002.htm.png rename test/render/flex/{--flexbox-overflow-vert-003.htm => flexbox-overflow-vert-003.htm} (100%) create mode 100644 test/render/flex/flexbox-overflow-vert-003.htm.png rename test/render/flex/{--flexbox-overflow-vert-005.htm => flexbox-overflow-vert-005.htm} (100%) create mode 100644 test/render/flex/flexbox-overflow-vert-005.htm.png rename test/render/flex/{--flexbox-root-node-001a.htm => flexbox-root-node-001a.htm} (100%) create mode 100644 test/render/flex/flexbox-root-node-001a.htm.png rename test/render/flex/{--flexbox-root-node-001b.htm => flexbox-root-node-001b.htm} (100%) create mode 100644 test/render/flex/flexbox-root-node-001b.htm.png rename test/render/flex/{--flexbox_align-content-stretch.htm => flexbox_align-content-stretch.htm} (100%) create mode 100644 test/render/flex/flexbox_align-content-stretch.htm.png rename test/render/flex/{--flexbox_align-self-baseline.htm => flexbox_align-self-baseline.htm} (100%) create mode 100644 test/render/flex/flexbox_align-self-baseline.htm.png rename test/render/flex/{--flexbox_flex-0-0-0.htm => flexbox_flex-0-0-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-0-0.htm.png rename test/render/flex/{--flexbox_flex-0-0-N-shrink.htm => flexbox_flex-0-0-N-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-0-N-shrink.htm.png rename test/render/flex/{--flexbox_flex-0-0-N.htm => flexbox_flex-0-0-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-0-N.htm.png rename test/render/flex/{--flexbox_flex-0-0-Npercent-shrink.htm => flexbox_flex-0-0-Npercent-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-0-Npercent-shrink.htm.png rename test/render/flex/{--flexbox_flex-0-0-Npercent.htm => flexbox_flex-0-0-Npercent.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-0-Npercent.htm.png rename test/render/flex/{--flexbox_flex-0-1-0.htm => flexbox_flex-0-1-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-1-0.htm.png rename test/render/flex/{--flexbox_flex-0-1-N-shrink.htm => flexbox_flex-0-1-N-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-1-N-shrink.htm.png rename test/render/flex/{--flexbox_flex-0-1-N.htm => flexbox_flex-0-1-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-1-N.htm.png rename test/render/flex/{--flexbox_flex-0-1-Npercent-shrink.htm => flexbox_flex-0-1-Npercent-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-1-Npercent-shrink.htm.png rename test/render/flex/{--flexbox_flex-0-1-Npercent.htm => flexbox_flex-0-1-Npercent.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-1-Npercent.htm.png rename test/render/flex/{--flexbox_flex-0-N-0.htm => flexbox_flex-0-N-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-N-0.htm.png rename test/render/flex/{--flexbox_flex-0-N-N-shrink.htm => flexbox_flex-0-N-N-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-N-N-shrink.htm.png rename test/render/flex/{--flexbox_flex-0-N-N.htm => flexbox_flex-0-N-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-N-N.htm.png rename test/render/flex/{--flexbox_flex-0-N-Npercent-shrink.htm => flexbox_flex-0-N-Npercent-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-N-Npercent-shrink.htm.png rename test/render/flex/{--flexbox_flex-0-N-Npercent.htm => flexbox_flex-0-N-Npercent.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-N-Npercent.htm.png rename test/render/flex/{--flexbox_flex-1-0-0-unitless.htm => flexbox_flex-1-0-0-unitless.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-0-0-unitless.htm.png rename test/render/flex/{--flexbox_flex-1-0-0.htm => flexbox_flex-1-0-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-0-0.htm.png rename test/render/flex/{--flexbox_flex-1-0-N-shrink.htm => flexbox_flex-1-0-N-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-0-N-shrink.htm.png rename test/render/flex/{--flexbox_flex-1-0-N.htm => flexbox_flex-1-0-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-0-N.htm.png rename test/render/flex/{--flexbox_flex-1-0-Npercent-shrink.htm => flexbox_flex-1-0-Npercent-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-0-Npercent-shrink.htm.png rename test/render/flex/{--flexbox_flex-1-0-Npercent.htm => flexbox_flex-1-0-Npercent.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-0-Npercent.htm.png rename test/render/flex/{--flexbox_flex-1-0-auto.htm => flexbox_flex-1-0-auto.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-0-auto.htm.png rename test/render/flex/{--flexbox_flex-1-0.htm => flexbox_flex-1-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-0.htm.png rename test/render/flex/{--flexbox_flex-1-1-0-unitless.htm => flexbox_flex-1-1-0-unitless.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-1-0-unitless.htm.png rename test/render/flex/{--flexbox_flex-1-1-0.htm => flexbox_flex-1-1-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-1-0.htm.png rename test/render/flex/{--flexbox_flex-1-1-N-shrink.htm => flexbox_flex-1-1-N-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-1-N-shrink.htm.png rename test/render/flex/{--flexbox_flex-1-1-N.htm => flexbox_flex-1-1-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-1-N.htm.png rename test/render/flex/{--flexbox_flex-1-1-Npercent-shrink.htm => flexbox_flex-1-1-Npercent-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-1-Npercent-shrink.htm.png rename test/render/flex/{--flexbox_flex-1-1-Npercent.htm => flexbox_flex-1-1-Npercent.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-1-Npercent.htm.png rename test/render/flex/{--flexbox_flex-1-1-auto.htm => flexbox_flex-1-1-auto.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-1-auto.htm.png rename test/render/flex/{--flexbox_flex-1-1.htm => flexbox_flex-1-1.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-1.htm.png rename test/render/flex/{--flexbox_flex-1-N-0-unitless.htm => flexbox_flex-1-N-0-unitless.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-N-0-unitless.htm.png rename test/render/flex/{--flexbox_flex-1-N-0.htm => flexbox_flex-1-N-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-N-0.htm.png rename test/render/flex/{--flexbox_flex-1-N-N-shrink.htm => flexbox_flex-1-N-N-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-N-N-shrink.htm.png rename test/render/flex/{--flexbox_flex-1-N-N.htm => flexbox_flex-1-N-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-N-N.htm.png rename test/render/flex/{--flexbox_flex-1-N-Npercent-shrink.htm => flexbox_flex-1-N-Npercent-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-N-Npercent-shrink.htm.png rename test/render/flex/{--flexbox_flex-1-N-Npercent.htm => flexbox_flex-1-N-Npercent.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-N-Npercent.htm.png rename test/render/flex/{--flexbox_flex-1-N-auto.htm => flexbox_flex-1-N-auto.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-N-auto.htm.png rename test/render/flex/{--flexbox_flex-1-N.htm => flexbox_flex-1-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-N.htm.png rename test/render/flex/{--flexbox_flex-N-0-0-unitless.htm => flexbox_flex-N-0-0-unitless.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-0-0-unitless.htm.png rename test/render/flex/{--flexbox_flex-N-0-0.htm => flexbox_flex-N-0-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-0-0.htm.png rename test/render/flex/{--flexbox_flex-N-0-N-shrink.htm => flexbox_flex-N-0-N-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-0-N-shrink.htm.png rename test/render/flex/{--flexbox_flex-N-0-N.htm => flexbox_flex-N-0-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-0-N.htm.png rename test/render/flex/{--flexbox_flex-N-0-Npercent-shrink.htm => flexbox_flex-N-0-Npercent-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-0-Npercent-shrink.htm.png rename test/render/flex/{--flexbox_flex-N-0-Npercent.htm => flexbox_flex-N-0-Npercent.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-0-Npercent.htm.png rename test/render/flex/{--flexbox_flex-N-0-auto.htm => flexbox_flex-N-0-auto.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-0-auto.htm.png rename test/render/flex/{--flexbox_flex-N-0.htm => flexbox_flex-N-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-0.htm.png rename test/render/flex/{--flexbox_flex-N-1-0-unitless.htm => flexbox_flex-N-1-0-unitless.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-1-0-unitless.htm.png rename test/render/flex/{--flexbox_flex-N-1-0.htm => flexbox_flex-N-1-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-1-0.htm.png rename test/render/flex/{--flexbox_flex-N-1-N-shrink.htm => flexbox_flex-N-1-N-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-1-N-shrink.htm.png rename test/render/flex/{--flexbox_flex-N-1-N.htm => flexbox_flex-N-1-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-1-N.htm.png rename test/render/flex/{--flexbox_flex-N-1-Npercent-shrink.htm => flexbox_flex-N-1-Npercent-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-1-Npercent-shrink.htm.png rename test/render/flex/{--flexbox_flex-N-1-Npercent.htm => flexbox_flex-N-1-Npercent.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-1-Npercent.htm.png rename test/render/flex/{--flexbox_flex-N-1-auto.htm => flexbox_flex-N-1-auto.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-1-auto.htm.png rename test/render/flex/{--flexbox_flex-N-1.htm => flexbox_flex-N-1.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-1.htm.png rename test/render/flex/{--flexbox_flex-N-N-0-unitless.htm => flexbox_flex-N-N-0-unitless.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-N-0-unitless.htm.png rename test/render/flex/{--flexbox_flex-N-N-0.htm => flexbox_flex-N-N-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-N-0.htm.png rename test/render/flex/{--flexbox_flex-N-N-N-shrink.htm => flexbox_flex-N-N-N-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-N-N-shrink.htm.png rename test/render/flex/{--flexbox_flex-N-N-N.htm => flexbox_flex-N-N-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-N-N.htm.png rename test/render/flex/{--flexbox_flex-N-N-Npercent-shrink.htm => flexbox_flex-N-N-Npercent-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-N-Npercent-shrink.htm.png rename test/render/flex/{--flexbox_flex-N-N-Npercent.htm => flexbox_flex-N-N-Npercent.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-N-Npercent.htm.png rename test/render/flex/{--flexbox_flex-N-N-auto.htm => flexbox_flex-N-N-auto.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-N-auto.htm.png rename test/render/flex/{--flexbox_flex-N-N.htm => flexbox_flex-N-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-N.htm.png rename test/render/flex/{--flexbox_flex-auto.htm => flexbox_flex-auto.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-auto.htm.png rename test/render/flex/{--flexbox_flex-basis-shrink.htm => flexbox_flex-basis-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-basis-shrink.htm.png rename test/render/flex/{--flexbox_flex-basis.htm => flexbox_flex-basis.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-basis.htm.png rename test/render/flex/{--flexbox_flex-natural-variable-auto-basis.htm => flexbox_flex-natural-variable-auto-basis.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-natural-variable-auto-basis.htm.png rename test/render/flex/{--flexbox_flex-natural.htm => flexbox_flex-natural.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-natural.htm.png rename test/render/flex/{--multi-line-wrap-reverse-column-reverse.htm => multi-line-wrap-reverse-column-reverse.htm} (100%) create mode 100644 test/render/flex/multi-line-wrap-reverse-column-reverse.htm.png rename test/render/flex/{--percentage-heights-006.htm => percentage-heights-006.htm} (100%) create mode 100644 test/render/flex/percentage-heights-006.htm.png rename test/render/flex/{--percentage-heights-007.htm => percentage-heights-007.htm} (100%) create mode 100644 test/render/flex/percentage-heights-007.htm.png rename test/render/flex/{--table-as-item-fixed-min-width-2.htm => table-as-item-fixed-min-width-2.htm} (100%) create mode 100644 test/render/flex/table-as-item-fixed-min-width-2.htm.png rename test/render/flex/{--table-as-item-stretch-cross-size-3.htm => table-as-item-stretch-cross-size-3.htm} (100%) create mode 100644 test/render/flex/table-as-item-stretch-cross-size-3.htm.png diff --git a/include/litehtml/types.h b/include/litehtml/types.h index 44b8f964f..583a994f7 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -195,6 +195,13 @@ namespace litehtml cbc_value_type_none, // min/max width/height of containing block is defined as none }; + enum cbc_size_mode + { + cbc_size_mode_normal = 0x00, + cbc_size_mode_exact_width = 0x01, + cbc_size_mode_exact_height = 0x02, + }; + struct typed_int { int value; @@ -226,15 +233,18 @@ namespace litehtml }; typed_int width; // width of the containing block + bool width_is_flex_basis; typed_int render_width; typed_int min_width; typed_int max_width; typed_int height; // height of the containing block + bool height_is_flex_basis; typed_int min_height; typed_int max_height; int context_idx; + uint32_t size_mode; containing_block_context() : width(0, cbc_value_type_auto), @@ -244,17 +254,27 @@ namespace litehtml height(0, cbc_value_type_auto), min_height(0, cbc_value_type_none), max_height(0, cbc_value_type_none), - context_idx(0) + context_idx(0), width_is_flex_basis(false), + height_is_flex_basis(false), + size_mode(cbc_size_mode_normal) {} - containing_block_context new_width(int w) const + containing_block_context new_width(int w, uint32_t _size_mode = cbc_size_mode_normal) const { containing_block_context ret = *this; - //if(ret.width.type != cbc_value_type_absolute) - { - ret.render_width = w - (ret.width - ret.render_width); - ret.width = w; - } + ret.render_width = w - (ret.width - ret.render_width); + ret.width = w; + ret.size_mode = _size_mode; + return ret; + } + + containing_block_context new_width_height(int w, int h, uint32_t _size_mode = cbc_size_mode_normal) const + { + containing_block_context ret = *this; + ret.render_width = w - (ret.width - ret.render_width); + ret.width = w; + ret.height = h; + ret.size_mode = _size_mode; return ret; } }; diff --git a/src/css_properties.cpp b/src/css_properties.cpp index 1dc16dab0..9df08e351 100644 --- a/src/css_properties.cpp +++ b/src/css_properties.cpp @@ -409,6 +409,11 @@ void litehtml::css_properties::compute_flex(const element* el, const document::p m_flex_shrink = el->get_number_property(_flex_shrink_, false, 1, offset(m_flex_shrink)); m_flex_align_self = (flex_align_items) el->get_enum_property(_align_self_, false, flex_align_items_auto, offset(m_flex_align_self)); m_flex_basis = el->get_length_property(_flex_basis_, false, css_length::predef_value(flex_basis_auto), offset(m_flex_basis)); + if(!m_flex_basis.is_predefined() && m_flex_basis.units() == css_units_none) + { + // flex-basis property must contain units + m_flex_basis.predef(flex_basis_auto); + } doc->cvt_units(m_flex_basis, get_font_size()); if(m_display == display_inline || m_display == display_inline_block) { diff --git a/src/render_block.cpp b/src/render_block.cpp index d653f3114..4eb8462b2 100644 --- a/src/render_block.cpp +++ b/src/render_block.cpp @@ -208,15 +208,24 @@ int litehtml::render_item_block::_render(int x, int y, const containing_block_co bool requires_rerender = false; // when true, the second pass for content rendering is required // Set block width - if(self_size.width.type == containing_block_context::cbc_value_type_absolute) + if(!self_size.width_is_flex_basis) { - ret_width = m_pos.width = self_size.render_width; - } else if(self_size.width.type == containing_block_context::cbc_value_type_percentage) - { - m_pos.width = self_size.render_width; + if(self_size.width.type == containing_block_context::cbc_value_type_absolute) + { + ret_width = m_pos.width = self_size.render_width; + } else + { + m_pos.width = self_size.render_width; + } } else { - m_pos.width = self_size.render_width; + if(ret_width > self_size.render_width) + { + m_pos.width = ret_width; + } else + { + m_pos.width = self_size.render_width; + } } // Fix width with min-width attribute diff --git a/src/render_block_context.cpp b/src/render_block_context.cpp index df2f5057f..c94bc5668 100644 --- a/src/render_block_context.cpp +++ b/src/render_block_context.cpp @@ -110,10 +110,9 @@ int litehtml::render_item_block_context::_render_content(int x, int y, bool seco } } - int block_height = 0; - if (get_predefined_height(block_height, self_size.height)) + if (self_size.height.type != containing_block_context::cbc_value_type_auto && self_size.height > 0) { - m_pos.height = block_height; + m_pos.height = self_size.height; } else { m_pos.height = child_top; diff --git a/src/render_flex.cpp b/src/render_flex.cpp index d97dc62f0..7614d2406 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -263,7 +263,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.el->render(el_x, el_y, - self_size.new_width(item.main_size), fmt_ctx, false); + self_size.new_width(item.main_size - item.el->content_offset_width(), containing_block_context::cbc_size_mode_exact_width), fmt_ctx, false); ln.cross_size = std::max(ln.cross_size, item.el->height()); el_x += item.el->width(); } @@ -280,7 +280,11 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, self_size, fmt_ctx, false); item.el->render(el_x, el_y, - self_size.new_width(el_ret_width), fmt_ctx, false); + self_size.new_width_height(el_ret_width - item.el->content_offset_width(), + item.main_size - item.el->content_offset_height(), + containing_block_context::cbc_size_mode_exact_width | + containing_block_context::cbc_size_mode_exact_height), + fmt_ctx, false); ln.cross_size = std::max(ln.cross_size, item.el->width()); el_y += item.el->height(); } @@ -290,6 +294,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } int free_cross_size = 0; + int cross_end = 0; if (is_row_direction) { if (self_size.height.type != containing_block_context::cbc_value_type_auto) @@ -300,11 +305,16 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, height -= box_sizing_height(); } free_cross_size = height - sum_cross_size; + cross_end = std::max(sum_cross_size, height); + } else + { + cross_end = sum_cross_size; } } else { free_cross_size = self_size.render_width - sum_cross_size; ret_width = sum_cross_size; + cross_end = std::max(sum_cross_size, (int) self_size.render_width); } // Find line cross size and align items @@ -317,10 +327,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { if(is_row_direction) { - el_y = sum_cross_size - lines_spread.start(); + el_y = cross_end - lines_spread.start(); } else { - el_x = sum_cross_size - lines_spread.start(); + el_x = cross_end - lines_spread.start(); } } else { @@ -390,6 +400,9 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { // TODO: must be rendered into the specified height item.el->pos().height = ln.cross_size - item.el->content_offset_height(); + } else if(is_wrap_reverse) + { + item.el->pos().y = el_y + ln.cross_size - item.el->height() + item.el->content_offset_top(); } break; } @@ -467,13 +480,24 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, break; default: item.el->pos().x = el_x + item.el->content_offset_left(); - item.el->render(el_x, - item.el->pos().y - item.el->content_offset_top(), - self_size.new_width(ln.cross_size), fmt_ctx, false); - if(item.el->css().get_width().is_predefined()) + if(!item.el->css().get_width().is_predefined()) { - // TODO: must be rendered into the specified height - item.el->pos().height = item.main_size - item.el->content_offset_height(); + item.el->render(el_x, + item.el->pos().y - item.el->content_offset_top(), + self_size.new_width(ln.cross_size), fmt_ctx, false); + } else + { + item.el->render(el_x, + item.el->pos().y - item.el->content_offset_top(), + self_size.new_width_height(ln.cross_size - item.el->content_offset_width(), + item.main_size - item.el->content_offset_height(), + containing_block_context::cbc_size_mode_exact_width | + containing_block_context::cbc_size_mode_exact_height), + fmt_ctx, false); + } + if(!item.el->css().get_width().is_predefined() && is_wrap_reverse) + { + item.el->pos().x = el_x + ln.cross_size - item.el->width() + item.el->content_offset_left(); } break; } diff --git a/src/render_image.cpp b/src/render_image.cpp index 63e622d7b..1ff4574bb 100644 --- a/src/render_image.cpp +++ b/src/render_image.cpp @@ -5,6 +5,7 @@ int litehtml::render_item_image::_render(int x, int y, const containing_block_context &containing_block_size, formatting_context* fmt_ctx, bool second_pass) { int parent_width = containing_block_size.width; + containing_block_context self_size = calculate_containing_block_context(containing_block_size); calc_outlines(parent_width); @@ -60,10 +61,10 @@ int litehtml::render_item_image::_render(int x, int y, const containing_block_co } } else if(!src_el()->css().get_height().is_predefined() && src_el()->css().get_width().is_predefined()) { - if (!get_predefined_height(m_pos.height, containing_block_size.height)) - { - m_pos.height = (int)src_el()->css().get_height().val(); - } + if(self_size.height.type != containing_block_context::cbc_value_type_auto && self_size.height > 0) + { + m_pos.height = self_size.height; + } // check for max-height if(!src_el()->css().get_max_height().is_predefined()) @@ -107,10 +108,10 @@ int litehtml::render_item_image::_render(int x, int y, const containing_block_co { m_pos.width = (int) src_el()->css().get_width().calc_percent(parent_width); m_pos.height = 0; - if (!get_predefined_height(m_pos.height, containing_block_size.height)) - { - m_pos.height = (int)src_el()->css().get_height().val(); - } + if(self_size.height.type != containing_block_context::cbc_value_type_auto && self_size.height > 0) + { + m_pos.height = self_size.height; + } // check for max-height if(!src_el()->css().get_max_height().is_predefined()) diff --git a/src/render_item.cpp b/src/render_item.cpp index 6e153d32f..999d96895 100644 --- a/src/render_item.cpp +++ b/src/render_item.cpp @@ -1039,8 +1039,55 @@ litehtml::containing_block_context litehtml::render_item::calculate_containing_b // We have to use aut value for display_table_cell also. if (src_el()->css().get_display() != display_table_cell) { - calc_cb_length(src_el()->css().get_width(), cb_context.width, ret.width); - calc_cb_length(src_el()->css().get_height(), cb_context.height, ret.height); + auto par = parent(); + if(cb_context.size_mode & containing_block_context::cbc_size_mode_exact_width) + { + ret.width.value = cb_context.width; + ret.width.type = containing_block_context::cbc_value_type_absolute; + } else + { + auto *width = &css().get_width(); + if(par && (par->css().get_display() == display_flex || par->css().get_display() == display_inline_flex)) + { + if(!css().get_flex_basis().is_predefined() && css().get_flex_basis().val() >= 0) + { + if(par->css().get_flex_direction() == flex_direction_row || par->css().get_flex_direction() == flex_direction_row_reverse) + { + ret.width.type = containing_block_context::cbc_value_type_auto; + ret.width.value = 0; + width = nullptr; + } + } + } + if(width) + { + calc_cb_length(*width, cb_context.width, ret.width); + } + } + if(cb_context.size_mode & containing_block_context::cbc_size_mode_exact_height) + { + ret.height.value = cb_context.height; + ret.height.type = containing_block_context::cbc_value_type_absolute; + } else + { + auto *height = &css().get_height(); + if(par && (par->css().get_display() == display_flex || par->css().get_display() == display_inline_flex)) + { + if(!css().get_flex_basis().is_predefined() && css().get_flex_basis().val() >= 0) + { + if(par->css().get_flex_direction() == flex_direction_column || par->css().get_flex_direction() == flex_direction_column_reverse) + { + ret.height.type = containing_block_context::cbc_value_type_auto; + ret.height.value = 0; + height = nullptr; + } + } + } + if(height) + { + calc_cb_length(*height, cb_context.height, ret.height); + } + } if (ret.width.type != containing_block_context::cbc_value_type_auto && (src_el()->css().get_display() == display_table || src_el()->is_root())) { ret.width.value -= content_offset_width(); diff --git a/src/render_table.cpp b/src/render_table.cpp index 1a3859641..fdff1f826 100644 --- a/src/render_table.cpp +++ b/src/render_table.cpp @@ -261,10 +261,10 @@ int litehtml::render_item_table::_render(int x, int y, const containing_block_co // calculate block height int block_height = 0; - if (get_predefined_height(block_height, containing_block_size.height)) - { - block_height -= m_padding.height() + m_borders.height(); - } + if(self_size.height.type != containing_block_context::cbc_value_type_auto && self_size.height > 0) + { + block_height = self_size.height - (m_padding.height() + m_borders.height()); + } // calculate minimum height from m_css.get_min_height() int min_height = 0; diff --git a/test/render/flex/--auto-height-with-flex.htm b/test/render/flex/auto-height-with-flex.htm similarity index 100% rename from test/render/flex/--auto-height-with-flex.htm rename to test/render/flex/auto-height-with-flex.htm diff --git a/test/render/flex/auto-height-with-flex.htm.png b/test/render/flex/auto-height-with-flex.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..5f7be4df31ec1f25376106c5f60ea58bb88e3340 GIT binary patch literal 345 zcmV-f0jBLSsBMn!VhP>BvS+!1ObR-*$!#r{+*+^T=5{W7t$*XWdA zbwrruCPK@Kf5n52>eMjhaM^+O_)u)zCsJ81<%cQi|=#(Fe r9MLf#0+DIyB99G-K1l!o0ITx{3U<)5CY}0u00000NkvXXu0mjfSl5tO literal 0 HcmV?d00001 diff --git a/test/render/flex/--display-flex-001.htm b/test/render/flex/display-flex-001.htm similarity index 100% rename from test/render/flex/--display-flex-001.htm rename to test/render/flex/display-flex-001.htm diff --git a/test/render/flex/display-flex-001.htm.png b/test/render/flex/display-flex-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b5d9e99107844d149e504cf70cdb7a0f59ec648c GIT binary patch literal 516 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*GqL_5I9y?^MS2GzJJ5aM(=M^?)Fd3nCx>bGx%8h|LK`ctA*+q zGnHBdoH!JLL{-++-+w~pUt75%ul>|v)t%wXuU@LLsNRzukyNo>;q&1M_neolc3SkU z%%d_tj%m}4pjGw7rd$6!eQ!6zG;7tpJwAwSrs{X+ zyuH4C&Yq|G_4Ybzb9TOpiFVlK^>$ZnRA1^aJ{fF-!JR|02^gw;CJSNw+>-O0Jn9cs3}9 z`}=*HG(82)eB()VXHJxftUc}g>?_Zc%*X%M$DaN^=SIKR8}nP0X~HR=Shvhrx-EO_ zu0Gb6)w5T96yF_IJ?mEN#l>Z76(`uvk7rtY+_2wj!ev{&U*#U)VBt`Fa{lM9m<9$$ pCKe6>1qZ4!P8hM}ZVifKQ0)|NsAiOa_Mk|Ccg& zCszCgD(v@kaSW+od^%`8lAZjI_6yOPTv zb^Aj9uGH>OG1TMD_Wu9n*3z&^As5;wex2KK-Yf5Ex$)MER{CG}?%378{@aa-vde>> z%k6GmdeoNbIb+JX-wHdK53ZAGOpw`g_9Z_0VkS9g-l_xSbqTQ8b@-9gP;Kc{ND z@(tDhcizmcc)KD$v+7Mp?YAG*db($~{`!$+d*a&4Mw#6Y-+e4^UZSnA!eY9^CB_r? z%#%bFZhxP@ch`bdF5cT0{Iu+jXzdhpPZRHK($|VQdO&}@vBdI|i>AK6xq5T(=SKER z78$&^iZ@NodAD%(y=a-$hbr&Q6G&G-w(ipR>c>BClw8cUuTnqp#Z%$)%a)(4yWid@ ze7EoRpHI7&uekp7dF%EMb4$J+SzTgYWNf;1#azDF{F=Q5HGCdFawnAf+A~XD5#7(v z(8=xhCG*#*!jF?>1LwS}`}AnZ|4o;L|8^|s<*4&?5|K;%xLNXZ?X>>6$0vWcb;?Ry z+Qj1dE8%PI;@tOP?_Jl=bEqiU;=R}V)0R!uS$jWTyj_#Wa#DMO<@f$6>=SAPm;AiL z(sXvZXh(^4&?X<(%O@r;w_D^^;6E*hugUQ5nrBVdVnem(Hgp@*2sJTLPvsy;GW2b5TpEE_qA% z+8qk7{>N>7lf5Z2Y^%|#Yq|>BOW*GNlt1ZgX0h>!^DnPE)ctxf$-E*6mZ$^YU#buP z@_)Xz5{Dy)lR%R|ivo)xZJ9L|9H1Ok8(q(M;zn&kiU=n^D4Tk^`njxgN@xNApbp0@ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flex-basis-002.htm b/test/render/flex/flex-basis-002.htm similarity index 100% rename from test/render/flex/--flex-basis-002.htm rename to test/render/flex/flex-basis-002.htm diff --git a/test/render/flex/flex-basis-002.htm.png b/test/render/flex/flex-basis-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$pt<74`kK@iU0o{ zGamwJnacZW3=C{}o-U3d6^w7DHWt3t5ODBifAc5%K^?pK$_M9{wBE1RX6Lw|q$p`Q zX|LbC*%eGo2M-CK<^`IB0CiSEGqjoYE#&JS#mj#GestwtSy83+e7~%VLrzSr`@rDX z!5yjnr{-jw(bdbF|9C%Ld2#tSHK6hlGCOsQ+8!pJI!;jQuJNOwR7c_&|(oMy=Q@ncNE11&CHfB4Vbp&w9!&6 z{hyV&^Q8no<(%+1=Fnj%z{J4dY+*k=_4&UDvyS(D4_$VpO7=cnXgBxR-U@yno$q1_ z>GyYjS}?)wNsQRl3)9Lg+62C@TZld@FaY&l(;`TzHi zIA71RyY6UBKl<+8`VDN4fK!m##L8zg0T>NyL{Qr)`C& zF7n^we8_F8@8z#1*F*fie$m)}ha=E&>Vo{w7QF&r|JBU0D(3$t*;lSU?PdLP-&>|< zp5m#dLQLcQ+Ahg=J#!Xc5%On z{cyJ6wMgNv33;{l_YOOqs(9J5rTCStwZDgCdhiLW_H`|1KCb+Xj4LTY3K6 z@$Pns$lP5$$(C20qff4VIrmeIVcUu#S@q>Q+bi6QeonhR`?ury+Wr0ZQu(!Z_ocV` z9#?x?QTpd+@~rP~L=@xC7jOT1S220<3GK&wFMqGxXj|KOTj9x?rzb5R+GSsKe{}Vw z6a&Mz%ulP|JUN%z{Nvr+mB*z|-BtdcJM(mFlia133TAA#yKgHk5-)V=h}#{tM9$x> ztlGunrE<4LN`gUU!oKh#V8n?kD*sVYv~uFqRQu<(YT|~=de@i!eg8PyRMoV*WOYo~ zJ?-QrRU0KX2h7y}a{X`Ce4Fsh%gK6=zO+BucJdP+=j=)5K_#}Ovrny@C%1D~;@^*6 zm38@5>Un?OtU0&+#r9W={Z7bSRywC#ID5%XZZYo9OYOEE)qk^Y!nw?g?~lf>`pu|V z7tm2}kT+SUsK`%x-?BGbW`u>s&N!pFbpB>*=~(mUeG`oGUkX3JB^30yqlKCdr zL;_x}esaa)Z^50gRvWi;(@lYKbGB9Ye6!Yl_x|9=R>dbyURqX7tcv|dP%`s}y+8LJ zJuWss`p?}*SF>xh1(JALB%G}$@G2@@5*LyZC^GUoxL?}o-*3_XR!;x^2>%x-()!h) zaD;(bGduXi6BfngMn&y43QsB(jz}asJz1>%r2mAv)45cS4m*W86S5_R7V&d9txI+B zD0UDi(p7ev#r)~w4Tlpqc{nmb60W}mUUGBt?%$=UZBnE3B&II^}z*G%UG`tF-KnNt* z6sA&26;K#r03U=1h_!(z7*Mf7DcX@FQX&H36$oe={pd{p`q9ts%+Btfk3G9PJG=S& zNCZ>#Iy3+ProlvfH~<(p003&6p@AN0TLX^j4QAio{kwHKo!-@Jz{%HuPM4troHUgx z09dg*7$2}d1vU2FVzFYYNp9%!8k*yPNz<0Bx8xp4^Nnvh=-XSn{d}edT)ghqB*XV#(g8GaV#30_zXH@$lt} zzLuqmE_yY2cF(3}UPEJaOImnwd+KGFJwyA@JL?e_@UZMpFc^D06il%SBa%YGi6xi9 zBWrVcwnQx6n#~KY5?-owP{{18v%D3dtU}pIC%)4=4_R$jM0%8JWDh8|jon1`&vSP$ z1c3V%J#gG%F;0b^lDXT3-P&8}ZkNzkLn$~fmE67q+|~9}XCwTF)qAfZrIF2nd5ad% z_%di*zzg9n?W#{o~RN;L;FLLZBIRaQ`iw=i&ZGS=BN-|n`Vvqqiura z%Iwz3jGEk1b_^x5n<>QU3%;*jA}OuO$jlFCdxcgHf`y z-}1TL_hf{p`Q4wF^wDeNLzlIaiwPzer3Z<0NT>=F`zS9ma1X_z-{;%ZC7SNGFjZ_) zmDEKJZ|J)jUkZ9vj9lw)$?gogf|b8K!Hh~0!42jt${nA(TZURzw_%TdFGK-=pmNIP zhN9;^a+#Vj zw=?aw)}VHR*We^JdNlGp$!*#}X;_0&rcjP*Wog5ma8Fn27a!BmTQ--ZF56ue*jU#* zWq&$KB&g?9-kXmT-k3k2X<7{EFZaRqGDcSpV4kg|%oXTHe=`Tw!|XxKFtNV*wyNG$R9F21nThPRZGc!KN=U@wAABhssAVA6zTpkr!^RFm z`0-OA#PU;$hN=|I#as=b9Jr>Vkz9t_M~-eaco3cqAr8k0EI>Pj|*xKFHx9TZNnG)!ET zAeX1``<`#&x%Kw#%%xHF%sLzzbYIR|OT~khcXC+lB8x0uwh6c}OI}I@7c_*WMB@c> zq-e?>GK2^=ErE0BfUaGSZJ=9Lpm-JN-kHaX!bh!#W^56ma>%%Ng(2eh`Ui^({tgNZ z$vEs|80}ANcxrjo3}jIr*g)D$|A(77RjwPg320+$++_qYV%bs0%oY;Rwex-Q(H-fl zEMiPPm1KZ$P*7*4#i!FHS^FQsoC?p$zq|go6dbbUR0cEIU;jihx7B1MCZ<|BpAIB) ucxxedB!(pc^DQxsn}YraKF&kGWa*|E?*^4MqiVv(jSJpQ!V8gOS$_dzm`F?j literal 0 HcmV?d00001 diff --git a/test/render/flex/--flex-grow-001.htm b/test/render/flex/flex-grow-001.htm similarity index 100% rename from test/render/flex/--flex-grow-001.htm rename to test/render/flex/flex-grow-001.htm diff --git a/test/render/flex/flex-grow-001.htm.png b/test/render/flex/flex-grow-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..03d0ab88982a24d5c01c59a09341b3fa4e55787d GIT binary patch literal 169 zcmeAS@N?(olHy`uVBq!ia0y~yU}OTa{aBcRq-7850U*U6;1lBd|Nnm=lc52K|2H%= zyykvs0Az-Gx;TbZFupzK$l2f^z;Iyg2Db|wQ4SmG)#^9><9oNU;Ec))h83Gmo8S00 q|FKN5?c_XWJfK;X?WQV2m-vLX6VDNPHb6Mw<&;$SiN-n(s literal 0 HcmV?d00001 diff --git a/test/render/flex/--flex-grow-002.htm b/test/render/flex/flex-grow-002.htm similarity index 100% rename from test/render/flex/--flex-grow-002.htm rename to test/render/flex/flex-grow-002.htm diff --git a/test/render/flex/flex-grow-002.htm.png b/test/render/flex/flex-grow-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p8;xKOc{~eKR!Lwe(Z)mwBq) za~a#&7ke^-%wS-+G2`<6)4_kr_Vf0CcYb0hwf%QeKkw`K{|PPN{QP3}QJY7F@@MxQ>3wp>%;tX1vi{pI zN~0ed&VP7c<7w{SPpL|Kzgawv>+XHC@%zFpS?ezs+ZEehUc1HS`D>f~eaRu$L{qzu zS*O=_b+e|#-iGyKct-ikN3q&EuPaPgWlefs%_Zhz)%*1fX1V}5<*nH$}j%IB3{&v~!7 z$^0Ytu4`|$ztL6RJ>~oSrS6k^<*qCa*UgSE5cFSwi;9nSy+{a53Y=n> z9iz7Cvi+_PoBstXeCprw`OtcCNT4En>gTe~DWM4fO$ihy diff --git a/test/render/flex/--flex-minimum-height-flex-items-011.htm b/test/render/flex/flex-minimum-height-flex-items-011.htm similarity index 100% rename from test/render/flex/--flex-minimum-height-flex-items-011.htm rename to test/render/flex/flex-minimum-height-flex-items-011.htm diff --git a/test/render/flex/flex-minimum-height-flex-items-011.htm.png b/test/render/flex/flex-minimum-height-flex-items-011.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$pzopr0L02AMF0Q* literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-abspos-child-001b.htm b/test/render/flex/flexbox-abspos-child-001b.htm similarity index 100% rename from test/render/flex/--flexbox-abspos-child-001b.htm rename to test/render/flex/flexbox-abspos-child-001b.htm diff --git a/test/render/flex/flexbox-abspos-child-001b.htm.png b/test/render/flex/flexbox-abspos-child-001b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..31c053b0caf93bd31c9edc13f3e0ef18e151691d GIT binary patch literal 111 zcmeAS@N?(olHy`uVBq!ia0vp^DnMMu$P6TBbu3l~QfvV}A+G=b|7U1uX#ROZ6r{w{ z#WAFU@$ET7K?Vkn!w!E|A9cLoF#X=wS&E;}TSuH;eJbpwY@Y6`L^s`=eL(dLp00i_ I>zopr0L02AMF0Q* literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-flex-flow-001.htm b/test/render/flex/flexbox-flex-flow-001.htm similarity index 100% rename from test/render/flex/--flexbox-flex-flow-001.htm rename to test/render/flex/flexbox-flex-flow-001.htm diff --git a/test/render/flex/flexbox-flex-flow-001.htm.png b/test/render/flex/flexbox-flex-flow-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..eecf11f3414e960c10c147c664ba4987b9b3939a GIT binary patch literal 2077 zcmZvdeK^y5AIIk*);#^V(kWT?i*5&zbDz%SA!GBf#UZ;1Tat>7o1>H3OslmMj+uwe zaMO|87weXXm8a#Yr3abF?I7DIs~eHFEHaAWo}BACorizE-{1B7<$zHT4%6A8U>{H2LcfuW&D}Tgh0M@3f!9FQG4<><%}!m!6>UbK_m=EEl?Z?+`a>R(DLM>U(OQzf5^@r*P17TEQsJ%s?-neAi zI&JX6Bk)GQt9U8xjC?*E{hUvFWZmYYcrIHNNvw2ja)VormN(I#Z%ZniKn!Jb?=vOG zR7HC_toiTRp?00$pC|TM!`bJGP?pk+*|V)c;S>dP6-Wf$}w9jY?E#REJL||z-2*s?iRsA>1+VpW8fLV zy%LSz9m*X@y!ws_!6RagJ@U;f^k&l$&3sj?!&^D8;AK=~GtGjWcp+e6sdq93`#UB8 z-POHeHes7E09AQBdx9rHk*PODX8PcV=cuq<_w(7{OexgT0R-0cU z`;E`QG4FUsn*Y|ZypiOtYSVF~fcGlT5bN@!)L7B+!8wBA7ZZ2Z;_~dELpVdns}G|x z9+;LAsD+Il_<50FWJgq=+F8uMJ5zY}ZV z`b$S;?&gs-pWtD*?6sZvZ&gCrMmGYWa=lIs;G*yI=t6lD8_%TF(YzGlNlu?be;GaBk*5c(_waC>GHAOy(N> z3^~1j)~eu-T3Ij>aeeCE)rk~6le12{nUN^)IelOvG0EI@gv* zOD1Nm7yc9}pGyv)MMHJQAw9yu2m93tXiw1Y*e zXKS*@+&fqyiNK|wQ;2qM^8fMp!?MLaU|`z>V)z2E`S)1R@Nl6|@UNM0HuYo!f9}UG z3+J=AuS=+-p_4P~v<37p#c}f@j6;%8ogq~}r(dY)DmNz8yAcq*QV5W5lGN;5%Qya9d_pw~5i7=%2%l@P}-enz0H zhK|C^9iiGm+uW~*5p=X48!v2?dU$~o`@rkMFrZ^ggH7iyE>rQX^u=(mu(?fkyDdAb zku3)?y|8fdCCM~$;2WJvlaI^-6{@-t69Fbu#=Pnl#Ggp@` z79G1WjELIl^?CJQKgM%plgY}}vo6#-ifZ?y1rai&YedkQdz@G| literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-flex-wrap-default.htm b/test/render/flex/flexbox-flex-wrap-default.htm similarity index 100% rename from test/render/flex/--flexbox-flex-wrap-default.htm rename to test/render/flex/flexbox-flex-wrap-default.htm diff --git a/test/render/flex/flexbox-flex-wrap-default.htm.png b/test/render/flex/flexbox-flex-wrap-default.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..5c432eedfaa20b21279d53d49e522493162dcbc6 GIT binary patch literal 578 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKH!v{+$*u{HRDl#{fKQ0)|NsAiOoj#q*Gq-B`Df|QQ)7`^YBiia-K&j z$BY?4+Bdx3d+h)6hlM8Vi$7P&s`>BxTJ(JRee?DGPBq_H6)mNm=arRstUqeE)PCBv z|F)a!zh!V{pR1|bHq*c6-FdIio*VD~{Cw%vru83Zu0QqNF8}@4ch;M(sIL1N^!U|n z|8HxKoj-hSQ|R6L?f0Flr%kS@U9&y>*{sa@$CB6ma_ES?{l9IC;*s?Qe#a(UD(byI z*W1HdYsvAQS8|zCI`Rc?%WU-2Q@s1B=INeaHNR(=ZQNP^WtQj8WpQ@}=gStme_Q`~ zQ@hW`y*0mi%8#tCniq9iRptHNExF6)+-b|n-lzQJW%BRmiW^&Vl)qX%_q_aR%BRaO zLTpp|gjXJmEWPEo@`u`uBj%y|wEWh+wfX$syXJn4^siOlo=u3>|8vyhn?9=||J2t@ zvlPK$JpIqk*O%w_2{_sH3z)X7P;}u{%;E@i?vQf2BCx1!K!g|=KA8SvnxcF3`MlQ` Q-hf=`>FVdQ&MBb@02}iMe*gdg literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-flex-wrap-nowrap.htm b/test/render/flex/flexbox-flex-wrap-nowrap.htm similarity index 100% rename from test/render/flex/--flexbox-flex-wrap-nowrap.htm rename to test/render/flex/flexbox-flex-wrap-nowrap.htm diff --git a/test/render/flex/flexbox-flex-wrap-nowrap.htm.png b/test/render/flex/flexbox-flex-wrap-nowrap.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..5c432eedfaa20b21279d53d49e522493162dcbc6 GIT binary patch literal 578 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKH!v{+$*u{HRDl#{fKQ0)|NsAiOoj#q*Gq-B`Df|QQ)7`^YBiia-K&j z$BY?4+Bdx3d+h)6hlM8Vi$7P&s`>BxTJ(JRee?DGPBq_H6)mNm=arRstUqeE)PCBv z|F)a!zh!V{pR1|bHq*c6-FdIio*VD~{Cw%vru83Zu0QqNF8}@4ch;M(sIL1N^!U|n z|8HxKoj-hSQ|R6L?f0Flr%kS@U9&y>*{sa@$CB6ma_ES?{l9IC;*s?Qe#a(UD(byI z*W1HdYsvAQS8|zCI`Rc?%WU-2Q@s1B=INeaHNR(=ZQNP^WtQj8WpQ@}=gStme_Q`~ zQ@hW`y*0mi%8#tCniq9iRptHNExF6)+-b|n-lzQJW%BRmiW^&Vl)qX%_q_aR%BRaO zLTpp|gjXJmEWPEo@`u`uBj%y|wEWh+wfX$syXJn4^siOlo=u3>|8vyhn?9=||J2t@ zvlPK$JpIqk*O%w_2{_sH3z)X7P;}u{%;E@i?vQf2BCx1!K!g|=KA8SvnxcF3`MlQ` Q-hf=`>FVdQ&MBb@02}iMe*gdg literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-overflow-horiz-001.htm b/test/render/flex/flexbox-overflow-horiz-001.htm similarity index 100% rename from test/render/flex/--flexbox-overflow-horiz-001.htm rename to test/render/flex/flexbox-overflow-horiz-001.htm diff --git a/test/render/flex/flexbox-overflow-horiz-001.htm.png b/test/render/flex/flexbox-overflow-horiz-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..311bfc2d7bde45464f131de8724be3034d70c370 GIT binary patch literal 237 zcmeAS@N?(olHy`uVBq!ia0y~yV6*|UZ!j?fN$!)|w*o1i0G|-o|Ns9pF#Km|XlP() zuEakt!T9!!HLsJSfWyV54or0u91f~4TzH(Nu7Qcu!-;|OOrB#J%Y^BB z=0x9nWRiKSY-jeDh$oxhzutM~wZ!vlVU=@}?^fE#^&fxyu>wl%v9F&0B6N>){8j6( zp?kgOnD?6(=g)bRdtB>Y+L}jeZ|kF|M%4@BWp3KH?W<4+Z|{W^pgS2nUHx3vIVCg! E0D<#pjsO4v literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-overflow-horiz-002.htm b/test/render/flex/flexbox-overflow-horiz-002.htm similarity index 100% rename from test/render/flex/--flexbox-overflow-horiz-002.htm rename to test/render/flex/flexbox-overflow-horiz-002.htm diff --git a/test/render/flex/flexbox-overflow-horiz-002.htm.png b/test/render/flex/flexbox-overflow-horiz-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a6f311f233437006b553255aaa0163cb0223a5d4 GIT binary patch literal 207 zcmeAS@N?(olHy`uVBq!ia0vp^%YZnGg&9a5=`rsHQv3lvA+G;{pgy310SFry82;-B zSrh`Lsy$sCLn;{GUOmm}WGK*fabxrA#S9x+f*TY5n|4abcl#W0y-;v|`#;OwiI47? z<#vY8t`Y5>apvQ*cOkE5oxeEoWQx&DpJ!fYYb#6M%_6El#MIad%0q<8{+LR|m<|KGsSz`*dIp`k(U zMr!Dv?VwS8e#rZAS_Hq45k;yAqWDiQj zp?&=qZBJH8*%se;a^bV=E&TVe4E%jL~YH2-dGo42bbK%=CmEBB%OgegG|tS?+Pe>UF28Ur+&!PC{x JWt~$(6985VI*0%O literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-overflow-vert-002.htm b/test/render/flex/flexbox-overflow-vert-002.htm similarity index 100% rename from test/render/flex/--flexbox-overflow-vert-002.htm rename to test/render/flex/flexbox-overflow-vert-002.htm diff --git a/test/render/flex/flexbox-overflow-vert-002.htm.png b/test/render/flex/flexbox-overflow-vert-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..acad23a5643b13e2a9f822d9f93478a100b0aff1 GIT binary patch literal 192 zcmeAS@N?(olHy`uVBq!ia0vp^SwOsyg&9cRRWQE{r1%4TLR|j?L45!N!~X^bAZ%da zI057^gI~Sy9CG;(ezm4{l@Gp1;>cVmRcF2m~@6+IgBi{kK#4*IBvi ztFCKwEdrq|&)R&)tLv`BM)}WM+`ni=q^X9kDzk#8Ff#E+xLxbGM zuUSCx1Wy;okP61PR}8t1C`hziw0&f@bIEj*8_(9e@cLB5|6kSkQ*-O=(yjgPe)3GIHCxSBh-BJw0+Z-(iC_n>r33-jKYeAE-_&^2o!)-7}bW ZGcJ|mlx@-3bP;G5gQu&X%Q~loCIFzrM3Vpj literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-overflow-vert-005.htm b/test/render/flex/flexbox-overflow-vert-005.htm similarity index 100% rename from test/render/flex/--flexbox-overflow-vert-005.htm rename to test/render/flex/flexbox-overflow-vert-005.htm diff --git a/test/render/flex/flexbox-overflow-vert-005.htm.png b/test/render/flex/flexbox-overflow-vert-005.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..dff1df57e87919e92f13fa3890305f073f68de56 GIT binary patch literal 160 zcmeAS@N?(olHy`uVBq!ia0vp^VL-f)i5W;LtY2^xNbv;tgt-3y|G$Bufq~&aLqmhy z$FEsHaeq%2$B+ufw^tAHHYfeRZEF2qr|Jm%%hR!e<}Hsy~kpR?YxGqmm5`^)f78qjD4Pgg&e IbxsLQ0A7PT?*IS* literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-root-node-001a.htm b/test/render/flex/flexbox-root-node-001a.htm similarity index 100% rename from test/render/flex/--flexbox-root-node-001a.htm rename to test/render/flex/flexbox-root-node-001a.htm diff --git a/test/render/flex/flexbox-root-node-001a.htm.png b/test/render/flex/flexbox-root-node-001a.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..339ccae7bbb6aa6618857148fc73e3b7393f38c3 GIT binary patch literal 146 zcmeAS@N?(olHy`uVBq!ia0y~yVB7&@D=-2H29M7HEkG*L)5S5Qg7NKzjl2yGJkEiB zk`00a$vaNvoM294JGP+dLcn8@4yAaj^7T7>($|)~y(jv!Z@=}W9&Pihj2vegUi~Ta wKFE9I#KgJEHtzr8FHXGi@|W%WTU&o0iq)~$bT{3X=QPMNPgg&ebxsLQ0ICu=s{jB1 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-root-node-001b.htm b/test/render/flex/flexbox-root-node-001b.htm similarity index 100% rename from test/render/flex/--flexbox-root-node-001b.htm rename to test/render/flex/flexbox-root-node-001b.htm diff --git a/test/render/flex/flexbox-root-node-001b.htm.png b/test/render/flex/flexbox-root-node-001b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..339ccae7bbb6aa6618857148fc73e3b7393f38c3 GIT binary patch literal 146 zcmeAS@N?(olHy`uVBq!ia0y~yVB7&@D=-2H29M7HEkG*L)5S5Qg7NKzjl2yGJkEiB zk`00a$vaNvoM294JGP+dLcn8@4yAaj^7T7>($|)~y(jv!Z@=}W9&Pihj2vegUi~Ta wKFE9I#KgJEHtzr8FHXGi@|W%WTU&o0iq)~$bT{3X=QPMNPgg&ebxsLQ0ICu=s{jB1 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_align-content-stretch.htm b/test/render/flex/flexbox_align-content-stretch.htm similarity index 100% rename from test/render/flex/--flexbox_align-content-stretch.htm rename to test/render/flex/flexbox_align-content-stretch.htm diff --git a/test/render/flex/flexbox_align-content-stretch.htm.png b/test/render/flex/flexbox_align-content-stretch.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..3cb58461de2ad4add03b90232086b7f2be9af1fe GIT binary patch literal 354 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@CKhHO`D|0HJCG6z@CkAK|NlRb$-n@j{~tKL z_Qtd6Ss$Z-%DFvV978G?-(J1Q+hicnkQips$k=7UVAR;gYVh*k>Wa0Y$u*lzcP{%c zuU~5%zd>DA5C|r2JyNCrGO?;8=ChUm{Ik(<*T2~Ey^OAsoN!H9^riS*Qy<2a!jdA| zv*)EQ_3QPX6?ERjWAQeommmCB{<|5b^!9Xa$m>fxen0FJyY)A6y4}0lk9YHbHgE9+8vos3amRJzKF`dmWt+UM zO4oST>IVHi`&Dd3MAn35jj(}0vvfKQ0)|NsAiOa_MkYi~RQ zGXEbqU35kw3#i=C)5S5Qg7NLugTAjF1R5T0G0^v9tee2pqs`&Ptg!Qcm_&3Nvp8Se z64TFrPi5o>?yE4i^qi#PIcbSqS61!G|9|b>{4ei|+xA`ZM8C59`QUvgPI8}U@A$mq zjAhcP;<-Yf-p)KOaeHR4uU+WW=d$Oc=ihe-nUe4P@A%W5XY8LIE&IJizo_WbKV@|= z_#gT2&yDM^xBFMk{{Gdk&gSRssdM&(R~~sf?{mbm#+r^DYIe_Teoy1i+?Rj()lB_Q zq45EAwv%iYt@?8*@9@O$y7A?|KS}3rxt+iB%JseX{^sTXtG9dKJqHf{RD24XI2jxG zzif}!lP9H0>g$CqE9ag#`P#)VPQB=p)x^oyJNIm|Syc-1vx;Zz7e-}Co*%Q~loCIEzrzg_?U literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-0-0.htm b/test/render/flex/flexbox_flex-0-0-0.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-0-0.htm rename to test/render/flex/flexbox_flex-0-0-0.htm diff --git a/test/render/flex/flexbox_flex-0-0-0.htm.png b/test/render/flex/flexbox_flex-0-0-0.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..2b11d4515b4572d19185de0fbc8940e8e8514f7b GIT binary patch literal 621 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#(0*we)^q=ND7)w90Qjv@|;Q4)1~{H+|8HF^XvaBo)U{-v+@Ic0J? zZ;D{w6PI6hg{DdA@@IdU2Rog3U${LNxz)dIu zYgE^7TfO`D)x+=hE}x!kfBvuOKSr-GJI$Yut8{->Y@S`Ou6jJ+(~bCPHTQN*R-dwF zkEZ3Zt8eGL{kLbH;qkvkeTAQQoH;A8yYk()|M}0D@1I%lxYD?7QogqyZ$AI#J13Vu zF>1HAlso=#4vqzRW@BCiC%p&g4#GEp5-RZX9@(YvI zLstv!ZocKQ@yk4k)QM-+t(~1+TwJys-BOl!^4*5KY88(O3XV-IoRh>=->$s#GwPk$ zwCd_9)$0R`UY?q?Q2uTB1P|$ncMgZ0JEA}F*5b38=bXN+GwxaUEoM^8lDdw|-ivK7 z*POn`x_d!_!rjB4eQP}zJ+$zD=d(y9^HcgF$Iq9aJ)h~rC2c$Z{OU>P6eVRRwYw|* z^}V!ww!y?tlO9ak@>Bns?#$(7p10=y=uIhmp5s0Fo7!e;^XO^*CojEQqC4-~b8}DI z|KFgF6oR>yAmfw%q`QfCzxA5KbWGA*8w>JzNTU1^sf&}64JMxlg{!BlpUXO@geCx7 C+N?(a literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-0-N.htm b/test/render/flex/flexbox_flex-0-0-N.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-0-N.htm rename to test/render/flex/flexbox_flex-0-0-N.htm diff --git a/test/render/flex/flexbox_flex-0-0-N.htm.png b/test/render/flex/flexbox_flex-0-0-N.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b45b172347fe30811b59ca12f2649cc27cf2742e GIT binary patch literal 605 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($+0(@_q=ND7RmVIjM}fA$_=UL%^Y0vJ;*Mxy-f*Bg{ovpJ335I@ zBF4%(UXS?e=EuA`nzLqk-YdsRDxM&e7kRm~*2C`K71O^8ks>Eod4#!c(wY=HaZOiB zsLE=kNKsTF^^?n=maP6-GW%}H`rj|>?#^mT@ra*LGt<{Q@A>Y3=889^P70me-fHdn zDSOgdTifrEe8tQDp_Xl>~sXL9^~%I$5BZ$7_o{d3)o<+c0f-}fylYkcyK>11`?UHM6CW7RF~_dLD zz4ewyuU&ro&9dsd{_Y^J&zz_-Q_OQx=AfYFs>tX6UH|7fu7F31i&c|TE|=PRKqBxG a?{D6d%Pm^0r*9Jir4dh8KbLh*2~7Z$?iA(# literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-0-Npercent-shrink.htm b/test/render/flex/flexbox_flex-0-0-Npercent-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-0-Npercent-shrink.htm rename to test/render/flex/flexbox_flex-0-0-Npercent-shrink.htm diff --git a/test/render/flex/flexbox_flex-0-0-Npercent-shrink.htm.png b/test/render/flex/flexbox_flex-0-0-Npercent-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c37d2519b0e8ef420b74c6d9df71f9bd499c7985 GIT binary patch literal 441 zcmeAS@N?(olHy`uVBq!ia0y~yV4MhKFJfT^l10ppQX90fB!BXn@29sZD@KpMJ?*Ftu z*KUKEV_|mu{w@0_T`Z{ZdpWmfl4o$8dSU1DnV(J|9%Gg7mXkVC zRnLAY3KDrbscc$G@V}$yr`fbGNht5V@A2^6tKv-G>eU71bBiPYPMq>)T_(5vxA3(~ zRlq?r+vN^_;G?wq{ecT?8)ThDg*xWBz!dw5N; zb+yXfFjs{F6La~ECJxBSa-GWP$mPS1PoPxkBXeE06D z{ifpb`L`~`eJ^|dZr_&Fzu}wG%k?L1KmT{{)+dE)E?2HOZFB8+t`5YzbSJk@sHwZ? tp%OgN$JI#mWC$+C)$J*nYv6IR!G5Ej!Jq36TOWZU-P6_2Wt~$(6965!_F(`3 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-1-0.htm b/test/render/flex/flexbox_flex-0-1-0.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-1-0.htm rename to test/render/flex/flexbox_flex-0-1-0.htm diff --git a/test/render/flex/flexbox_flex-0-1-0.htm.png b/test/render/flex/flexbox_flex-0-1-0.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..2b11d4515b4572d19185de0fbc8940e8e8514f7b GIT binary patch literal 621 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#(0*we)^q=ND7)w90Qjv@|;Q4)1~{H+|8HF^XvaBo)U{-v+@Ic0J? zZ;D{w6PI6hg{DdA@@IdU2Rog3U${LNxz)dIu zYgE^7TfO`D)x+=hE}x!kfBvuOKSr-GJI$Yut8{->Y@S`Ou6jJ+(~bCPHTQN*R-dwF zkEZ3Zt8eGL{kLbH;qkvkeTAQQoH;A8yYk()|M}0D@1I%lxYD?7QogqyZ$AI#J13Vu zF>1HAlso=#4vqBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-1-N.htm b/test/render/flex/flexbox_flex-0-1-N.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-1-N.htm rename to test/render/flex/flexbox_flex-0-1-N.htm diff --git a/test/render/flex/flexbox_flex-0-1-N.htm.png b/test/render/flex/flexbox_flex-0-1-N.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b45b172347fe30811b59ca12f2649cc27cf2742e GIT binary patch literal 605 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($+0(@_q=ND7RmVIjM}fA$_=UL%^Y0vJ;*Mxy-f*Bg{ovpJ335I@ zBF4%(UXS?e=EuA`nzLqk-YdsRDxM&e7kRm~*2C`K71O^8ks>Eod4#!c(wY=HaZOiB zsLE=kNKsTF^^?n=maP6-GW%}H`rj|>?#^mT@ra*LGt<{Q@A>Y3=889^P70me-fHdn zDSOgdTifrEe8tQDp_Xl>~sXL9^~%I$5BZ$7_o{d3)o<+c0f-}fylYkcyK>11`?UHM6CW7RF~_dLD zz4ewyuU&ro&9dsd{_Y^J&zz_-Q_OQx=AfYFs>tX6UH|7fu7F31i&c|TE|=PRKqBxG a?{D6d%Pm^0r*9Jir4dh8KbLh*2~7Z$?iA(# literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-1-Npercent-shrink.htm b/test/render/flex/flexbox_flex-0-1-Npercent-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-1-Npercent-shrink.htm rename to test/render/flex/flexbox_flex-0-1-Npercent-shrink.htm diff --git a/test/render/flex/flexbox_flex-0-1-Npercent-shrink.htm.png b/test/render/flex/flexbox_flex-0-1-Npercent-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0f46f7c743d7fe89fb189e66fe368da99fad6594 GIT binary patch literal 368 zcmeAS@N?(olHy`uVBq!ia0vp^mwBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-1-Npercent.htm b/test/render/flex/flexbox_flex-0-1-Npercent.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-1-Npercent.htm rename to test/render/flex/flexbox_flex-0-1-Npercent.htm diff --git a/test/render/flex/flexbox_flex-0-1-Npercent.htm.png b/test/render/flex/flexbox_flex-0-1-Npercent.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d1eb5dbb1a83b6a59126899cbaced5a57bb02657 GIT binary patch literal 558 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@rtL5V@L(#+pC6oO5P%Ef%y-mUi_(K7t1*yq|>lq?r+vN^_;G?wq{ecT?8)ThDg*xWBz!dw5N; zb+yXfFjs{F6La~ECJxBSa-GWP$mPS1PoPxkBXeE06D z{ifpb`L`~`eJ^|dZr_&Fzu}wG%k?L1KmT{{)+dE)E?2HOZFB8+t`5YzbSJk@sHwZ? tp%OgN$JI#mWC$+C)$J*nYv6IR!G5Ej!Jq36TOWZU-P6_2Wt~$(6965!_F(`3 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-N-0.htm b/test/render/flex/flexbox_flex-0-N-0.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-N-0.htm rename to test/render/flex/flexbox_flex-0-N-0.htm diff --git a/test/render/flex/flexbox_flex-0-N-0.htm.png b/test/render/flex/flexbox_flex-0-N-0.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..2b11d4515b4572d19185de0fbc8940e8e8514f7b GIT binary patch literal 621 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#(0*we)^q=ND7)w90Qjv@|;Q4)1~{H+|8HF^XvaBo)U{-v+@Ic0J? zZ;D{w6PI6hg{DdA@@IdU2Rog3U${LNxz)dIu zYgE^7TfO`D)x+=hE}x!kfBvuOKSr-GJI$Yut8{->Y@S`Ou6jJ+(~bCPHTQN*R-dwF zkEZ3Zt8eGL{kLbH;qkvkeTAQQoH;A8yYk()|M}0D@1I%lxYD?7QogqyZ$AI#J13Vu zF>1HAlso=#4vqBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-N-N.htm b/test/render/flex/flexbox_flex-0-N-N.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-N-N.htm rename to test/render/flex/flexbox_flex-0-N-N.htm diff --git a/test/render/flex/flexbox_flex-0-N-N.htm.png b/test/render/flex/flexbox_flex-0-N-N.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b45b172347fe30811b59ca12f2649cc27cf2742e GIT binary patch literal 605 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#($+0(@_q=ND7RmVIjM}fA$_=UL%^Y0vJ;*Mxy-f*Bg{ovpJ335I@ zBF4%(UXS?e=EuA`nzLqk-YdsRDxM&e7kRm~*2C`K71O^8ks>Eod4#!c(wY=HaZOiB zsLE=kNKsTF^^?n=maP6-GW%}H`rj|>?#^mT@ra*LGt<{Q@A>Y3=889^P70me-fHdn zDSOgdTifrEe8tQDp_Xl>~sXL9^~%I$5BZ$7_o{d3)o<+c0f-}fylYkcyK>11`?UHM6CW7RF~_dLD zz4ewyuU&ro&9dsd{_Y^J&zz_-Q_OQx=AfYFs>tX6UH|7fu7F31i&c|TE|=PRKqBxG a?{D6d%Pm^0r*9Jir4dh8KbLh*2~7Z$?iA(# literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-N-Npercent-shrink.htm b/test/render/flex/flexbox_flex-0-N-Npercent-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-N-Npercent-shrink.htm rename to test/render/flex/flexbox_flex-0-N-Npercent-shrink.htm diff --git a/test/render/flex/flexbox_flex-0-N-Npercent-shrink.htm.png b/test/render/flex/flexbox_flex-0-N-Npercent-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0f46f7c743d7fe89fb189e66fe368da99fad6594 GIT binary patch literal 368 zcmeAS@N?(olHy`uVBq!ia0vp^mwBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-N-Npercent.htm b/test/render/flex/flexbox_flex-0-N-Npercent.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-N-Npercent.htm rename to test/render/flex/flexbox_flex-0-N-Npercent.htm diff --git a/test/render/flex/flexbox_flex-0-N-Npercent.htm.png b/test/render/flex/flexbox_flex-0-N-Npercent.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d1eb5dbb1a83b6a59126899cbaced5a57bb02657 GIT binary patch literal 558 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@rtL5V@L(#+pC6oO5P%Ef%y-mUi_(K7t1*yq|>lq?r+vN^_;G?wq{ecT?8)ThDg*xWBz!dw5N; zb+yXfFjs{F6La~ECJxBSa-GWP$mPS1PoPxkBXeE06D z{ifpb`L`~`eJ^|dZr_&Fzu}wG%k?L1KmT{{)+dE)E?2HOZFB8+t`5YzbSJk@sHwZ? tp%OgN$JI#mWC$+C)$J*nYv6IR!G5Ej!Jq36TOWZU-P6_2Wt~$(6965!_F(`3 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-0-0-unitless.htm b/test/render/flex/flexbox_flex-1-0-0-unitless.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-0-0-unitless.htm rename to test/render/flex/flexbox_flex-1-0-0-unitless.htm diff --git a/test/render/flex/flexbox_flex-1-0-0-unitless.htm.png b/test/render/flex/flexbox_flex-1-0-0-unitless.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-0-0.htm b/test/render/flex/flexbox_flex-1-0-0.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-0-0.htm rename to test/render/flex/flexbox_flex-1-0-0.htm diff --git a/test/render/flex/flexbox_flex-1-0-0.htm.png b/test/render/flex/flexbox_flex-1-0-0.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8cf2cda98be4898de979f3132986fb94c29e5e2f GIT binary patch literal 556 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@sg*DV@L(#+pC6oj{*daKa5EfdSkcKkwx60i8-L6TIyYWORbsC znk~2Y?q?0!H(z4s;vXj8_IOTG0ijFA+Fwhj*ZdFipReLP(Z|(D^kj%iFm}dO=TFJf zIprK>bHZL+SG_ayNw@bqbH|gH4YtNdZR$#K`DAnJc znRX|fcX?&os+G3WU#|W8@J8H+jg8kTdG@^IKY8=RZ?lPW=ctOGz2J9kW!`xpXOGsl zl?Uq9Y3=m%_RIEkyZ>%?%GK3ge5bu{x@han{E_mnT>W>n|0gq*`lcsEyPxN$JSuyC z>tfuyvPWg|w>SP%mfU@J^OL7l`yWqg4E^J6bi;5%(|<3v4;~QT(wlrUjo6UgbmjVN faD+@!vE6uo`Hh?(Zl)hJK~e7M>gTe~DWM4fYXI`A literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-0-N-shrink.htm b/test/render/flex/flexbox_flex-1-0-N-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-0-N-shrink.htm rename to test/render/flex/flexbox_flex-1-0-N-shrink.htm diff --git a/test/render/flex/flexbox_flex-1-0-N-shrink.htm.png b/test/render/flex/flexbox_flex-1-0-N-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bda4a23ef5cda8d4a6f9ea01d09e15faaf77274f GIT binary patch literal 401 zcmeAS@N?(olHy`uVBq!ia0y~yU=#$h7qKt{$tjbcTmn*}0X`wF|Ns97G8q^^^#22= z*WP&6(9poSL~9dJhqzRW@BCiC%p&g4#GEp5-RZX9@(YvI zLstv!ZocKQ@yk4k)QM-+t(~1+TwJys-BOl!^4*5KY88(O3XV-IoRh>=->$s#GwPk$ zwCd_9)$0R`UY?q?Q2uTB1P|$ncMgZ0JEA}F*5b38=bXN+GwxaUEoM^8lDdw|-ivK7 z*POn`x_d!_!rjB4eQP}zJ+$zD=d(y9^HcgF$Iq9aJ)h~rC2c$Z{OU>P6eVRRwYw|* z^}V!ww!y?tlO9ak@>Bns?#$(7p10=y=uIhmp5s0Fo7!e;^XO^*CojEQqC4-~b8}DI z|KFgF6oR>yAmfw%q`QfCzxA5KbWGA*8w>JzNTU1^sf&}64JMxlg{!BlpUXO@geCx7 C+N?(a literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-0-N.htm b/test/render/flex/flexbox_flex-1-0-N.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-0-N.htm rename to test/render/flex/flexbox_flex-1-0-N.htm diff --git a/test/render/flex/flexbox_flex-1-0-N.htm.png b/test/render/flex/flexbox_flex-1-0-N.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-0-Npercent-shrink.htm b/test/render/flex/flexbox_flex-1-0-Npercent-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-0-Npercent-shrink.htm rename to test/render/flex/flexbox_flex-1-0-Npercent-shrink.htm diff --git a/test/render/flex/flexbox_flex-1-0-Npercent-shrink.htm.png b/test/render/flex/flexbox_flex-1-0-Npercent-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c37d2519b0e8ef420b74c6d9df71f9bd499c7985 GIT binary patch literal 441 zcmeAS@N?(olHy`uVBq!ia0y~yV4MhKFJfT^l10ppQX90fB!BXn@29sZD@KpMJ?*Ftu z*KUKEV_|mu{w@0_T`Z{ZdpWmfl4o$8dSU1DnV(J|9%Gg7mXkVC zRnLAY3KDrbscc$G@V}$yr`fbGNht5V@A2^6tKv-G>eU71bBiPYPMq>)T_(5vxA3(~ zRf_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-0-auto.htm b/test/render/flex/flexbox_flex-1-0-auto.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-0-auto.htm rename to test/render/flex/flexbox_flex-1-0-auto.htm diff --git a/test/render/flex/flexbox_flex-1-0-auto.htm.png b/test/render/flex/flexbox_flex-1-0-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-0.htm b/test/render/flex/flexbox_flex-1-0.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-0.htm rename to test/render/flex/flexbox_flex-1-0.htm diff --git a/test/render/flex/flexbox_flex-1-0.htm.png b/test/render/flex/flexbox_flex-1-0.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-1-0-unitless.htm b/test/render/flex/flexbox_flex-1-1-0-unitless.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-1-0-unitless.htm rename to test/render/flex/flexbox_flex-1-1-0-unitless.htm diff --git a/test/render/flex/flexbox_flex-1-1-0-unitless.htm.png b/test/render/flex/flexbox_flex-1-1-0-unitless.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-1-0.htm b/test/render/flex/flexbox_flex-1-1-0.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-1-0.htm rename to test/render/flex/flexbox_flex-1-1-0.htm diff --git a/test/render/flex/flexbox_flex-1-1-0.htm.png b/test/render/flex/flexbox_flex-1-1-0.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8cf2cda98be4898de979f3132986fb94c29e5e2f GIT binary patch literal 556 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@sg*DV@L(#+pC6oj{*daKa5EfdSkcKkwx60i8-L6TIyYWORbsC znk~2Y?q?0!H(z4s;vXj8_IOTG0ijFA+Fwhj*ZdFipReLP(Z|(D^kj%iFm}dO=TFJf zIprK>bHZL+SG_ayNw@bqbH|gH4YtNdZR$#K`DAnJc znRX|fcX?&os+G3WU#|W8@J8H+jg8kTdG@^IKY8=RZ?lPW=ctOGz2J9kW!`xpXOGsl zl?Uq9Y3=m%_RIEkyZ>%?%GK3ge5bu{x@han{E_mnT>W>n|0gq*`lcsEyPxN$JSuyC z>tfuyvPWg|w>SP%mfU@J^OL7l`yWqg4E^J6bi;5%(|<3v4;~QT(wlrUjo6UgbmjVN faD+@!vE6uo`Hh?(Zl)hJK~e7M>gTe~DWM4fYXI`A literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-1-N-shrink.htm b/test/render/flex/flexbox_flex-1-1-N-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-1-N-shrink.htm rename to test/render/flex/flexbox_flex-1-1-N-shrink.htm diff --git a/test/render/flex/flexbox_flex-1-1-N-shrink.htm.png b/test/render/flex/flexbox_flex-1-1-N-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0f46f7c743d7fe89fb189e66fe368da99fad6594 GIT binary patch literal 368 zcmeAS@N?(olHy`uVBq!ia0vp^mwBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-1-N.htm b/test/render/flex/flexbox_flex-1-1-N.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-1-N.htm rename to test/render/flex/flexbox_flex-1-1-N.htm diff --git a/test/render/flex/flexbox_flex-1-1-N.htm.png b/test/render/flex/flexbox_flex-1-1-N.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-1-Npercent-shrink.htm b/test/render/flex/flexbox_flex-1-1-Npercent-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-1-Npercent-shrink.htm rename to test/render/flex/flexbox_flex-1-1-Npercent-shrink.htm diff --git a/test/render/flex/flexbox_flex-1-1-Npercent-shrink.htm.png b/test/render/flex/flexbox_flex-1-1-Npercent-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0f46f7c743d7fe89fb189e66fe368da99fad6594 GIT binary patch literal 368 zcmeAS@N?(olHy`uVBq!ia0vp^mwBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-1-Npercent.htm b/test/render/flex/flexbox_flex-1-1-Npercent.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-1-Npercent.htm rename to test/render/flex/flexbox_flex-1-1-Npercent.htm diff --git a/test/render/flex/flexbox_flex-1-1-Npercent.htm.png b/test/render/flex/flexbox_flex-1-1-Npercent.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-1-auto.htm b/test/render/flex/flexbox_flex-1-1-auto.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-1-auto.htm rename to test/render/flex/flexbox_flex-1-1-auto.htm diff --git a/test/render/flex/flexbox_flex-1-1-auto.htm.png b/test/render/flex/flexbox_flex-1-1-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-1.htm b/test/render/flex/flexbox_flex-1-1.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-1.htm rename to test/render/flex/flexbox_flex-1-1.htm diff --git a/test/render/flex/flexbox_flex-1-1.htm.png b/test/render/flex/flexbox_flex-1-1.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-N-0-unitless.htm b/test/render/flex/flexbox_flex-1-N-0-unitless.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-N-0-unitless.htm rename to test/render/flex/flexbox_flex-1-N-0-unitless.htm diff --git a/test/render/flex/flexbox_flex-1-N-0-unitless.htm.png b/test/render/flex/flexbox_flex-1-N-0-unitless.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-N-0.htm b/test/render/flex/flexbox_flex-1-N-0.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-N-0.htm rename to test/render/flex/flexbox_flex-1-N-0.htm diff --git a/test/render/flex/flexbox_flex-1-N-0.htm.png b/test/render/flex/flexbox_flex-1-N-0.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8cf2cda98be4898de979f3132986fb94c29e5e2f GIT binary patch literal 556 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@sg*DV@L(#+pC6oj{*daKa5EfdSkcKkwx60i8-L6TIyYWORbsC znk~2Y?q?0!H(z4s;vXj8_IOTG0ijFA+Fwhj*ZdFipReLP(Z|(D^kj%iFm}dO=TFJf zIprK>bHZL+SG_ayNw@bqbH|gH4YtNdZR$#K`DAnJc znRX|fcX?&os+G3WU#|W8@J8H+jg8kTdG@^IKY8=RZ?lPW=ctOGz2J9kW!`xpXOGsl zl?Uq9Y3=m%_RIEkyZ>%?%GK3ge5bu{x@han{E_mnT>W>n|0gq*`lcsEyPxN$JSuyC z>tfuyvPWg|w>SP%mfU@J^OL7l`yWqg4E^J6bi;5%(|<3v4;~QT(wlrUjo6UgbmjVN faD+@!vE6uo`Hh?(Zl)hJK~e7M>gTe~DWM4fYXI`A literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-N-N-shrink.htm b/test/render/flex/flexbox_flex-1-N-N-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-N-N-shrink.htm rename to test/render/flex/flexbox_flex-1-N-N-shrink.htm diff --git a/test/render/flex/flexbox_flex-1-N-N-shrink.htm.png b/test/render/flex/flexbox_flex-1-N-N-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0f46f7c743d7fe89fb189e66fe368da99fad6594 GIT binary patch literal 368 zcmeAS@N?(olHy`uVBq!ia0vp^mwBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-N-N.htm b/test/render/flex/flexbox_flex-1-N-N.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-N-N.htm rename to test/render/flex/flexbox_flex-1-N-N.htm diff --git a/test/render/flex/flexbox_flex-1-N-N.htm.png b/test/render/flex/flexbox_flex-1-N-N.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-N-Npercent-shrink.htm b/test/render/flex/flexbox_flex-1-N-Npercent-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-N-Npercent-shrink.htm rename to test/render/flex/flexbox_flex-1-N-Npercent-shrink.htm diff --git a/test/render/flex/flexbox_flex-1-N-Npercent-shrink.htm.png b/test/render/flex/flexbox_flex-1-N-Npercent-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0f46f7c743d7fe89fb189e66fe368da99fad6594 GIT binary patch literal 368 zcmeAS@N?(olHy`uVBq!ia0vp^mwBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-N-Npercent.htm b/test/render/flex/flexbox_flex-1-N-Npercent.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-N-Npercent.htm rename to test/render/flex/flexbox_flex-1-N-Npercent.htm diff --git a/test/render/flex/flexbox_flex-1-N-Npercent.htm.png b/test/render/flex/flexbox_flex-1-N-Npercent.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-N-auto.htm b/test/render/flex/flexbox_flex-1-N-auto.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-N-auto.htm rename to test/render/flex/flexbox_flex-1-N-auto.htm diff --git a/test/render/flex/flexbox_flex-1-N-auto.htm.png b/test/render/flex/flexbox_flex-1-N-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-N.htm b/test/render/flex/flexbox_flex-1-N.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-N.htm rename to test/render/flex/flexbox_flex-1-N.htm diff --git a/test/render/flex/flexbox_flex-1-N.htm.png b/test/render/flex/flexbox_flex-1-N.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-0-0-unitless.htm b/test/render/flex/flexbox_flex-N-0-0-unitless.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-0-0-unitless.htm rename to test/render/flex/flexbox_flex-N-0-0-unitless.htm diff --git a/test/render/flex/flexbox_flex-N-0-0-unitless.htm.png b/test/render/flex/flexbox_flex-N-0-0-unitless.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8cf2cda98be4898de979f3132986fb94c29e5e2f GIT binary patch literal 556 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@sg*DV@L(#+pC6oj{*daKa5EfdSkcKkwx60i8-L6TIyYWORbsC znk~2Y?q?0!H(z4s;vXj8_IOTG0ijFA+Fwhj*ZdFipReLP(Z|(D^kj%iFm}dO=TFJf zIprK>bHZL+SG_ayNw@bqbH|gH4YtNdZR$#K`DAnJc znRX|fcX?&os+G3WU#|W8@J8H+jg8kTdG@^IKY8=RZ?lPW=ctOGz2J9kW!`xpXOGsl zl?Uq9Y3=m%_RIEkyZ>%?%GK3ge5bu{x@han{E_mnT>W>n|0gq*`lcsEyPxN$JSuyC z>tfuyvPWg|w>SP%mfU@J^OL7l`yWqg4E^J6bi;5%(|<3v4;~QT(wlrUjo6UgbmjVN faD+@!vE6uo`Hh?(Zl)hJK~e7M>gTe~DWM4fYXI`A literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-0-0.htm b/test/render/flex/flexbox_flex-N-0-0.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-0-0.htm rename to test/render/flex/flexbox_flex-N-0-0.htm diff --git a/test/render/flex/flexbox_flex-N-0-0.htm.png b/test/render/flex/flexbox_flex-N-0-0.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8cf2cda98be4898de979f3132986fb94c29e5e2f GIT binary patch literal 556 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@sg*DV@L(#+pC6oj{*daKa5EfdSkcKkwx60i8-L6TIyYWORbsC znk~2Y?q?0!H(z4s;vXj8_IOTG0ijFA+Fwhj*ZdFipReLP(Z|(D^kj%iFm}dO=TFJf zIprK>bHZL+SG_ayNw@bqbH|gH4YtNdZR$#K`DAnJc znRX|fcX?&os+G3WU#|W8@J8H+jg8kTdG@^IKY8=RZ?lPW=ctOGz2J9kW!`xpXOGsl zl?Uq9Y3=m%_RIEkyZ>%?%GK3ge5bu{x@han{E_mnT>W>n|0gq*`lcsEyPxN$JSuyC z>tfuyvPWg|w>SP%mfU@J^OL7l`yWqg4E^J6bi;5%(|<3v4;~QT(wlrUjo6UgbmjVN faD+@!vE6uo`Hh?(Zl)hJK~e7M>gTe~DWM4fYXI`A literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-0-N-shrink.htm b/test/render/flex/flexbox_flex-N-0-N-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-0-N-shrink.htm rename to test/render/flex/flexbox_flex-N-0-N-shrink.htm diff --git a/test/render/flex/flexbox_flex-N-0-N-shrink.htm.png b/test/render/flex/flexbox_flex-N-0-N-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..bda4a23ef5cda8d4a6f9ea01d09e15faaf77274f GIT binary patch literal 401 zcmeAS@N?(olHy`uVBq!ia0y~yU=#$h7qKt{$tjbcTmn*}0X`wF|Ns97G8q^^^#22= z*WP&6(9poSL~9dJhqzRW@BCiC%p&g4#GEp5-RZX9@(YvI zLstv!ZocKQ@yk4k)QM-+t(~1+TwJys-BOl!^4*5KY88(O3XV-IoRh>=->$s#GwPk$ zwCd_9)$0R`UY?q?Q2uTB1P|$ncMgZ0JEA}F*5b38=bXN+GwxaUEoM^8lDdw|-ivK7 z*POn`x_d!_!rjB4eQP}zJ+$zD=d(y9^HcgF$Iq9aJ)h~rC2c$Z{OU>P6eVRRwYw|* z^}V!ww!y?tlO9ak@>Bns?#$(7p10=y=uIhmp5s0Fo7!e;^XO^*CojEQqC4-~b8}DI z|KFgF6oR>yAmfw%q`QfCzxA5KbWGA*8w>JzNTU1^sf&}64JMxlg{!BlpUXO@geCx7 C+N?(a literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-0-N.htm b/test/render/flex/flexbox_flex-N-0-N.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-0-N.htm rename to test/render/flex/flexbox_flex-N-0-N.htm diff --git a/test/render/flex/flexbox_flex-N-0-N.htm.png b/test/render/flex/flexbox_flex-N-0-N.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-0-Npercent-shrink.htm b/test/render/flex/flexbox_flex-N-0-Npercent-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-0-Npercent-shrink.htm rename to test/render/flex/flexbox_flex-N-0-Npercent-shrink.htm diff --git a/test/render/flex/flexbox_flex-N-0-Npercent-shrink.htm.png b/test/render/flex/flexbox_flex-N-0-Npercent-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c37d2519b0e8ef420b74c6d9df71f9bd499c7985 GIT binary patch literal 441 zcmeAS@N?(olHy`uVBq!ia0y~yV4MhKFJfT^l10ppQX90fB!BXn@29sZD@KpMJ?*Ftu z*KUKEV_|mu{w@0_T`Z{ZdpWmfl4o$8dSU1DnV(J|9%Gg7mXkVC zRnLAY3KDrbscc$G@V}$yr`fbGNht5V@A2^6tKv-G>eU71bBiPYPMq>)T_(5vxA3(~ zRf_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-0-auto.htm b/test/render/flex/flexbox_flex-N-0-auto.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-0-auto.htm rename to test/render/flex/flexbox_flex-N-0-auto.htm diff --git a/test/render/flex/flexbox_flex-N-0-auto.htm.png b/test/render/flex/flexbox_flex-N-0-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-0.htm b/test/render/flex/flexbox_flex-N-0.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-0.htm rename to test/render/flex/flexbox_flex-N-0.htm diff --git a/test/render/flex/flexbox_flex-N-0.htm.png b/test/render/flex/flexbox_flex-N-0.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-1-0-unitless.htm b/test/render/flex/flexbox_flex-N-1-0-unitless.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-1-0-unitless.htm rename to test/render/flex/flexbox_flex-N-1-0-unitless.htm diff --git a/test/render/flex/flexbox_flex-N-1-0-unitless.htm.png b/test/render/flex/flexbox_flex-N-1-0-unitless.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-1-0.htm b/test/render/flex/flexbox_flex-N-1-0.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-1-0.htm rename to test/render/flex/flexbox_flex-N-1-0.htm diff --git a/test/render/flex/flexbox_flex-N-1-0.htm.png b/test/render/flex/flexbox_flex-N-1-0.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8cf2cda98be4898de979f3132986fb94c29e5e2f GIT binary patch literal 556 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@sg*DV@L(#+pC6oj{*daKa5EfdSkcKkwx60i8-L6TIyYWORbsC znk~2Y?q?0!H(z4s;vXj8_IOTG0ijFA+Fwhj*ZdFipReLP(Z|(D^kj%iFm}dO=TFJf zIprK>bHZL+SG_ayNw@bqbH|gH4YtNdZR$#K`DAnJc znRX|fcX?&os+G3WU#|W8@J8H+jg8kTdG@^IKY8=RZ?lPW=ctOGz2J9kW!`xpXOGsl zl?Uq9Y3=m%_RIEkyZ>%?%GK3ge5bu{x@han{E_mnT>W>n|0gq*`lcsEyPxN$JSuyC z>tfuyvPWg|w>SP%mfU@J^OL7l`yWqg4E^J6bi;5%(|<3v4;~QT(wlrUjo6UgbmjVN faD+@!vE6uo`Hh?(Zl)hJK~e7M>gTe~DWM4fYXI`A literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-1-N-shrink.htm b/test/render/flex/flexbox_flex-N-1-N-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-1-N-shrink.htm rename to test/render/flex/flexbox_flex-N-1-N-shrink.htm diff --git a/test/render/flex/flexbox_flex-N-1-N-shrink.htm.png b/test/render/flex/flexbox_flex-N-1-N-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0f46f7c743d7fe89fb189e66fe368da99fad6594 GIT binary patch literal 368 zcmeAS@N?(olHy`uVBq!ia0vp^mwBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-1-N.htm b/test/render/flex/flexbox_flex-N-1-N.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-1-N.htm rename to test/render/flex/flexbox_flex-N-1-N.htm diff --git a/test/render/flex/flexbox_flex-N-1-N.htm.png b/test/render/flex/flexbox_flex-N-1-N.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-1-Npercent-shrink.htm b/test/render/flex/flexbox_flex-N-1-Npercent-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-1-Npercent-shrink.htm rename to test/render/flex/flexbox_flex-N-1-Npercent-shrink.htm diff --git a/test/render/flex/flexbox_flex-N-1-Npercent-shrink.htm.png b/test/render/flex/flexbox_flex-N-1-Npercent-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0f46f7c743d7fe89fb189e66fe368da99fad6594 GIT binary patch literal 368 zcmeAS@N?(olHy`uVBq!ia0vp^mwBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-1-Npercent.htm b/test/render/flex/flexbox_flex-N-1-Npercent.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-1-Npercent.htm rename to test/render/flex/flexbox_flex-N-1-Npercent.htm diff --git a/test/render/flex/flexbox_flex-N-1-Npercent.htm.png b/test/render/flex/flexbox_flex-N-1-Npercent.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-1-auto.htm b/test/render/flex/flexbox_flex-N-1-auto.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-1-auto.htm rename to test/render/flex/flexbox_flex-N-1-auto.htm diff --git a/test/render/flex/flexbox_flex-N-1-auto.htm.png b/test/render/flex/flexbox_flex-N-1-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-1.htm b/test/render/flex/flexbox_flex-N-1.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-1.htm rename to test/render/flex/flexbox_flex-N-1.htm diff --git a/test/render/flex/flexbox_flex-N-1.htm.png b/test/render/flex/flexbox_flex-N-1.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-N-0-unitless.htm b/test/render/flex/flexbox_flex-N-N-0-unitless.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-N-0-unitless.htm rename to test/render/flex/flexbox_flex-N-N-0-unitless.htm diff --git a/test/render/flex/flexbox_flex-N-N-0-unitless.htm.png b/test/render/flex/flexbox_flex-N-N-0-unitless.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-N-0.htm b/test/render/flex/flexbox_flex-N-N-0.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-N-0.htm rename to test/render/flex/flexbox_flex-N-N-0.htm diff --git a/test/render/flex/flexbox_flex-N-N-0.htm.png b/test/render/flex/flexbox_flex-N-N-0.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8cf2cda98be4898de979f3132986fb94c29e5e2f GIT binary patch literal 556 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@sg*DV@L(#+pC6oj{*daKa5EfdSkcKkwx60i8-L6TIyYWORbsC znk~2Y?q?0!H(z4s;vXj8_IOTG0ijFA+Fwhj*ZdFipReLP(Z|(D^kj%iFm}dO=TFJf zIprK>bHZL+SG_ayNw@bqbH|gH4YtNdZR$#K`DAnJc znRX|fcX?&os+G3WU#|W8@J8H+jg8kTdG@^IKY8=RZ?lPW=ctOGz2J9kW!`xpXOGsl zl?Uq9Y3=m%_RIEkyZ>%?%GK3ge5bu{x@han{E_mnT>W>n|0gq*`lcsEyPxN$JSuyC z>tfuyvPWg|w>SP%mfU@J^OL7l`yWqg4E^J6bi;5%(|<3v4;~QT(wlrUjo6UgbmjVN faD+@!vE6uo`Hh?(Zl)hJK~e7M>gTe~DWM4fYXI`A literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-N-N-shrink.htm b/test/render/flex/flexbox_flex-N-N-N-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-N-N-shrink.htm rename to test/render/flex/flexbox_flex-N-N-N-shrink.htm diff --git a/test/render/flex/flexbox_flex-N-N-N-shrink.htm.png b/test/render/flex/flexbox_flex-N-N-N-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0f46f7c743d7fe89fb189e66fe368da99fad6594 GIT binary patch literal 368 zcmeAS@N?(olHy`uVBq!ia0vp^mwBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-N-N.htm b/test/render/flex/flexbox_flex-N-N-N.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-N-N.htm rename to test/render/flex/flexbox_flex-N-N-N.htm diff --git a/test/render/flex/flexbox_flex-N-N-N.htm.png b/test/render/flex/flexbox_flex-N-N-N.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-N-Npercent-shrink.htm b/test/render/flex/flexbox_flex-N-N-Npercent-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-N-Npercent-shrink.htm rename to test/render/flex/flexbox_flex-N-N-Npercent-shrink.htm diff --git a/test/render/flex/flexbox_flex-N-N-Npercent-shrink.htm.png b/test/render/flex/flexbox_flex-N-N-Npercent-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0f46f7c743d7fe89fb189e66fe368da99fad6594 GIT binary patch literal 368 zcmeAS@N?(olHy`uVBq!ia0vp^mwBHnnd9kP;2>332`Z|38q)zyPBEA2_}C z#GZR4BSo7qd)vI;JH z`%NqAClCvbayTZS#SPm zsfk}^&<)%F_EB%{-JGWP=5EsWylpxDnfs~}Ps{)QKKskhcxABT@DWS0%1_*u;{<`1 iyq-H(cXV`cy_L?JZ+-Nf?1uNCVDohKb6Mw<&;$VOY@PK0 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-N-Npercent.htm b/test/render/flex/flexbox_flex-N-N-Npercent.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-N-Npercent.htm rename to test/render/flex/flexbox_flex-N-N-Npercent.htm diff --git a/test/render/flex/flexbox_flex-N-N-Npercent.htm.png b/test/render/flex/flexbox_flex-N-N-Npercent.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-N-auto.htm b/test/render/flex/flexbox_flex-N-N-auto.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-N-auto.htm rename to test/render/flex/flexbox_flex-N-N-auto.htm diff --git a/test/render/flex/flexbox_flex-N-N-auto.htm.png b/test/render/flex/flexbox_flex-N-N-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-N.htm b/test/render/flex/flexbox_flex-N-N.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-N.htm rename to test/render/flex/flexbox_flex-N-N.htm diff --git a/test/render/flex/flexbox_flex-N-N.htm.png b/test/render/flex/flexbox_flex-N-N.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..8c69849c4144d4664886a54720b44ec0d4d48d3e GIT binary patch literal 554 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wTXd&@q(v|V@L(#+pC6oj{*daKa5EfdSkcKQADqSg?)j6E$?^xLw3?) z+itx3s~hm;?~xO-N0)DW?mJ1v6NKhPu3W$S$?xe^zf>f_Yn~L&xTUWV>1w1@DfjltYVWYxn(aSlst5dD?|XPnZMB+8 zdFbK7c?+|$&Zk;s{WskvUX!z+RPOivFYQlqe$>vs;&*ORcUqqM>xk{?v+vE_qqS}2 zzrQijMVp(RY-vjQ^md{Ez;=}F$5^gjO8%gHGk pcth1=S(V4MUsaPKE?c7hjs3+7U5kL+)K8!Y_jL7hS?83{1ORFl_*eh{ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-auto.htm b/test/render/flex/flexbox_flex-auto.htm similarity index 100% rename from test/render/flex/--flexbox_flex-auto.htm rename to test/render/flex/flexbox_flex-auto.htm diff --git a/test/render/flex/flexbox_flex-auto.htm.png b/test/render/flex/flexbox_flex-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a15159b5bd733ebe9dcf69cc2d600ce29435760f GIT binary patch literal 532 zcmeAS@N?(olHy`uVBq!ia0y~yU=m_rU^HQ328yuw8O;JxoB=)|uK)l42QnEL{s#xU zT>z>$=IP=XQo;E4ilN_O1CfSA{e6wKoPHBq_cjBmi+pz_9|+BvB%-*`A*w&|0X`wF|Ns97G8q^^^#22= z*WP&6(9poSL~9dJN0z6HV@L(#+bf27j~qlA9>zRmePg%NF(qC>NT%V?7n3{xIjqgz zuey&Wyl0n7?l=LN|GTf8zYy6+Alf@odW!L}ohP+$1QD<#x ze(1Y(#gSqARZVwi-#pa+_o|lUEh+!pxy!e$`@YSCQXsdtK5sYwq!Q#%@c6XV-7{w| cIIz5~=yRtnwp9NnT?dK^Pgg&ebxsLQ05fXF6951J literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-basis.htm b/test/render/flex/flexbox_flex-basis.htm similarity index 100% rename from test/render/flex/--flexbox_flex-basis.htm rename to test/render/flex/flexbox_flex-basis.htm diff --git a/test/render/flex/flexbox_flex-basis.htm.png b/test/render/flex/flexbox_flex-basis.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..40e9e1b5f86c2cbffa6bd2bd85a1f333d615ec44 GIT binary patch literal 495 zcmeAS@N?(olHy`uVBq!ia0y~yU=jqf7qKvdL<*ZO11Zq}pAgso|NjG-3=AOp|AEtM zZ#-*gXy9C;wTXd&ajK__V@L(#+p8OU4><@p1V%|5IJc0Qg;&9mkwwi;=$HP(Yi*a0 z-itiRu~*-%kKe^IM~TF{pS2Cku_vds8UcUD$_X;mQvLvux{gK%F^qD)$A1w_~ zdv?G7n$T@FA!p{!bnecMRMlNCmx)hYG5y7CkDOQgXPi~J=bRMTnOWX*zvI;1LM`v) zThdc^KaQGqbiT{kcQdxV$gWRO?c3=$J?6UN^}jQ_Ax;PR1ndWDGitUSshXd?{ns=| pXd&6*EqZgBT>~gwJujJm;ch=UPo@6rmkv;@dAjB!#s|Casn>S6nR z{mfqB#V!{!>eU}ftv618HMc_R$&oL=FM1_yUvy-H!=sHZN{{xc>?(R3tn$qJOSj6l z&--Vr_TJNW8!E2dgpDb4x${lCYR z(&{U&O)Q*3DjpLQ90!oGXR}L9m9*!iC2X~fs~^}k_uOgt0*oC7Pgg&ebxsLQ07L$| AnE(I) literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-natural.htm b/test/render/flex/flexbox_flex-natural.htm similarity index 100% rename from test/render/flex/--flexbox_flex-natural.htm rename to test/render/flex/flexbox_flex-natural.htm diff --git a/test/render/flex/flexbox_flex-natural.htm.png b/test/render/flex/flexbox_flex-natural.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..5c99cad5fc4808ad56a615f5ed5665e782acddde GIT binary patch literal 1095 zcmeAS@N?(olHy`uVBq!ia0y~yU^Zf4U^HQ228yuWmDU1Mq5(c3uK)l42QnELK=l6u zr`O(i*3i(vxkPIdP{&(O7srqa#y3|t=1MyXv;}T8Q0m`#rBT6Dp+T$Rpk?}^f8HPN z%~asM@lvPm@cYBOX3EX&H)|)UctX&nKVFe{Q|HA`y}~{7!ignrYNkdjCwlh!WTgZt zPnMc_1y!i}gv`C!zb(waZ}oe1{Cmr~loK^IaWj=;kOfWRv#F0ZS(i>t~rXAw`lD@Y4ZK* z7Nz=ACW#Xio!fXMjZ#hw9>z2K>6LY%LHa39Sb`i?=&fS#saMdbo3!NO`ERdoZ0l9v zIJ_cSV&d_bR}K@T1RO*UJeXq~_+Pc+z0U-;Hzn8hKm7iXZT7^2hu?Vp;-0!`*J+!* z8Y|O{7UGU(sGZ*?Sne_XUYGZ-cp5djPN@8EVRkxZT4{}O%BmACr(*oe+RjW^ zX|<=X^7gXDA0HoY41Qj??L1+;)=kemq%i0ryX{Q9-sdlimdrcZLLjp#Prl{6Y|2%0SahrSzGwe&r!8x#Ti#Jn OY2fMV=d#Wzp$P!Q!Rjgi literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox_justifycontent-spacebetween-only.htm.png b/test/render/flex/flexbox_justifycontent-spacebetween-only.htm.png index 636907279614e194eca6303d6dfb8d81219b20ec..9b8fa533aad90b8d2c0bde29e1f812dd09dc2b8e 100644 GIT binary patch delta 90 zcmV-g0Hy!w0qFsdTmlqnkzODn<8E~NG<~nNdZqMNU%v0U`Z}V2kF74N@3r*Y=C6Eh w=#icxDF5|DbUK|*r_<-@Bh=O;Nzw`X0M!;-^OvT|bpQYW07*qoM6N<$f_DWj0{{R3 delta 90 zcmV-g0Hy!w0qFsdTmnd`kzODmV>dc|s=n7+y;AzCFW+}veI3!i$5xls_gZ>x^H;t$ wk)I+d>Hm5nI-O3Z)9Lf{5o&9aB#p#T5?07*qoM6N<$g2remo&W#< diff --git a/test/render/flex/--multi-line-wrap-reverse-column-reverse.htm b/test/render/flex/multi-line-wrap-reverse-column-reverse.htm similarity index 100% rename from test/render/flex/--multi-line-wrap-reverse-column-reverse.htm rename to test/render/flex/multi-line-wrap-reverse-column-reverse.htm diff --git a/test/render/flex/multi-line-wrap-reverse-column-reverse.htm.png b/test/render/flex/multi-line-wrap-reverse-column-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ca592ddb2297a4ee47eff4a0579994661e30a686 GIT binary patch literal 1446 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYVANq@28x_yKE(;7Bm#UwT>t<7f9A}Y|4SME z|7QT<28RDY$nd|aOyv#(1FNT}i(^OyKwF1IODE8c zM-+TmS`?Mo5|tEq1PwWa8527?9A|KFIJ@v1a&eGQN)k|GIwT<2Y#=!FwXiW69nlrw zI3cjzK|#U!4pUf9(7(>6pWm zD3TI3;V*BXK-0$>>Gv<&1bUtyuCS5YuUDnO`g2=%w!DYqKBIMeft+JIel&_a(SBTN zf9~gxy(}QTEfJ1BEQdHYHqGE@5lmt=6y#7o!j+^X;MO5}#6_V;K)a*UK|(Q1K)BJs zX^ny!aT?lgur@l7M1ZX*G+ aXPB=cCi8B>xdLFp%i!ti=d#Wzp$P!{HUirK literal 0 HcmV?d00001 diff --git a/test/render/flex/--percentage-heights-006.htm b/test/render/flex/percentage-heights-006.htm similarity index 100% rename from test/render/flex/--percentage-heights-006.htm rename to test/render/flex/percentage-heights-006.htm diff --git a/test/render/flex/percentage-heights-006.htm.png b/test/render/flex/percentage-heights-006.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p Date: Thu, 28 Dec 2023 19:27:42 +0100 Subject: [PATCH 52/73] Added tests for css counters --- test/render/counter.htm | 79 ++++++++++++++++++++++++++++++++++++ test/render/counter.htm.png | Bin 0 -> 3300 bytes 2 files changed, 79 insertions(+) create mode 100644 test/render/counter.htm create mode 100644 test/render/counter.htm.png diff --git a/test/render/counter.htm b/test/render/counter.htm new file mode 100644 index 000000000..bd24d157c --- /dev/null +++ b/test/render/counter.htm @@ -0,0 +1,79 @@ + + + + + css counters + + + + +

HTML/CSS Tutorials

+

HTML

+

CSS

+

Bootstrap

+

W3.CSS

+ +

Scripting Tutorials

+

JavaScript

+

jQuery

+

React

+ +

Programming Tutorials

+

Python

+

Java

+

C++

+
    +
  1. item
    2. +
  2. item +
      +
    1. item
      2. +
    2. item
      3. +
    3. item +
        +
      1. item
        2. +
      2. item
        3. +
      3. item
        4. +
      +
      4. +
    4. item
      5. +
    +
    3. +
  3. item
    4. +
  4. item
    5. +
+ +
    +
  1. item
    2. +
  2. item
    3. +
+ + + diff --git a/test/render/counter.htm.png b/test/render/counter.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ae151ac44d77d872bbf905a6354b3f92d675f59a GIT binary patch literal 3300 zcmZ{nc|6ox8^FgBL(&W*OTx_9!X-q=`kTG3CKPvEOQa+jOSZ|HJ7XPYK_W)sDlJ5= ztdUE`zIK)Dh9qL7*OGYke%__`{e0d(&hvSmb3UK*obx>A`#hhMboLDHfVhG<2n0Gn zz@zO!AR(2#;U=&*0cu7%1%p5mj|ga+bKwGuugl4!_yN#lOw-+GYCC;R9vW|X&E4du zaq^3Wi_$Ka1>)~C3kRzx3TYftsdl4@io~a1ifq5PPteg!Fx@BicCD6iNk5m}T~2Co zE_M9vPqOh>>9^;*cmI@6MkH$%B>qz_6x;uzdq(Q9{Zx?!$7TWK?0w1w< z9+VxEyy!$Wk4wNuDBpupCUy^iaYO}w9pz<2*>1kN`zNTlhyq2)?;7;EF?#k2wJ-r{ zmQ%;wEXzmGDBX!Zeu*6{JeHrCS-(Qc&RS==vOgy(y&ZUCsARV~k7Od|XqUVin{s8I zd>ghBvTwndt56!|plf=(w#P|^$4xD%0S2pHJtog^6=gP0Bf(R{Mk>E}t}6&NN2Tr1 z7B#6Sm^f(8E$oHiMw~d1e6ir8FOyzcd$C~uhpIN#9Z~3uim6`k&%uZ@zz>;PbMXc7J{-i)^d zNMzspPhK?(xQvu=w0D1lK`;zOhCC8}lpdev$(2EXnrZh71(+sz6v2@fEA$u7XotSDQkW=``EHg;Ov%a8-fX<(1lB?}MyzNTxA z`mZY}%kmR@Jg=6pg3k-q*gTe^qG2_F@T68!cpwSk>E{8&aTjiKz7jb)4}bkJrc=7(f)1wGgbMK?E)A`zk8!i3Tbe>648Y zg)c}_*Gu8VaNFYEbcDb-&0XGm7*kO^FU8#;b`JTUX8GgP^?rEYU9@mBLG@*cPxOdO zUd+R0y81QOp87pZ$BNVdqtKwK{)oGU;8lV0--q`dL3mP)_!e<&yrF1NHy-7EUOV9& zUCvB;zXt$XdH#uT3@SbqyDeU?4hGhDwScBmkp2b za^<^5ZUM5K|H{W6adg0?tMS)se)D2W0lXLAGLKLH)z?^#Q=yrnfs=|FsESp{-ikRI z@HO#e*zB>jXXPr&cewIaI+Wy{XP}Xgmq}3BI+N5Bw-^yEt?&C^6^~^e53QVk((P;Z zaVw?z54a!>K|3lz#Ng6Ol#X`!Vr#Waj*?k@?zjJn2P@LNU<6Wo=bcQ`wxNhm@5c=} zRdwtv(h;WL1VfFXoC*tc``m4gS$|kNJ2@U=wG^OM30VC#q|m6|(+3L|B?Vc185lID zd$l2dQ9{%e)t#MN!yiPBE+cNZ;#5Ku#xPrbkF6LmDva-hj8cyjXrB+M;rGiFzaxei zinois8glHF!-^yE36ma7Ypz07-0($N zm9^`)<9`+Llj^@rI{RwneiC&2YS5_8;HOh=34SzBE%9%d6Vb|V=Mn@|uK+QVMOls_qRNB;-#85s-2;nV@A9)g>^C%u6CfzWij2%1 zC~4;rf#qV9d2CsIFZgCVD{qOV#s37m4lQbxq`Y{*(F?%n5e4}IrhH}h8}$$%NAhOo zZn##0%R%m|PPk0-PlB>;A~z*BKmWe|r0k3Wq&+=Y3=>CwzEVevXeH#2d>P{2-&d># z%LZlF{{Xmw?6i(kBw3ZEHI=N9sw&td;}k8@(i>Z;eQ>$!oi_r8kqypdcFv`CeTK02 zwEg)6_{mNql^WOpVmLMy1`KY+*1IOcGpM$^s+#dGNGFdX;DKBX6Ad)a5J;{!uK0T~ zgT+3u!#vin3)j&kq)ug0U4PMCWD*J87Y(A9Ws&7{!Cfc%J@P9<^H zF}0?|lQaeUoIHfz1LN7#nPS?=*bCOWhs}LjIKn>dK2uIgdi8P@&#Lc1EY;9tTW2%% z+mvNaJDigi>tB^}YK0K)dH0Jo1YLTPXMdk5C#>xzC@fp1P{Qe{;|K;vOL1c{55!kSK}NP&Z5Z z%CeGA8-fzGXPKNylbH43=~jKC?ij=+fIC!lLj%7zuXQd3{jHyJ?yR1>ZAt6koKfC) z{0;^BqIA-%#U120@oASC^=S{RrZ1j~p`P`%7XO?B9UOtAxT6h{??2|zdOLKBf#BEP zqePreZ;aJ$p89=9>#E>cy8HR|bvlr2QnrbGk>}(&_|2bEqpn#tyyo>jCU;lgd?rfOh?L;PPRhm-wecCDAhT z7sL7_ab=;Q6U7Tdlvb zn0x+G`_q-N#24}o%5vPM?=hpsw(PSbQo&FJIuQa_PHVaL_VO{Q)y$i@*Re>S%`n%- zX<1nI!X2vB${i+CAcdMtzt954S2}RW(3A@dW-r$B=>HD{1P*-Pn%DYSHZpzNdF*}3 Q()aHR0dodj3S5Z$I}rZymH+?% literal 0 HcmV?d00001 From c6954248d6e09ca0f479247d9554fca9a9d03b39 Mon Sep 17 00:00:00 2001 From: MichelCalonder Date: Thu, 28 Dec 2023 19:40:26 +0100 Subject: [PATCH 53/73] reverted whitespace-only changes --- include/litehtml/element.h | 4 ++-- include/litehtml/html_tag.h | 6 ++---- src/element.cpp | 1 - 3 files changed, 4 insertions(+), 7 deletions(-) diff --git a/include/litehtml/element.h b/include/litehtml/element.h index d2bc372e9..c09fa2b3c 100644 --- a/include/litehtml/element.h +++ b/include/litehtml/element.h @@ -33,8 +33,8 @@ namespace litehtml std::list> m_renders; used_selector::vector m_used_styles; - virtual void select_all(const css_selector& selector, elements_list& res); - element::ptr _add_before_after(int type, const style& style); + virtual void select_all(const css_selector& selector, elements_list& res); + element::ptr _add_before_after(int type, const style& style); private: std::map m_counter_values; diff --git a/include/litehtml/html_tag.h b/include/litehtml/html_tag.h index bae21ddc5..9578d383f 100644 --- a/include/litehtml/html_tag.h +++ b/include/litehtml/html_tag.h @@ -10,7 +10,6 @@ #include "stylesheet.h" #include "line_box.h" #include "table.h" -#include "types.h" namespace litehtml { @@ -23,7 +22,6 @@ namespace litehtml friend class line_box; public: typedef std::shared_ptr ptr; - protected: string_id m_tag; string_id m_id; @@ -33,7 +31,7 @@ namespace litehtml string_map m_attrs; std::vector m_pseudo_classes; - void select_all(const css_selector& selector, elements_list& res) override; + void select_all(const css_selector& selector, elements_list& res) override; public: explicit html_tag(const std::shared_ptr& doc); @@ -84,7 +82,7 @@ namespace litehtml size_vector get_size_vector_property (string_id name, bool inherited, const size_vector& default_value, uint_ptr css_properties_member_offset) const override; string get_custom_property(string_id name, const string& default_value) const override; - elements_list& children(); + elements_list& children(); int select(const string& selector) override; int select(const css_selector& selector, bool apply_pseudo = true) override; diff --git a/src/element.cpp b/src/element.cpp index f0184592d..5fa68cac6 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -334,7 +334,6 @@ string litehtml::element::get_counters_value(const string_vector& parameters) bool litehtml::element::find_counter(const string_id& counter_name_id, std::map::iterator& map_iterator) { element::ptr current = shared_from_this(); - // search upwards while (current != nullptr) { map_iterator = current->m_counter_values.find(counter_name_id); From 23a8523cdf4f478deae78b89af9e87a2736a4010 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Fri, 29 Dec 2023 00:27:30 +0300 Subject: [PATCH 54/73] Scale borders radius to prevent corner overlap Ref: https://www.w3.org/TR/css-backgrounds-3/#corner-overlap Also changes in cairo_linux container to support corners with different radius. --- containers/linux/container_linux.cpp | 270 ++++++++++++++------------- include/litehtml/borders.h | 30 +++ 2 files changed, 171 insertions(+), 129 deletions(-) diff --git a/containers/linux/container_linux.cpp b/containers/linux/container_linux.cpp index 5c17d424b..b5d984d44 100644 --- a/containers/linux/container_linux.cpp +++ b/containers/linux/container_linux.cpp @@ -443,57 +443,54 @@ void container_linux::draw_borders(litehtml::uint_ptr hdc, const litehtml::borde { set_color(cr, borders.right.color); - double r_top = borders.radius.top_right_x; - double r_bottom = borders.radius.bottom_right_x; - - if(r_top) + if(borders.radius.top_right_x && borders.radius.top_right_y) { double end_angle = 2 * M_PI; double start_angle = end_angle - M_PI / 2.0 / ((double) bdr_top / (double) bdr_right + 1); add_path_arc(cr, - draw_pos.right() - r_top, - draw_pos.top() + r_top, - r_top - bdr_right, - r_top - bdr_right + (bdr_right - bdr_top), - end_angle, - start_angle, true); + draw_pos.right() - borders.radius.top_right_x, + draw_pos.top() + borders.radius.top_right_y, + borders.radius.top_right_x - bdr_right, + borders.radius.top_right_y - bdr_right + (bdr_right - bdr_top), + end_angle, + start_angle, true); add_path_arc(cr, - draw_pos.right() - r_top, - draw_pos.top() + r_top, - r_top, - r_top, - start_angle, - end_angle, false); + draw_pos.right() - borders.radius.top_right_x, + draw_pos.top() + borders.radius.top_right_y, + borders.radius.top_right_x, + borders.radius.top_right_y, + start_angle, + end_angle, false); } else { cairo_move_to(cr, draw_pos.right() - bdr_right, draw_pos.top() + bdr_top); cairo_line_to(cr, draw_pos.right(), draw_pos.top()); } - if(r_bottom) + if(borders.radius.bottom_right_x && borders.radius.bottom_right_y) { - cairo_line_to(cr, draw_pos.right(), draw_pos.bottom() - r_bottom); + cairo_line_to(cr, draw_pos.right(), draw_pos.bottom() - borders.radius.bottom_right_y); double start_angle = 0; double end_angle = start_angle + M_PI / 2.0 / ((double) bdr_bottom / (double) bdr_right + 1); add_path_arc(cr, - draw_pos.right() - r_bottom, - draw_pos.bottom() - r_bottom, - r_bottom, - r_bottom, - start_angle, - end_angle, false); + draw_pos.right() - borders.radius.bottom_right_x, + draw_pos.bottom() - borders.radius.bottom_right_y, + borders.radius.bottom_right_x, + borders.radius.bottom_right_y, + start_angle, + end_angle, false); add_path_arc(cr, - draw_pos.right() - r_bottom, - draw_pos.bottom() - r_bottom, - r_bottom - bdr_right, - r_bottom - bdr_right + (bdr_right - bdr_bottom), - end_angle, - start_angle, true); + draw_pos.right() - borders.radius.bottom_right_x, + draw_pos.bottom() - borders.radius.bottom_right_y, + borders.radius.bottom_right_x - bdr_right, + borders.radius.bottom_right_y - bdr_right + (bdr_right - bdr_bottom), + end_angle, + start_angle, true); } else { cairo_line_to(cr, draw_pos.right(), draw_pos.bottom()); @@ -508,57 +505,54 @@ void container_linux::draw_borders(litehtml::uint_ptr hdc, const litehtml::borde { set_color(cr, borders.bottom.color); - double r_left = borders.radius.bottom_left_x; - double r_right = borders.radius.bottom_right_x; - - if(r_left) + if(borders.radius.bottom_left_x && borders.radius.bottom_left_y) { double start_angle = M_PI / 2.0; double end_angle = start_angle + M_PI / 2.0 / ((double) bdr_left / (double) bdr_bottom + 1); add_path_arc(cr, - draw_pos.left() + r_left, - draw_pos.bottom() - r_left, - r_left - bdr_bottom + (bdr_bottom - bdr_left), - r_left - bdr_bottom, - start_angle, - end_angle, false); + draw_pos.left() + borders.radius.bottom_left_x, + draw_pos.bottom() - borders.radius.bottom_left_y, + borders.radius.bottom_left_x - bdr_bottom + (bdr_bottom - bdr_left), + borders.radius.bottom_left_y - bdr_bottom, + start_angle, + end_angle, false); add_path_arc(cr, - draw_pos.left() + r_left, - draw_pos.bottom() - r_left, - r_left, - r_left, - end_angle, - start_angle, true); + draw_pos.left() + borders.radius.bottom_left_x, + draw_pos.bottom() - borders.radius.bottom_left_y, + borders.radius.bottom_left_x, + borders.radius.bottom_left_y, + end_angle, + start_angle, true); } else { cairo_move_to(cr, draw_pos.left(), draw_pos.bottom()); cairo_line_to(cr, draw_pos.left() + bdr_left, draw_pos.bottom() - bdr_bottom); } - if(r_right) + if(borders.radius.bottom_right_x && borders.radius.bottom_right_y) { - cairo_line_to(cr, draw_pos.right() - r_right, draw_pos.bottom()); + cairo_line_to(cr, draw_pos.right() - borders.radius.bottom_right_x, draw_pos.bottom()); double end_angle = M_PI / 2.0; double start_angle = end_angle - M_PI / 2.0 / ((double) bdr_right / (double) bdr_bottom + 1); add_path_arc(cr, - draw_pos.right() - r_right, - draw_pos.bottom() - r_right, - r_right, - r_right, - end_angle, - start_angle, true); + draw_pos.right() - borders.radius.bottom_right_x, + draw_pos.bottom() - borders.radius.bottom_right_y, + borders.radius.bottom_right_x, + borders.radius.bottom_right_y, + end_angle, + start_angle, true); add_path_arc(cr, - draw_pos.right() - r_right, - draw_pos.bottom() - r_right, - r_right - bdr_bottom + (bdr_bottom - bdr_right), - r_right - bdr_bottom, - start_angle, - end_angle, false); + draw_pos.right() - borders.radius.bottom_right_x, + draw_pos.bottom() - borders.radius.bottom_right_y, + borders.radius.bottom_right_x - bdr_bottom + (bdr_bottom - bdr_right), + borders.radius.bottom_right_y - bdr_bottom, + start_angle, + end_angle, false); } else { cairo_line_to(cr, draw_pos.right() - bdr_right, draw_pos.bottom() - bdr_bottom); @@ -573,57 +567,54 @@ void container_linux::draw_borders(litehtml::uint_ptr hdc, const litehtml::borde { set_color(cr, borders.top.color); - double r_left = borders.radius.top_left_x; - double r_right = borders.radius.top_right_x; - - if(r_left) + if(borders.radius.top_left_x && borders.radius.top_left_y) { double end_angle = M_PI * 3.0 / 2.0; double start_angle = end_angle - M_PI / 2.0 / ((double) bdr_left / (double) bdr_top + 1); add_path_arc(cr, - draw_pos.left() + r_left, - draw_pos.top() + r_left, - r_left, - r_left, - end_angle, - start_angle, true); + draw_pos.left() + borders.radius.top_left_x, + draw_pos.top() + borders.radius.top_left_y, + borders.radius.top_left_x, + borders.radius.top_left_y, + end_angle, + start_angle, true); add_path_arc(cr, - draw_pos.left() + r_left, - draw_pos.top() + r_left, - r_left - bdr_top + (bdr_top - bdr_left), - r_left - bdr_top, - start_angle, - end_angle, false); + draw_pos.left() + borders.radius.top_left_x, + draw_pos.top() + borders.radius.top_left_y, + borders.radius.top_left_x - bdr_top + (bdr_top - bdr_left), + borders.radius.top_left_y - bdr_top, + start_angle, + end_angle, false); } else { cairo_move_to(cr, draw_pos.left(), draw_pos.top()); cairo_line_to(cr, draw_pos.left() + bdr_left, draw_pos.top() + bdr_top); } - if(r_right) + if(borders.radius.top_right_x && borders.radius.top_right_y) { - cairo_line_to(cr, draw_pos.right() - r_right, draw_pos.top() + bdr_top); + cairo_line_to(cr, draw_pos.right() - borders.radius.top_right_x, draw_pos.top() + bdr_top); double start_angle = M_PI * 3.0 / 2.0; double end_angle = start_angle + M_PI / 2.0 / ((double) bdr_right / (double) bdr_top + 1); add_path_arc(cr, - draw_pos.right() - r_right, - draw_pos.top() + r_right, - r_right - bdr_top + (bdr_top - bdr_right), - r_right - bdr_top, - start_angle, - end_angle, false); + draw_pos.right() - borders.radius.top_right_x, + draw_pos.top() + borders.radius.top_right_y, + borders.radius.top_right_x - bdr_top + (bdr_top - bdr_right), + borders.radius.top_right_y - bdr_top, + start_angle, + end_angle, false); add_path_arc(cr, - draw_pos.right() - r_right, - draw_pos.top() + r_right, - r_right, - r_right, - end_angle, - start_angle, true); + draw_pos.right() - borders.radius.top_right_x, + draw_pos.top() + borders.radius.top_right_y, + borders.radius.top_right_x, + borders.radius.top_right_y, + end_angle, + start_angle, true); } else { cairo_line_to(cr, draw_pos.right() - bdr_right, draw_pos.top() + bdr_top); @@ -638,57 +629,54 @@ void container_linux::draw_borders(litehtml::uint_ptr hdc, const litehtml::borde { set_color(cr, borders.left.color); - double r_top = borders.radius.top_left_x; - double r_bottom = borders.radius.bottom_left_x; - - if(r_top) + if(borders.radius.top_left_x && borders.radius.top_left_y) { double start_angle = M_PI; double end_angle = start_angle + M_PI / 2.0 / ((double) bdr_top / (double) bdr_left + 1); add_path_arc(cr, - draw_pos.left() + r_top, - draw_pos.top() + r_top, - r_top - bdr_left, - r_top - bdr_left + (bdr_left - bdr_top), - start_angle, - end_angle, false); + draw_pos.left() + borders.radius.top_left_x, + draw_pos.top() + borders.radius.top_left_y, + borders.radius.top_left_x - bdr_left, + borders.radius.top_left_y - bdr_left + (bdr_left - bdr_top), + start_angle, + end_angle, false); add_path_arc(cr, - draw_pos.left() + r_top, - draw_pos.top() + r_top, - r_top, - r_top, - end_angle, - start_angle, true); + draw_pos.left() + borders.radius.top_left_x, + draw_pos.top() + borders.radius.top_left_y, + borders.radius.top_left_x, + borders.radius.top_left_y, + end_angle, + start_angle, true); } else { cairo_move_to(cr, draw_pos.left() + bdr_left, draw_pos.top() + bdr_top); cairo_line_to(cr, draw_pos.left(), draw_pos.top()); } - if(r_bottom) + if(borders.radius.bottom_left_x && borders.radius.bottom_left_y) { - cairo_line_to(cr, draw_pos.left(), draw_pos.bottom() - r_bottom); + cairo_line_to(cr, draw_pos.left(), draw_pos.bottom() - borders.radius.bottom_left_y); double end_angle = M_PI; double start_angle = end_angle - M_PI / 2.0 / ((double) bdr_bottom / (double) bdr_left + 1); add_path_arc(cr, - draw_pos.left() + r_bottom, - draw_pos.bottom() - r_bottom, - r_bottom, - r_bottom, - end_angle, - start_angle, true); + draw_pos.left() + borders.radius.bottom_left_x, + draw_pos.bottom() - borders.radius.bottom_left_y, + borders.radius.bottom_left_x, + borders.radius.bottom_left_y, + end_angle, + start_angle, true); add_path_arc(cr, - draw_pos.left() + r_bottom, - draw_pos.bottom() - r_bottom, - r_bottom - bdr_left, - r_bottom - bdr_left + (bdr_left - bdr_bottom), - start_angle, - end_angle, false); + draw_pos.left() + borders.radius.bottom_left_x, + draw_pos.bottom() - borders.radius.bottom_left_y, + borders.radius.bottom_left_x - bdr_left, + borders.radius.bottom_left_y - bdr_left + (bdr_left - bdr_bottom), + start_angle, + end_angle, false); } else { cairo_line_to(cr, draw_pos.left(), draw_pos.bottom()); @@ -794,9 +782,15 @@ std::shared_ptr container_linux::create_element(const char *t void container_linux::rounded_rectangle( cairo_t* cr, const litehtml::position &pos, const litehtml::border_radiuses &radius ) { cairo_new_path(cr); - if(radius.top_left_x) - { - cairo_arc(cr, pos.left() + radius.top_left_x, pos.top() + radius.top_left_x, radius.top_left_x, M_PI, M_PI * 3.0 / 2.0); + if(radius.top_left_x && radius.top_left_y) + { + add_path_arc(cr, + pos.left() + radius.top_left_x, + pos.top() + radius.top_left_y, + radius.top_left_x, + radius.top_left_y, + M_PI, + M_PI * 3.0 / 2.0, false); } else { cairo_move_to(cr, pos.left(), pos.top()); @@ -804,23 +798,41 @@ void container_linux::rounded_rectangle( cairo_t* cr, const litehtml::position & cairo_line_to(cr, pos.right() - radius.top_right_x, pos.top()); - if(radius.top_right_x) + if(radius.top_right_x && radius.top_right_y) { - cairo_arc(cr, pos.right() - radius.top_right_x, pos.top() + radius.top_right_x, radius.top_right_x, M_PI * 3.0 / 2.0, 2.0 * M_PI); + add_path_arc(cr, + pos.right() - radius.top_right_x, + pos.top() + radius.top_right_y, + radius.top_right_x, + radius.top_right_y, + M_PI * 3.0 / 2.0, + 2.0 * M_PI, false); } cairo_line_to(cr, pos.right(), pos.bottom() - radius.bottom_right_x); - if(radius.bottom_right_x) + if(radius.bottom_right_x && radius.bottom_right_y) { - cairo_arc(cr, pos.right() - radius.bottom_right_x, pos.bottom() - radius.bottom_right_x, radius.bottom_right_x, 0, M_PI / 2.0); + add_path_arc(cr, + pos.right() - radius.bottom_right_x, + pos.bottom() - radius.bottom_right_y, + radius.bottom_right_x, + radius.bottom_right_y, + 0, + M_PI / 2.0, false); } cairo_line_to(cr, pos.left() - radius.bottom_left_x, pos.bottom()); - if(radius.bottom_left_x) + if(radius.bottom_left_x && radius.bottom_left_y) { - cairo_arc(cr, pos.left() + radius.bottom_left_x, pos.bottom() - radius.bottom_left_x, radius.bottom_left_x, M_PI / 2.0, M_PI); + add_path_arc(cr, + pos.left() + radius.bottom_left_x, + pos.bottom() - radius.bottom_left_y, + radius.bottom_left_x, + radius.bottom_left_y, + M_PI / 2.0, + M_PI, false); } } diff --git a/include/litehtml/borders.h b/include/litehtml/borders.h index e690db6d3..9c47abca0 100644 --- a/include/litehtml/borders.h +++ b/include/litehtml/borders.h @@ -157,6 +157,35 @@ namespace litehtml if (bottom_left_x < 0) bottom_left_x = 0; if (bottom_left_y < 0) bottom_left_y = 0; } + void fix_values(int width, int height) + { + fix_values(); + int half_width = width / 2; + int half_height = height / 2; + auto fix_one = [&](int& radii_x, int& radii_y) + { + double factor = std::min((double) half_width / (double) radii_x, (double) half_height / (double) radii_y); + radii_x = (int) ((double) radii_x * factor); + radii_y = (int) ((double) radii_y * factor); + }; + + if(top_left_x > half_width || top_left_y > half_height) + { + fix_one(top_left_x, top_left_y); + } + if(top_right_x > half_width || top_right_y > half_height) + { + fix_one(top_right_x, top_right_y); + } + if(bottom_right_x > half_width || bottom_right_y > half_height) + { + fix_one(bottom_right_x, bottom_right_y); + } + if(bottom_left_x > half_width || bottom_left_y > half_height) + { + fix_one(bottom_left_x, bottom_left_y); + } + } }; struct css_border_radius @@ -213,6 +242,7 @@ namespace litehtml ret.top_right_y = top_right_y.calc_percent(height); ret.bottom_right_x = bottom_right_x.calc_percent(width); ret.bottom_right_y = bottom_right_y.calc_percent(height); + ret.fix_values(width, height); return ret; } }; From a230188b31095987d8919e328629eac8aa4f88ea Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Fri, 29 Dec 2023 03:46:49 +0300 Subject: [PATCH 55/73] flex: fixes in rendering of the justify-content css property --- include/litehtml/types.h | 11 +++- src/render_flex.cpp | 51 +++++++++++++++--- ...rflow.htm => --flexbox_width-overflow.htm} | 0 .../render/flex/flexbox-flex-flow-001.htm.png | Bin 2077 -> 2059 bytes ...=> flexbox-justify-content-horiz-001a.htm} | 0 ...flexbox-justify-content-horiz-001a.htm.png | Bin 0 -> 334 bytes ...=> flexbox-justify-content-horiz-001b.htm} | 0 ...flexbox-justify-content-horiz-001b.htm.png | Bin 0 -> 334 bytes ... => flexbox-justify-content-horiz-002.htm} | 0 .../flexbox-justify-content-horiz-002.htm.png | Bin 0 -> 1288 bytes ... => flexbox-justify-content-horiz-003.htm} | 0 .../flexbox-justify-content-horiz-003.htm.png | Bin 0 -> 429 bytes ... => flexbox-justify-content-horiz-004.htm} | 0 .../flexbox-justify-content-horiz-004.htm.png | Bin 0 -> 914 bytes ... => flexbox-justify-content-horiz-005.htm} | 0 .../flexbox-justify-content-horiz-005.htm.png | Bin 0 -> 865 bytes ... => flexbox-justify-content-horiz-006.htm} | 0 .../flexbox-justify-content-horiz-006.htm.png | Bin 0 -> 391 bytes ... => flexbox-justify-content-vert-001a.htm} | 0 .../flexbox-justify-content-vert-001a.htm.png | Bin 0 -> 439 bytes ... => flexbox-justify-content-vert-001b.htm} | 0 .../flexbox-justify-content-vert-001b.htm.png | Bin 0 -> 439 bytes ...m => flexbox-justify-content-vert-002.htm} | 0 .../flexbox-justify-content-vert-002.htm.png | Bin 0 -> 919 bytes ...m => flexbox-justify-content-vert-003.htm} | 0 .../flexbox-justify-content-vert-003.htm.png | Bin 0 -> 312 bytes ...m => flexbox-justify-content-vert-004.htm} | 0 .../flexbox-justify-content-vert-004.htm.png | Bin 0 -> 982 bytes ...m => flexbox-justify-content-vert-005.htm} | 0 .../flexbox-justify-content-vert-005.htm.png | Bin 0 -> 696 bytes ...m => flexbox-justify-content-vert-006.htm} | 0 .../flexbox-justify-content-vert-006.htm.png | Bin 0 -> 461 bytes 32 files changed, 54 insertions(+), 8 deletions(-) rename test/render/flex/{flexbox_width-overflow.htm => --flexbox_width-overflow.htm} (100%) rename test/render/flex/{--flexbox-justify-content-horiz-001a.htm => flexbox-justify-content-horiz-001a.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-horiz-001a.htm.png rename test/render/flex/{--flexbox-justify-content-horiz-001b.htm => flexbox-justify-content-horiz-001b.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-horiz-001b.htm.png rename test/render/flex/{--flexbox-justify-content-horiz-002.htm => flexbox-justify-content-horiz-002.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-horiz-002.htm.png rename test/render/flex/{--flexbox-justify-content-horiz-003.htm => flexbox-justify-content-horiz-003.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-horiz-003.htm.png rename test/render/flex/{--flexbox-justify-content-horiz-004.htm => flexbox-justify-content-horiz-004.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-horiz-004.htm.png rename test/render/flex/{--flexbox-justify-content-horiz-005.htm => flexbox-justify-content-horiz-005.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-horiz-005.htm.png rename test/render/flex/{--flexbox-justify-content-horiz-006.htm => flexbox-justify-content-horiz-006.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-horiz-006.htm.png rename test/render/flex/{--flexbox-justify-content-vert-001a.htm => flexbox-justify-content-vert-001a.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-vert-001a.htm.png rename test/render/flex/{--flexbox-justify-content-vert-001b.htm => flexbox-justify-content-vert-001b.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-vert-001b.htm.png rename test/render/flex/{--flexbox-justify-content-vert-002.htm => flexbox-justify-content-vert-002.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-vert-002.htm.png rename test/render/flex/{--flexbox-justify-content-vert-003.htm => flexbox-justify-content-vert-003.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-vert-003.htm.png rename test/render/flex/{--flexbox-justify-content-vert-004.htm => flexbox-justify-content-vert-004.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-vert-004.htm.png rename test/render/flex/{--flexbox-justify-content-vert-005.htm => flexbox-justify-content-vert-005.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-vert-005.htm.png rename test/render/flex/{--flexbox-justify-content-vert-006.htm => flexbox-justify-content-vert-006.htm} (100%) create mode 100644 test/render/flex/flexbox-justify-content-vert-006.htm.png diff --git a/include/litehtml/types.h b/include/litehtml/types.h index 583a994f7..901a4d5ab 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -868,15 +868,22 @@ namespace litehtml flex_wrap_wrap_reverse }; -#define flex_justify_content_strings "flex-start;flex-end;center;space-between;space-around" +#define flex_justify_content_strings "normal;flex-start;flex-end;center;space-between;space-around;start;end;left;right;space-evenly;stretch" enum flex_justify_content { + flex_justify_content_normal, flex_justify_content_flex_start, flex_justify_content_flex_end, flex_justify_content_center, flex_justify_content_space_between, - flex_justify_content_space_around + flex_justify_content_space_around, + flex_justify_content_start, + flex_justify_content_end, + flex_justify_content_left, + flex_justify_content_right, + flex_justify_content_space_evenly, + flex_justify_content_stretch, }; #define flex_align_items_strings "normal;flex-start;flex-end;center;start;end;baseline;stretch;auto" diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 7614d2406..0cb520a5f 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -9,9 +9,11 @@ namespace litehtml flex_justify_content m_type; int m_num_items; int m_free_space; + bool m_row_direction; + bool m_reverse; public: - flex_justify_content_spread(flex_justify_content type, int num_items, int free_space) : - m_type(type), m_num_items(num_items), m_free_space(0) + flex_justify_content_spread(flex_justify_content type, int num_items, int free_space, bool row_direction, bool reverse) : + m_type(type), m_num_items(num_items), m_free_space(0), m_row_direction(row_direction), m_reverse(reverse) { set_free_space(free_space); } @@ -28,10 +30,18 @@ namespace litehtml if(m_num_items == 1 || m_free_space < 0) m_type = flex_justify_content_flex_start; break; case flex_justify_content_space_around: + case flex_justify_content_space_evenly: // If the leftover free-space is negative or there is only a single flex item on the line, this // value is identical to center if(m_num_items == 1 || m_free_space < 0) m_type = flex_justify_content_center; break; + case flex_justify_content_right: + case flex_justify_content_left: + if(!m_row_direction) + { + m_type = flex_justify_content_start; + } + break; default: break; } @@ -41,14 +51,28 @@ namespace litehtml { switch (m_type) { + case flex_justify_content_right: + if(!m_reverse) + { + return m_free_space; + } + return 0; + case flex_justify_content_start: + case flex_justify_content_left: + if(m_reverse) + { + return m_free_space; + } + return 0; case flex_justify_content_flex_end: + case flex_justify_content_end: return m_free_space; case flex_justify_content_center: return m_free_space / 2; case flex_justify_content_space_between: case flex_justify_content_space_around: default: - // using flex-start b y default + // using flex-start by default return 0; } } @@ -57,6 +81,8 @@ namespace litehtml { switch (m_type) { + case flex_justify_content_space_evenly: + return m_free_space / (m_num_items + 1); case flex_justify_content_space_between: return 0; case flex_justify_content_space_around: @@ -227,6 +253,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, single_line = true; fit_container = true; } + if(self_size.min_height.type != containing_block_context::cbc_value_type_auto && self_size.min_height > container_main_size) + { + container_main_size = self_size.min_height; + } } // Split flex items to lines @@ -238,11 +268,12 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, int el_y = 0; int el_x = 0; int sum_cross_size = 0; + int sum_main_size = 0; int ret_width = 0; for(auto& ln : lines) { ln.cross_size = 0; - ln.main_size =0; + ln.main_size = 0; if(is_row_direction) { @@ -291,10 +322,15 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, sum_cross_size += ln.cross_size; el_y = 0; } + sum_main_size = std::max(sum_main_size, ln.main_size); } int free_cross_size = 0; int cross_end = 0; + if(container_main_size == 0) + { + container_main_size = sum_main_size; + } if (is_row_direction) { if (self_size.height.type != containing_block_context::cbc_value_type_auto) @@ -349,7 +385,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, flex_justify_content_spread content_spread(css().get_flex_justify_content(), (int) ln.items.size(), - container_main_size - ln.main_size); + container_main_size - ln.main_size, is_row_direction, reverse); if(is_row_direction) { if(is_wrap_reverse) @@ -484,7 +520,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { item.el->render(el_x, item.el->pos().y - item.el->content_offset_top(), - self_size.new_width(ln.cross_size), fmt_ctx, false); + self_size.new_width_height(ln.cross_size, + item.main_size - item.el->content_offset_height(), + containing_block_context::cbc_size_mode_exact_height), + fmt_ctx, false); } else { item.el->render(el_x, diff --git a/test/render/flex/flexbox_width-overflow.htm b/test/render/flex/--flexbox_width-overflow.htm similarity index 100% rename from test/render/flex/flexbox_width-overflow.htm rename to test/render/flex/--flexbox_width-overflow.htm diff --git a/test/render/flex/flexbox-flex-flow-001.htm.png b/test/render/flex/flexbox-flex-flow-001.htm.png index eecf11f3414e960c10c147c664ba4987b9b3939a..d210b04d3a15a94d3e8956d9c6263a585bb68131 100644 GIT binary patch delta 1761 zcmZ9Mc{JNuAI1eG)t(9?v1Q~JVp_DSn<6G8wnWciWQZlSmMMqW6&=*io{Y8;^kod; zJ(`}>-cVAeVN^?0msk5rqSNY>7$rf~ni3t_GiR3j$8+vq&wcLad!NgOU52q7!5)$; z-uEIzKIU{;HfW^rZqvN*jQ{0+z&Ad%$~$RnA||le?WR`4J%t{#$tKlq^|%lpRln-k z@s=$VLCmX0Yi9N=n+hH;FK>;40f!Nn9|ZY7Xe?%DlZV`WkD$B_`U3s?CYAc@cK5xU z8Xmq#h-j7>$YdK$quBMHw%|$7$x)rn0%7%Xe%&=et;a9#AUJ`mR% zS{5F{kDY=>op(5b#(5BhZ;M>H$~vC2f0$tDjH68Qb;AE2cOD0%ScR7rWf`KUVzQKr z&`~q#@!C=>jBV@siXx3TGxo5B$elr3Mhk!3(6DePLKr{M^++z+VAsN}Dba_3DpCA` z$Y^o=m$9lJKJ;BsUz_S-Dcsfu@kz4M-=p%Ffp~TK%BrEKM|fk z&^rc4V@?Tq-DB1CJ3~dV_#*^IOy$wc)Kb<+B>HJpGqGw!Ay7=prp(<}snU zAbWd3=FYIXGPcyJ!jHD+57t`>;L)GILmR=q)?V@;ax-c3AUt-4&gXIGtD_<@1;MfjZdU0 zzIYz|Vw`H#KhT?~#LY`LYUHcc<;XoI{@LWuoQSqmtLlMTZP#v26vl1wrEGgbg3+`n z_3b`;ouBj4FuhU=jIlZW#gfpin#1=Gb}qBhtp?*Vs3QlzWL@~t$!y|>C0Y-x@{#EG zW9n0tIsXrfQ6j0wymaye*CF`DTj`CVwCLF@?CeN4Jz#FBc!TGKAghoai#B+k z2PVB!5^06>ukUu+W-4pVrROV=nCczif1&=gvjS!R0*-@Cm(`Z)2~yfNA37q3c3P_o zo6fj8ks+LZW0&@USEMdz)+=kjU&cZPYz<zU{g3sAs<$-YDH0Uks!P)(o|*gmPrr(Bc_P-z|F z#X!Q@v|)U^0?_@(yDWgUw==Ka+-b~iVP>Gik+f+wAM05|(x;E?(ZHv;5T91@+ZKAT z2{VFQ=X*+95nLK&-(@)lUxH!lZl6rvs+Ei0vmo?P7D?Nk`TU%YzT_*BJE1l$xd!KI z)==BmxfNi(&tly=I@cvIstk`m8{cQHhmNWqF9f3oM_wM5|$qv`##l* z#l;Uk(&$DI*No8x*Ur(FSXdM%7V{;r&x+&VtZOX2Bq`w|l&hOI{oi!p?>RF5?*8d8 x>m3aP=H+wBnG0(dU;AHLkS|>$dp4j}RM~qAkEM*9JFK#^NN!%Pt%T6LKL8LkP%r=h delta 1794 zcmZ9MeK_0a9>zmc4T>LEb#y|0mCn4@b!IUy6%sTlV;t%wl(t^#FkQ7Gnl5pQNrNS% zMrZ0=njZC%d8yP}Gi|4SN;^X(p~Q};mSoauLJ=&g*REdY`Q!WN{d~UnbKg%PPzA6( z>5qxNK4BCs`53lP=Kqn-tCfI-&+B3wb#lMz46g`2H}>D?{i(+FxcYCf`BJ+;WV&E) z#_v^UvaUy6_@p({hnVED;udc>l5)NJ1#1&J)e`9-?6Nx^E?08gF*W~Mr9621uxrgg zf$fGs@)|K*NJE~Eg(Bnn;)*4mqHmv@(6{EnmwDp!((DSyKJ+bU*haMj=FeU$26FDsNxTt!zSx%PjpPnW0BI zue~hg&$)Eo>+2hBThCPMZPcE!^>cTP30_vdIK&lgH;h6x11`3VTcRsXAL*FTj{Zi< zwVZsDRzg_7u%PRQ8^kd?s{U}MD)1#WnQAIzV7h^@q)Q7nAE_2)hy%T z9?06oa`Tq^C#M&fKs->ctaWV_qZLJ^Ku z!TM71yiNY-rHA0HVGq$-{yDia3OC8md}!0{ub7l=3dQI>wk2VmCvLRoOqykt&!WbP zx%Zjkcy)zCuMPhVJHo#2>x-m88zlQe1=d<}<@Nb4p!~6L&I>NBjco-C7}pElT60GQ z{AH&U&TqQ{wXxkC3wV&06(<$$lC-BLX5_Qdnykf4dTLr}?o~p4Ow%yQJH4noAcMW& zKN9bk=1dFRKf{^G?r$)aVg$VB97BTp<7#6??_0N6MnF>Pd8^B>N1dV=I=(}AweiTj zB$`^@<{hdO3KloSaXn@>h)10JI+pZmYjh>A%z!&-U55)5kyg5lpgyK%U5B(fqe~U^05srJTGhJoc*ja7>SphntrTbtCDG4>}LPA?V=t+!+apJ27!A zI$c{G)>40}cF4H&iEv=9IeC}u3Zb6;RP~NtJif!n5NQF*7*s^lf3bi+FY9p*^o_P24*84}P_jL{|!E zLncdY0fwa<;x0?N*HHq7WN*dDAP#Ak)YLR_@%wEmT}Fn$|Ll?3j4TU}4Q_pQKg9GL zXbG?TnNc8K<=!ljiW1s?DA@Z2JU8&7bH-1b%#M3^FeXdQ9H|mKKvb!D&mp@gLT46H z-$GkSJ`B=|WFpqK@Vl1%Z3g|FCBm^5MckKF)TxNM#ckZOoKHomN+I4U3)0l8{>Oq#jr}()NM#F53Zp7G z`hXklOLA&{YlG5@mPpDgc?vC5Ok**gzg6P z`=!T0*wd!;RDR{N=p6Of3FHlD1U$ry?sYRVS_l5fczM6X+ZUX50dGQ)K<~cWwtWY= zOvRUy>G3B}N4M-wcX3f0TMpu%=tYs~;(5%-=Q?#JtE!J*`0Rr_`221Hcl>bZ?Mg|G zP+)6sL+f}#MV$R!ZmJ&I99{W`u-V56v)X0aKZ-h?lpCXe2EASk;0Bubl>RECP)w;I zJKr=EiMnF2NR>a>LN1e3v{ZRh>Z9Hc-nXKA8?@qm|Xzc3&l*-NdpYlv{zUClz-D73|6Tu-M-~Hb4tH^FZl%)l3B>bbimHN-D&-W z*81{ag28Hbzio5UfyW#ciq%XSVK7rk(>Jd+EEKET=E%KAe1Sz~rppox);t&M0z2cp gyBHA|D^AC{0-OJ5sQ9JF4*&oF07*qoM6N<$f;iik)c^nh literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-justify-content-horiz-001b.htm b/test/render/flex/flexbox-justify-content-horiz-001b.htm similarity index 100% rename from test/render/flex/--flexbox-justify-content-horiz-001b.htm rename to test/render/flex/flexbox-justify-content-horiz-001b.htm diff --git a/test/render/flex/flexbox-justify-content-horiz-001b.htm.png b/test/render/flex/flexbox-justify-content-horiz-001b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d3e3d1dac075d0a0e9f6a096f6e8aec08856c5ea GIT binary patch literal 334 zcmV-U0kQsxP)c3&l*-NdpYlv{zUClz-D73|6Tu-M-~Hb4tH^FZl%)l3B>bbimHN-D&-W z*81{ag28Hbzio5UfyW#ciq%XSVK7rk(>Jd+EEKET=E%KAe1Sz~rppox);t&M0z2cp gyBHA|D^3=>0w~gFr~w}+oB#j-07*qoM6N<$f?(&9l>h($ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-justify-content-horiz-002.htm b/test/render/flex/flexbox-justify-content-horiz-002.htm similarity index 100% rename from test/render/flex/--flexbox-justify-content-horiz-002.htm rename to test/render/flex/flexbox-justify-content-horiz-002.htm diff --git a/test/render/flex/flexbox-justify-content-horiz-002.htm.png b/test/render/flex/flexbox-justify-content-horiz-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e42aa749334e3f9b71216aaa57772a0506e8f7d7 GIT binary patch literal 1288 zcmeAS@N?(olHy`uVBq!ia0vp^w-^|h?yxWeS;b#B-vLsh0X`wF|Ns97G8-5gCcK;Q z|G;U6hKB!38IJ#O%wb?)S?B5E7*fIb=IYtr#})$agi5`vr>@-983?rfFXzqq zezi$yd+`Ldx4MD*w@*KNGSA8c1bW4CWwyvh1^;YMThHp+Bs?+wR6K`FXcvgFt?P+)}YJdL!hr@2a<$R0Q&gSC< z0^h~1((JkI+pJ8gbv1YXA0&uP$U2KMq}c*L+IvHTCwkwy-|2 z+&QdglZs?RjBi-nTX-|uapD7)Co{iIQ`y^au_OBavF~P4z8N6Unt7{t@>DUA&?)7> zQ2Wo+CVl^%<;7dyuWjr1ES;P^|87b=Se?|{orM>^WtbtEWfE%ZvwZXA&PU(FwogAE zw)521mnUzZ-1@t1)5Tv;E?l^9>f)l_%?l!Z)-`9bNguaIa(S@L_BmDi8iM!a1C?F4 zz;$_x^z&L!2*`j!;L3a5jIAgrB6Q9-jm`SY~_lxZ~wUW>SL7? zIF7x5alB^Bf)$JQ00YuK?m)rO=)=Ok`?hbZ?OAqvera`O&T?%jAc(4*RrWY#DXXjK)4AWK{dvpE^L@`&%Zq=i zvu_`-*(K}rdKt*M&czp=ne*L>I*T0r%jAw-x%t}VV)g3Vr<3=_e2sc_p!DiH=~Hg6 zCj)h8yLOwOo3yRINH*;D-a?e%@LPQF>E+L?bKJPuK}l<^j_>Zmd*R$&cg{J^+Opl{ z@4YxP_1!PS>VKtImlnKM;Bg6@@?ZOatjgXctWgX83oX*|c*832VUM`-{oQU>n@r9u z0Hxy4%$r9YS6?{hC?B{RrfaWiAL|Iy!hAf|GVFw=q*pDflOTZb$O-!x%FG0czjd(^knX& zF8c?@kG8+%|DUua)%51p<5l2vDW|*JB181n^@T^XPfmR3y5x+t>U#SH5spo#{;#!= zjmyp6yKC!9m+2Ru9R``WI8{8|z57N?Zx*AtyDZeDE|LB-YZ@Dm`PH8WmS+r}u6{1- HoD!M z8M^+3`!X;v#(26ohEy=Vy|Qub?Es#(iz`0F$vqV9;_h9bY18GcsAba>{)vGtZ&u8z zfLq>dmCs-Ef7twxzjkunzf3jHNjj56zi! zeUm_Lc#`x&>i;i4kQ<6;|2n5yW*7ZM(Q}fF-s;zf(}7MP zFLMDpAnuv@*NyQ&7nmBYzp>*;bsf;qv{PI3Y9C1n$Lm&223hf|{}=DF!U!&Zm9>|F P;m_dd>gTe~DWM4f1l!`s)a!gaUj*T>t<7-@wo?;oXG) z2Tn6IH2h!6Fz-=rI|Bo=wWo_?NCo4Ys|O1oCGZ@-nCijU!so$yW(OmmAN!8~Vc$;Z zdF)J?kXrvf{GfHlm;cJ1``;VC3Gx0>^|q-23@&7>5nSTVdv4>=Y%h*r2__J5(p8kq zZi#AAv7NqenU|AMFfYg4<5hmUdR-$9z2g9a-%2XUu|F4>drVle9jXK*3{Ti%##b9IRIYixYF~GBR1$e8C{#o zU)9XwSry&>L;b4Ixr25PtqLYm*(|-`&5N@?HV7Rm?AoOSHgO8fMEm#8w+KBnbe%5O z@`2OemZSJmuFfH$GIs|DhZ~v?|8IX_fI;8|;3(*`s(em#<@ym8IkIUjqmnaY2D z#iR*5!OTw2EC0=yd`ziEKM~|NBwugsmcPDonn2GDRz@&bcrilRqhD%Ha`*Kq0?Q0o zK%gZG=q-+|Ku_t_`c7?0Stcc5)&F%)iFEgdmb-!i0s`M$J&x`A4IGA0~sJk!F$-*x%9AaV+)Wly8B}0WKC1yFiusJVZd?}*ky($mT z9f|QRDQmRlzp!ym+LHG2Ixwuc+n}+Wx<=5Xf>&?DQFAYj=5>PE+t) zfBr>&b!kqpp-6LL2nSn5QuB7kATbX?Gmmfat$hreyldv(`RrT3b^8BzW1y*ruK;6k z-u-P$c5=*j2PK(9dpS-fIrR!Htns6or7}Oi@O}e&|!~F&*MHE0%#IGh6&tKc)9?cK&uHgU1 zi3sY9eNr;9-Rx5Y;-;_QM+=&db#l!d&qZvj1rDk2`J#~H`8uXWIR}&?c4$8Q9>HIE h;ku&7B$EaDpUPb>Ec-S26fl!9c)I$ztaD0e0svu5Y%Tx* literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-justify-content-horiz-005.htm b/test/render/flex/flexbox-justify-content-horiz-005.htm similarity index 100% rename from test/render/flex/--flexbox-justify-content-horiz-005.htm rename to test/render/flex/flexbox-justify-content-horiz-005.htm diff --git a/test/render/flex/flexbox-justify-content-horiz-005.htm.png b/test/render/flex/flexbox-justify-content-horiz-005.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..567f0c61a5a58c40f0e861d3d4123e37d33ceea0 GIT binary patch literal 865 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYVA5e?28xugRy6@qJOMr-uK)l4pYU$N{{yH0 zFJ#>Ho!tzRbV( z{#Et7RDAYMxIY7f>|IBz}#K_#k4s3FVKP_bRB;8jeoDS zU;VwI0ZBO|07PcpJomVNb=Z3rMj*&!Lkfeq!e9HM_?ag0p@tW0&}(PK{ojKX8X@5a zvmRvLyd57l^{ocE3<2ttp4_cHd*|P2MS%(YyeMY=J|S?c(c6?sNl{OiRG{DY;vB*R@R^y z_e9=#U0eh|iXXtie@(tAW}5Hj=M4={5b*&`VZRt6zt6&wiZ0HrmP!7GHR_Xb8D{cr rUG>>}oJ>G)i3iCU9+SSTyvK0Y_u}%s%Be4bd4|E$)z4*}Q$iB}g?mZ; literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-justify-content-horiz-006.htm b/test/render/flex/flexbox-justify-content-horiz-006.htm similarity index 100% rename from test/render/flex/--flexbox-justify-content-horiz-006.htm rename to test/render/flex/flexbox-justify-content-horiz-006.htm diff --git a/test/render/flex/flexbox-justify-content-horiz-006.htm.png b/test/render/flex/flexbox-justify-content-horiz-006.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..6e4120a10fe82e70667c52fbe454eb66eadf5557 GIT binary patch literal 391 zcmeAS@N?(olHy`uVBq!ia0vp^Hy9Y05}25Qtf?NZ{y>T+z$e7@|Ns9J-c9&_;Pn5c z3|;@ieHj=S%{*NkLn;{GUfGy?*g&8y(7Hj&Jnp3Oj-9neUDD<=&q*6(G6{5?g>|Bmb|fcO3sOQDr)8kYoJ%zWcS>zaBh?H~d=~^mU>{TVi#7rgUebgxQW`pSuzz zuI&$5WhVqwSs@q>RCG2cr+2$BkejqJq}H}A@y0(Zw-^JS!`n6m&i%Aos_>`*Pj=#8 z@1>s(e&+xxm%5$peLD!q*so*1VEb2PL!QHGaqB`}{nW4NKVrbM`|R$R);>XTpn|n) zit~S}*2eFZ1RC!3Jmf{8#hgzsT+z$e7@|Ns9J-c9&_;Pn5c z3|;@ieHj=S(>z@qLn;{GUNy{XHV|n@6q}~ASE~E{bj#(hd2dOGwdk(!)=B*H*O}$w z^R}#EGGkRVPlIdivjwU#HyN+}y5B%E@fmyB|<_+nRT`JJ)dDyyTx#`d{?@{_K;V+;ezSK;Zi1 zRtZT-$w>1}OV*`+PBjXU0rDho=BBo@Po8M1E`4}+ru#OYHD*VCJGfojmm_y$@>;eN z=T6IgY*fE_H0AWuKAruIJwUKV{$^PNhyes|#5N^afsBb2`_31n zldoSvSy}n_oSfxRn?6sR7#sX;;eI)gVj#H5nyOl21O%JdQWd}XN8SZ%Rq;Ihf&1)| W4_jH!8e{-tg2B_(&t;ucLK6UVR>v6t literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-justify-content-vert-001b.htm b/test/render/flex/flexbox-justify-content-vert-001b.htm similarity index 100% rename from test/render/flex/--flexbox-justify-content-vert-001b.htm rename to test/render/flex/flexbox-justify-content-vert-001b.htm diff --git a/test/render/flex/flexbox-justify-content-vert-001b.htm.png b/test/render/flex/flexbox-justify-content-vert-001b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..4b9548411a193fddccaa4713aec87b9de15ab491 GIT binary patch literal 439 zcmeAS@N?(olHy`uVBq!ia0y~yU`hhAZ!j?fNz-rX{y>T+z$e7@|Ns9J-c9&_;Pn5c z3|;@ieHj=S(>z@qLn;{GUNy{XHV|n@6q}~ASE~E{bj#(hd2dOGwdk(!)=B*H*O}$w z^R}#EGGkRVPlIdivjwU#HyN+}y5B%E@fmyB|<_+nRT`JJ)dDyyTx#`d{?@{_K;V+;ezSK;Zi1 zRtZT-$w>1}OV*`+PBjXU0rDho=BBo@Po8M1E`4}+ru#OYHD*VCJGfojmm_y$@>;eN z=T6IgY*fE_H0AWuKAruIJwUKV{$^PNhyes|#5N^afsBb2`_31n zldoSvSy}n_oSfxRn?6sR7#sX;;eI)gVj#H5nyOl21O%JdQWd}XN8SZ%Rq;Ihf&1)| W4_jH!8e{-tg2B_(&t;ucLK6UVR>v6t literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-justify-content-vert-002.htm b/test/render/flex/flexbox-justify-content-vert-002.htm similarity index 100% rename from test/render/flex/--flexbox-justify-content-vert-002.htm rename to test/render/flex/flexbox-justify-content-vert-002.htm diff --git a/test/render/flex/flexbox-justify-content-vert-002.htm.png b/test/render/flex/flexbox-justify-content-vert-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..3edd4083d2a15d5694c426bb721c9d93533f9db9 GIT binary patch literal 919 zcmeAS@N?(olHy`uVBq!ia0y~yU|I!a-(q0~l5@mrHv%cq0G|-o|Ns93nGFmL6W&eu zf8aDjL&N{2499;s<}ffY+j_bMO7uZJ-5lnh9^9FVf2U8_ zc+kw+&4uZp-NBvlCyL!4$?AVl0s$dgdwZi@KKfIhdCBiAan74R{rdF$&Z99ekN=*w z`1F^gbs`^kthrPedis55mg?0{FITVy?EPMuyFY&4R(0{>rJ<|(%XdB7!Mf@y2j7|~ zAOEe>vOboCoL?~O`=Zt5GNG$NR?5Yd&Nf^bwA5>=*3}=$$HLyW-LccZe`|90&Y+`) z%yQF1tu|zRw9Q>G%c{I;2ZVPGf%n#XC5$2OYqeJNm3ggxHYF-_ zu3T|vmZAjIryv)uU9rx(59E=R^E|goZ;C73a+&XVpzYjOJGLC2VJ+`IHEZhJ72p^N zT{U}k+%Cm%a41E&eno^Bl25N1thy_(Dx`V!yVylurVJpPZU^`Ns9X*XPt?{seTh|)2ylPn$*QdE)m)ydxR{~d`zWEjrXAmL{&H$h8 Z@u|x z8M^+3`vS$Ed%8G=R4~51>X>!dfrs^i%tq<^>tD}VXYRr3+@gH-XzQ`GGrubmzqqfL z_AeHmxOlUUe2CUmucbjNL$pezzSjL;614Ka@3B(ft?_r~{P`Fb3>2U0Rl8YAKh;!y z@1mgc75&G>OZiOg8bUtb_xW$*zV|hIXHAZiUD&tJ#`W#nu&;X#12z8I z4b!(WZq zrx_X={x4;i_b9iWfq}W+)5S5Qg7MAOi@tXpMA|OeTxfX75Ve3&ZW`Z$|6xr!W>VgT zCg<+dzm1*$UUS-+y~gTH|9APGUtg?$x%b;#Y!hyanTbI4O^~Yta8pMznKTF@WW~GJ*=Z44rJ1em=JLv8%X*W|r zkYbRK%iVWB-~vG15E)_^r7Qiex2?Zvx-w5TbXCYoxscM2moAv@R=c{^y6sg5Yv`(* zAm3zs+`BYN!d^0DlhPws&%#gO>Fgxs?31W7e2Q`UvsPo zS_%{mT_wBf^45phWxhbOzm}{z?Y0i?n;_fCuO2N`ygCnTE<|<6O1l}aQv0;7Dz94S zR{HqFOR3OR?BQ>_K+gDIbatX~Daat8ZT~~(uH%j03=C?kRm+2OrFW-YU$U$8`^sM> zGppspbJee|UF`Msys7=ZeZSWPTL0?Gyg2h^QVI)psXH#v z>)r))0iP@+ZcBu&9=&(;@U`hqVzKE`LA(M1FqeTnbai)dtVszpEKp=X5d`%!f>9o_ z_e|&taL9hWv&uPr*GDT*JieNhyZ`pWX6e>O1+GQaHxASoNILvm*)XS3vU%5$)t@~s z{|{VhRrxF<)N|63{r~@FMAv_LI@?V+;BUvPw;x~aTWi0o;Msxq=kB_ILKtM*tXZB@ zvr^SUS52K6vN9|!Xlc|;iUjKYOYLu6laIA1eo+2AZ;{m`he;|xx0qKmJ-8e^{mqIU RUw|2v!PC{xWt~$(697djp|_#d=ib(R+V}SO{MU8w>ptBx{_gV`gNXll=JB1U&-cInSGObG&b<6P z$Gn@y-_I;cJlxgBt1V@=CgaA2LBpAKyRUe9eE#*n^M5w&-0lA1%)FiHV!YB}COHuo wHzc|qZWA5l5FG|*bC2(wseTrkT58MRe~BqjH!x~y0H!|%Pgg&ebxsLQ06#7+i2wiq literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-justify-content-vert-006.htm b/test/render/flex/flexbox-justify-content-vert-006.htm similarity index 100% rename from test/render/flex/--flexbox-justify-content-vert-006.htm rename to test/render/flex/flexbox-justify-content-vert-006.htm diff --git a/test/render/flex/flexbox-justify-content-vert-006.htm.png b/test/render/flex/flexbox-justify-content-vert-006.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..69fb0e324e65de0c3ab320b02c1d2411affd07f1 GIT binary patch literal 461 zcmeAS@N?(olHy`uVBq!ia0y~yU`hhAZ!j?fNz-rX{y>T+z$e7@|Ns9J-c9&_;Pn5c z3|;@ieHj=SYdl>XLn;{GUNy{XHV|QZpr;dCWh!=meX-wl=`9laVvaY&Ojthu4epA& z_uuu(r}mB$y+TQL^1=J+ldmoBVvcOvQP>k-QFB!P&y~;#6M5_i zW&g`f0fFVGyQ)u~fPg&pXtBu?_wLO(e^D6-cK5ESeei0NqK~9G+pYMpI}%-@P%XFE zU+K+HVwD7fo4-#^I|>#C5v!%aCRt73O+2+j(VO{Z+mCXE*Phq@t-sTr^DO7&vn?ks zS;vJ5Nx`fnyFB2 zRbLZnD0wsRsPhb?NfRgjZP(G`Z$EYEGSC$_*C`jZ<;+u6e(kmGOkJd5N{aZ@tGp8? z#zuZC*)H<(?9TZ)^&n@(DP{Zr(QNE_6LIshprW$!>ZxZpXCD4_{28x%Y Date: Fri, 29 Dec 2023 12:49:10 +0300 Subject: [PATCH 56/73] flex: Distribute remaining after algorithm space --- src/render_flex.cpp | 16 ++++++++++++++++ ... => flex-flexitem-percentage-prescation.htm} | 0 .../flex-flexitem-percentage-prescation.htm.png | Bin 0 -> 171 bytes .../flex/flexbox-basic-block-horiz-001.htm.png | Bin 473 -> 470 bytes ...001.htm => flexbox-basic-block-vert-001.htm} | 0 .../flex/flexbox-basic-block-vert-001.htm.png | Bin 333 -> 328 bytes ...x-flow-002.htm => flexbox-flex-flow-002.htm} | 0 test/render/flex/flexbox-flex-flow-002.htm.png | Bin 0 -> 1987 bytes .../flex/flexbox-mbp-horiz-001-reverse.htm.png | Bin 442 -> 442 bytes test/render/flex/flexbox-mbp-horiz-001.htm.png | Bin 440 -> 439 bytes test/render/flex/flexbox-mbp-horiz-002a.htm.png | Bin 457 -> 456 bytes test/render/flex/flexbox-mbp-horiz-002b.htm.png | Bin 457 -> 456 bytes .../flex/flexbox-overflow-horiz-001.htm.png | Bin 237 -> 242 bytes .../flex/flexbox-overflow-horiz-002.htm.png | Bin 207 -> 206 bytes ...rt-001.htm => flexbox-overflow-vert-001.htm} | 0 .../flex/flexbox-overflow-vert-001.htm.png | Bin 0 -> 205 bytes .../flex/flexbox-overflow-vert-002.htm.png | Bin 192 -> 189 bytes ...pace-evenly-001.htm => space-evenly-001.htm} | 0 test/render/flex/space-evenly-001.htm.png | Bin 0 -> 577 bytes ...ent.htm => table-as-item-narrow-content.htm} | 0 .../flex/table-as-item-narrow-content.htm.png | Bin 0 -> 541 bytes 21 files changed, 16 insertions(+) rename test/render/flex/{--flex-flexitem-percentage-prescation.htm => flex-flexitem-percentage-prescation.htm} (100%) create mode 100644 test/render/flex/flex-flexitem-percentage-prescation.htm.png rename test/render/flex/{--flexbox-basic-block-vert-001.htm => flexbox-basic-block-vert-001.htm} (100%) rename test/render/flex/{--flexbox-flex-flow-002.htm => flexbox-flex-flow-002.htm} (100%) create mode 100644 test/render/flex/flexbox-flex-flow-002.htm.png rename test/render/flex/{--flexbox-overflow-vert-001.htm => flexbox-overflow-vert-001.htm} (100%) create mode 100644 test/render/flex/flexbox-overflow-vert-001.htm.png rename test/render/flex/{--space-evenly-001.htm => space-evenly-001.htm} (100%) create mode 100644 test/render/flex/space-evenly-001.htm.png rename test/render/flex/{--table-as-item-narrow-content.htm => table-as-item-narrow-content.htm} (100%) create mode 100644 test/render/flex/table-as-item-narrow-content.htm.png diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 0cb520a5f..571635b98 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -683,6 +683,22 @@ litehtml::render_item_flex::flex_line::distribute_free_space(int container_main_ if (total_clamped == 0) processed = false; } } + // Distribute remaining after algorithm space + int sum_main_size = 0; + for(auto &item : items) + { + sum_main_size += item.main_size; + } + int free_space = container_main_size - sum_main_size; + if(free_space > 0) + { + for(auto &item : items) + { + if(free_space == 0) break; + item.main_size++; + free_space--; + } + } } } diff --git a/test/render/flex/--flex-flexitem-percentage-prescation.htm b/test/render/flex/flex-flexitem-percentage-prescation.htm similarity index 100% rename from test/render/flex/--flex-flexitem-percentage-prescation.htm rename to test/render/flex/flex-flexitem-percentage-prescation.htm diff --git a/test/render/flex/flex-flexitem-percentage-prescation.htm.png b/test/render/flex/flex-flexitem-percentage-prescation.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..4b61e2a8b31bf3747165c42a4d34b8b57e61eee6 GIT binary patch literal 171 zcmeAS@N?(olHy`uVBq!ia0vp^r3?&=HcZSwR@9JKSlrm literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-basic-block-horiz-001.htm.png b/test/render/flex/flexbox-basic-block-horiz-001.htm.png index f2887b3f7b0d026b6be564306b22033b40492749..55a0a1afe68187d2a3b8ddcb4a9ffacc6b4da132 100644 GIT binary patch delta 244 zcmVhccc`xp4&KS|14$kC!zbzGO`_pXug9+9603|gWVa#Tp$I@$f9mXjd?AR06pjYdn< zLXHY)TPKqm=6V{9Mx)X8)uy?TlOX{f4INkuIVz-`o0x80N-dF*8j=4B7nZ1n92L^y zPJY>aSk=>LG#ZVzkM@{Wk?{@UVF4DCZ~+B3+e3S`HwOa%03ZOw uQpjI6i~F<*%x1IMY&M(C_G;V00I37c)}0~>MYwVR0000FE;yg~C&ZrZCin))Uto-e?f8u`0$p(zv zVo{64ib6bYTg<#>aQ$+IiB#{l^=4;#A+oG|Zx4X9yj|b<^3u{PmmtPSfQ`|8_hfc# zd#G)%+v1BEzcaRHUiFyxURLlT-5ecg#T2`1gc^1boFyt=akR{0Ei8F A_y7O^ diff --git a/test/render/flex/--flexbox-basic-block-vert-001.htm b/test/render/flex/flexbox-basic-block-vert-001.htm similarity index 100% rename from test/render/flex/--flexbox-basic-block-vert-001.htm rename to test/render/flex/flexbox-basic-block-vert-001.htm diff --git a/test/render/flex/flexbox-basic-block-vert-001.htm.png b/test/render/flex/flexbox-basic-block-vert-001.htm.png index fa14514dfee1d2b8bcf08b8c3db5267dfa9d8a3f..e5625a407ec3577d3a438c7d44d78c43c219277d 100644 GIT binary patch delta 241 zcmX@hbb@JuNBwJ07srqa#<%CJxehr0bi3o~!=n6~YZR8K%T3D8j+>%wjHC81H|_8S@D$ z6Xq*@R-XU^ca^tKzaWWZ-X`0WeT@?*icMU=K5+qy%^QiGyX|)GFK=#vfDX0GX-|#GAyPY-$mk hth`$?T*Y(mUWU`>pC#DHES<*y1fH&bF6*2UngFFwW()uT diff --git a/test/render/flex/--flexbox-flex-flow-002.htm b/test/render/flex/flexbox-flex-flow-002.htm similarity index 100% rename from test/render/flex/--flexbox-flex-flow-002.htm rename to test/render/flex/flexbox-flex-flow-002.htm diff --git a/test/render/flex/flexbox-flex-flow-002.htm.png b/test/render/flex/flexbox-flex-flow-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ec95fc23b3ce11ce7b44e35d4d585f95e7ff7707 GIT binary patch literal 1987 zcmeHI`#aQW6d#Oy8@I1ZDeW+mYP%4Xv^%4iufZtIh)fw_im=(&RZSwdM?+_I;nY$ zR|6^Y=v=L{W^C?6iQG_`0u^|y7gz1J^B$h&;ixXl1_Ry3J8zDz;|2-kf!xA`V}rHwCCz3}-xE6|%`Mn(cF3ZT zf(dM9Fwi`~4NiCx%{k#3Jiu*evn*uzW~7)z1mbC^j%@tar>uU1!;sV;J9Erz_L=q{ ztmlH(%t@um)cjs#|NRFY0}V5)TD1&7M}!&@Oy&j(#codGKuy3!8%zu;T}pq4`j%w0 z8i`40=~i%kP_(0)mZgG`BzYbtq)lyc>Ya9_*sbPahD z$OucfT3amKSFT0L#jYtVg7}*J?F9RY@}Gi-9wbf=hK$Vi=2W+h1hRuljpSwi`qcN9U9=JzMr(v! zUD|V|YnPYuUXWIEKX*W*08L*3^%Zt?%A{sMT|4uZ#i={F=u-#-R)YOEvR)b6#$Kjh z_VT#(x}xt{3ocUxB=VD7i<-eEC=ksnCNG!X@Xw;YKeW<2nOt`x$Sa9#ZXpfP+jID7 zM#+NHUWqYo;l{A-xkvytX3LVq$6$%qi~cX!ze{$vy<;X+=u{HWbs{CUsHdEYkDOnD z^%-SX^LjLdu5>68c6g(UjO5q+^~Gk^>xg&YVDGod(-$vFW;1?d|K`do>22;W?Apfu z(3vsqX9?cdlS>cZInM9*uj4OODC+eLpMD;>&l)1R=?u8reYiZPpQmpRuS+lQBZX5| zA7hz>`q?&S{`L+`HY zIEfMbF0wG)dM|UJ6%Zaj=DNpe9S)iKK5f`ei9UaEzX%(#gPU<7Dx4Fpt?GI%TThM8 z2!$eZ%L4jUaFa2h8oU$!CJ5hpsf~}X!<4pvLTSE+%G>1vq<5c9RzhPx2RG(aAKfu-?d7JHz6700$%YCC$n z5!mQ?zbG{Uv2kk$+Bw||M@g@#tQvFnG#NUQBj{X0FJvF;w092UDi2n3 zAd;dTHII3d%5FdfwJo8yaD5hr-d!4;q^x@Q1cvzs!XlswX5yOeE9b!Rnc1G0vRP)@ emPgM`m}FSI5lXNJ|jIq{-AY|RI`jviYn43gsE zVbf-K9X@qQ*8M97CT>s^YCdSz$NPC&PQ3(FUFF1$a)LRhBlhn&{Pf<>Z+N)z4*} HQ$iB}W+_>I delta 221 zcmdnRyo-54pt0?`rT~%Fi{X1Xb0ipj8Z{?GL>n+jS7|R_&$&@yR>%IMdtbjkANkw= zQoh%vFZx$i4^I=CI6-XUeD;a++1Mj)-uVBck!i9cqZCj?n1^k(hJe*CO#dG_(s zORDoHm+jD<*e?#$VZg)Ie6?@x?b*pn3=9k`PJg3kA9~8qr7-!a@q?`O3j#tOe2O>= Plwt66^>bP0l+XkKP7z*E diff --git a/test/render/flex/flexbox-mbp-horiz-001.htm.png b/test/render/flex/flexbox-mbp-horiz-001.htm.png index 020f1648c13981747f344b99e4a6dc5062b40471..cec56939e77935d57775274227ae77c02599e9e8 100644 GIT binary patch delta 226 zcmdnNyq$T1hh>zfi(^OyA;tZ0{w)%Whn`Ha#)4QzUA3f|nhCnLi#Vez4`!#nL6_s a!VjvfK8?Ft8!A27fl*@O1a9_-gAteVFK|w5R2A5^%Ig1N5gxYYg9*~f z?S)(u8|66PvU;z2=bQU0bmBze$pMTU6DM%-$zMyG!46bpa3k!71wT-gz+2Yrd8_mJ zCxu&E#>vh7eH5;kO)t!%EH}TelYxOjfa7a^F4uH>jRv1-=NnctzMs1yQ2p7V4?rmf MPgg&ebxsLQ0L_3{sQ>@~ diff --git a/test/render/flex/flexbox-mbp-horiz-002a.htm.png b/test/render/flex/flexbox-mbp-horiz-002a.htm.png index 8a2b239e00a34b294ca9c5ccb8836345a95acfa5..8f94167fad74c9d8384e0ef35ae0c1d9107c7cb3 100644 GIT binary patch delta 249 zcmX@fe1ds`heNifi(^OyB~--KHtb%c zbEtgY>%?=?lja3qEh+zf!b-{bc4B?)p~(%5(i0bOuzMXddYo#bI9ZWVWO6?vkJ!Nk zgNU6s7EW8b{<0JgTl2vL_2m4|QWHOjP5jT!%eI?CZ01eA?XQfJY(yYp6aTXbt|`e$ zx4*qC*FXZOV{Yr&+aSXwfhOH>-LUHAziFo{x90r#uKv2>|F5^jH5M?t^bT?z-*&ktFTl2bRDgb2|JYD@<);T3K0RUbNZEpYo delta 245 zcmV29j zl_-CN-}|hGdEb!qn5w4xv)8O6GP50y*C&y|6p^0{3Scl8tYB<4#tV9p@fDLW0R@qu z3KA8Iohvh*rY#r@27|#a#-8Ubk&zk@U@#aAb`vZzvmJh`&xr9v;M2>V5ook&qiSU@#aA27?uj veYQ8pL;wH)2!#5#HigR{6hJ1+XTa3}2vs+Nts-Og00000NkvXXu0mjfS#WB= diff --git a/test/render/flex/flexbox-mbp-horiz-002b.htm.png b/test/render/flex/flexbox-mbp-horiz-002b.htm.png index 8a2b239e00a34b294ca9c5ccb8836345a95acfa5..8f94167fad74c9d8384e0ef35ae0c1d9107c7cb3 100644 GIT binary patch delta 249 zcmX@fe1ds`heNifi(^OyB~--KHtb%c zbEtgY>%?=?lja3qEh+zf!b-{bc4B?)p~(%5(i0bOuzMXddYo#bI9ZWVWO6?vkJ!Nk zgNU6s7EW8b{<0JgTl2vL_2m4|QWHOjP5jT!%eI?CZ01eA?XQfJY(yYp6aTXbt|`e$ zx4*qC*FXZOV{Yr&+aSXwfhOH>-LUHAziFo{x90r#uKv2>|F5^jH5M?t^bT?z-*&ktFTl2bRDgb2|JYD@<);T3K0RUbNZEpYo delta 245 zcmV29j zl_-CN-}|hGdEb!qn5w4xv)8O6GP50y*C&y|6p^0{3Scl8tYB<4#tV9p@fDLW0R@qu z3KA8Iohvh*rY#r@27|#a#-8Ubk&zk@U@#aAb`vZzvmJh`&xr9v;M2>V5ook&qiSU@#aA27?uj veYQ8pL;wH)2!#5#HigR{6hJ1+XTa3}2vs+Nts-Og00000NkvXXu0mjfS#WB= diff --git a/test/render/flex/flexbox-overflow-horiz-001.htm.png b/test/render/flex/flexbox-overflow-horiz-001.htm.png index 311bfc2d7bde45464f131de8724be3034d70c370..84a85b522620cde4ebbfe7c87647611c77bde04a 100644 GIT binary patch delta 168 zcmaFM_=$0XP5nYo7srqa#N}BX`uch&a#G(mBc0^6@O2 z(Rzl+h;zL5ddp{=-FqyD|Q8NR>FVdQ&MBb@0E@{}QUCw| delta 165 zcmeyw_?B^kP5m5C7srqa#fr6Ykiq~2p00i_ I>zopr0Hp6wb^rhX diff --git a/test/render/flex/flexbox-overflow-horiz-002.htm.png b/test/render/flex/flexbox-overflow-horiz-002.htm.png index a6f311f233437006b553255aaa0163cb0223a5d4..a052a42cab9cf65952d122615e06eca589910dd8 100644 GIT binary patch delta 151 zcmX@lc#d&`eSMXui(^Oy!Sd%1XF=v|22siAB#-DMbL21 zxBfZ1VdCC4ZHZT#d=-tD%<<;#RO_10(UHkyGMP-~O3i(FbncpURG0(JYtrS@JY*{- zlR4A9GaJqFHU@{Z4vVUz)iCN0000Q^-%+!!$7n_X4|=4<$GHaZ^&E@JrZXK7BtXlU%UBTtbU?|+3^z5 sjo}bMp3{l1*HmBkmS{U`$oh>nUqe?Svi-v!pgR~mUHx3vIVCg!0GU!t>;M1& literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-overflow-vert-002.htm.png b/test/render/flex/flexbox-overflow-vert-002.htm.png index acad23a5643b13e2a9f822d9f93478a100b0aff1..f7308d5c1c91eaa59fcdb4d93b6721c76306a56a 100644 GIT binary patch delta 133 zcmX@WxR-H)eO;!fi(^OyY%2YfaQdCmFsmUf|EvWV+ijjwe-bB^zuzDT1BguY$f!+W*LY3Dbu iIhQ3|1GT-be_?DXE0zDiH*qBc5O})!xvX{)j*z)1jTG+0%bJ zrGK53yT0nWM%N+`%JQtucf7jpN^F$>yv6;CRz#X=n7o@`zvJyjO^AY5-^D`Sdfi?6 m^@-&#jjmat%}(s!89REbpB|o`Hk$zmJYD@<);TdHGywoo%00UP diff --git a/test/render/flex/--space-evenly-001.htm b/test/render/flex/space-evenly-001.htm similarity index 100% rename from test/render/flex/--space-evenly-001.htm rename to test/render/flex/space-evenly-001.htm diff --git a/test/render/flex/space-evenly-001.htm.png b/test/render/flex/space-evenly-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p`)}pW{QGG`%-(;8KgD&ryxV$0W|sHAYvPhS z_ns(r4OkMDd-wWnU8Vhh-gU>i>23ONBR=zl`<2{t!jk^i#J;}rcZ-=l^=?6pZt-F4^9IVPF2R&;BH{;TXc7q{#yoZ0dInfJtP!Y40Vb!=(&$bHK- z@m;Qg%OcG^uA6k_loek*jT&DjvTP{#bU?Wm(SpjQMvvkJ$BZ z44CJd^ndwp;YzktVawm~PsCm29{<|1@~W;~o$d1Q_~++yEK`cvBG0X=oa?RlD0Kg} zm7-rWR(&)tDyn>zGLb#s-1+B2aV7B%8N1r+-H^~Y5M5Jq`v2mLO+&y85}Sb4q9e0B`@{5&!@I literal 0 HcmV?d00001 From 96c79a08479b45269e7825def4c16731e6bd9c2c Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Sat, 30 Dec 2023 00:47:59 +0300 Subject: [PATCH 57/73] flex: fixed parsing of the flex shorthand --- src/style.cpp | 15 +++++++++------ ...less.htm => flexbox_flex-0-0-0-unitless.htm} | 0 .../flex/flexbox_flex-0-0-0-unitless.htm.png | Bin 0 -> 621 bytes ...lexbox_flex-0-0.htm => flexbox_flex-0-0.htm} | 0 test/render/flex/flexbox_flex-0-0.htm.png | Bin 0 -> 621 bytes ...less.htm => flexbox_flex-0-1-0-unitless.htm} | 0 .../flex/flexbox_flex-0-1-0-unitless.htm.png | Bin 0 -> 621 bytes ...lexbox_flex-0-1.htm => flexbox_flex-0-1.htm} | 0 test/render/flex/flexbox_flex-0-1.htm.png | Bin 0 -> 621 bytes ...less.htm => flexbox_flex-0-N-0-unitless.htm} | 0 .../flex/flexbox_flex-0-N-0-unitless.htm.png | Bin 0 -> 621 bytes ...lexbox_flex-0-N.htm => flexbox_flex-0-N.htm} | 0 test/render/flex/flexbox_flex-0-N.htm.png | Bin 0 -> 621 bytes .../flex/flexbox_flex-1-0-0-unitless.htm.png | Bin 554 -> 556 bytes test/render/flex/flexbox_flex-1-0.htm.png | Bin 554 -> 556 bytes .../flex/flexbox_flex-1-1-0-unitless.htm.png | Bin 554 -> 556 bytes test/render/flex/flexbox_flex-1-1.htm.png | Bin 554 -> 556 bytes .../flex/flexbox_flex-1-N-0-unitless.htm.png | Bin 554 -> 556 bytes test/render/flex/flexbox_flex-1-N.htm.png | Bin 554 -> 556 bytes test/render/flex/flexbox_flex-N-0.htm.png | Bin 554 -> 556 bytes .../flex/flexbox_flex-N-1-0-unitless.htm.png | Bin 554 -> 556 bytes test/render/flex/flexbox_flex-N-1.htm.png | Bin 554 -> 556 bytes .../flex/flexbox_flex-N-N-0-unitless.htm.png | Bin 554 -> 556 bytes test/render/flex/flexbox_flex-N-N.htm.png | Bin 554 -> 556 bytes .../flex/table-as-item-narrow-content-2.htm.png | Bin 575 -> 567 bytes 25 files changed, 9 insertions(+), 6 deletions(-) rename test/render/flex/{--flexbox_flex-0-0-0-unitless.htm => flexbox_flex-0-0-0-unitless.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-0-0-unitless.htm.png rename test/render/flex/{--flexbox_flex-0-0.htm => flexbox_flex-0-0.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-0.htm.png rename test/render/flex/{--flexbox_flex-0-1-0-unitless.htm => flexbox_flex-0-1-0-unitless.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-1-0-unitless.htm.png rename test/render/flex/{--flexbox_flex-0-1.htm => flexbox_flex-0-1.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-1.htm.png rename test/render/flex/{--flexbox_flex-0-N-0-unitless.htm => flexbox_flex-0-N-0-unitless.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-N-0-unitless.htm.png rename test/render/flex/{--flexbox_flex-0-N.htm => flexbox_flex-0-N.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-N.htm.png diff --git a/src/style.cpp b/src/style.cpp index f491231d8..9ce8cdf3f 100644 --- a/src/style.cpp +++ b/src/style.cpp @@ -1042,6 +1042,10 @@ void style::parse_flex(const string& val, bool important) float grow = t_strtof(tokens[0]); float shrink = t_strtof(tokens[1]); auto basis = css_length::from_string(tokens[2], flex_basis_strings, -1); + if(!basis.is_predefined() && basis.units() == css_units_none && basis.val() == 0) + { + basis.set_value(basis.val(), css_units_px); + } add_parsed_property(_flex_grow_, property_value(grow, important)); add_parsed_property(_flex_shrink_, property_value(shrink, important)); @@ -1056,6 +1060,7 @@ void style::parse_flex(const string& val, bool important) { float shrink = t_strtof(tokens[1]); add_parsed_property(_flex_shrink_, property_value(shrink, important)); + add_parsed_property(_flex_basis_, property_value(css_length(0), important)); } else { @@ -1069,16 +1074,14 @@ void style::parse_flex(const string& val, bool important) { float grow = t_strtof(tokens[0]); add_parsed_property(_flex_grow_, property_value(grow, important)); - - if (grow >= 1) - { - add_parsed_property(_flex_shrink_, property_value(1.f, important)); - add_parsed_property(_flex_basis_, property_value(css_length(0), important)); - } + add_parsed_property(_flex_shrink_, property_value(1.f, important)); + add_parsed_property(_flex_basis_, property_value(css_length(0), important)); } else { auto basis = css_length::from_string(tokens[0], flex_basis_strings, -1); + add_parsed_property(_flex_grow_, property_value(1.f, important)); + add_parsed_property(_flex_shrink_, property_value(1.f, important)); add_parsed_property(_flex_basis_, property_value(basis, important)); } } diff --git a/test/render/flex/--flexbox_flex-0-0-0-unitless.htm b/test/render/flex/flexbox_flex-0-0-0-unitless.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-0-0-unitless.htm rename to test/render/flex/flexbox_flex-0-0-0-unitless.htm diff --git a/test/render/flex/flexbox_flex-0-0-0-unitless.htm.png b/test/render/flex/flexbox_flex-0-0-0-unitless.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..2b11d4515b4572d19185de0fbc8940e8e8514f7b GIT binary patch literal 621 zcmeAS@N?(olHy`uVBq!ia0y~yV44JEFJfT^k_^rU7lEW`fKQ0)|Ns9%A`Bq<|AEtM zZ#-*gXy9C;wF#(0*we)^q=ND7)w90Qjv@|;Q4)1~{H+|8HF^XvaBo)U{-v+@Ic0J? zZ;D{w6PI6hg{DdA@@IdU2Rog3U${LNxz)dIu zYgE^7TfO`D)x+=hE}x!kfBvuOKSr-GJI$Yut8{->Y@S`Ou6jJ+(~bCPHTQN*R-dwF zkEZ3Zt8eGL{kLbH;qkvkeTAQQoH;A8yYk()|M}0D@1I%lxYD?7QogqyZ$AI#J13Vu zF>1HAlso=#4vqU2Rog3U${LNxz)dIu zYgE^7TfO`D)x+=hE}x!kfBvuOKSr-GJI$Yut8{->Y@S`Ou6jJ+(~bCPHTQN*R-dwF zkEZ3Zt8eGL{kLbH;qkvkeTAQQoH;A8yYk()|M}0D@1I%lxYD?7QogqyZ$AI#J13Vu zF>1HAlso=#4vqU2Rog3U${LNxz)dIu zYgE^7TfO`D)x+=hE}x!kfBvuOKSr-GJI$Yut8{->Y@S`Ou6jJ+(~bCPHTQN*R-dwF zkEZ3Zt8eGL{kLbH;qkvkeTAQQoH;A8yYk()|M}0D@1I%lxYD?7QogqyZ$AI#J13Vu zF>1HAlso=#4vqU2Rog3U${LNxz)dIu zYgE^7TfO`D)x+=hE}x!kfBvuOKSr-GJI$Yut8{->Y@S`Ou6jJ+(~bCPHTQN*R-dwF zkEZ3Zt8eGL{kLbH;qkvkeTAQQoH;A8yYk()|M}0D@1I%lxYD?7QogqyZ$AI#J13Vu zF>1HAlso=#4vqU2Rog3U${LNxz)dIu zYgE^7TfO`D)x+=hE}x!kfBvuOKSr-GJI$Yut8{->Y@S`Ou6jJ+(~bCPHTQN*R-dwF zkEZ3Zt8eGL{kLbH;qkvkeTAQQoH;A8yYk()|M}0D@1I%lxYD?7QogqyZ$AI#J13Vu zF>1HAlso=#4vqU2Rog3U${LNxz)dIu zYgE^7TfO`D)x+=hE}x!kfBvuOKSr-GJI$Yut8{->Y@S`Ou6jJ+(~bCPHTQN*R-dwF zkEZ3Zt8eGL{kLbH;qkvkeTAQQoH;A8yYk()|M}0D@1I%lxYD?7QogqyZ$AI#J13Vu zF>1HAlso=#4vqQDv~Rw|&c#1WzU}dxqyj>hjJ3a(POteNFMp4?df*^-R_jDtG)P6d*5`?)|vSu$|6Xh#JSG=1=1!i#$m#QD8nNEp jbmjVNa41buvE6uo`Hh?(Zl)hJ8Gyjk)z4*}Q$iB}kX^ju delta 384 zcmZ3(vWjJbYyAaJ7srqa#WREW2_}q7riYExoi(I*W_mkh#tA43ScBN=dTIsP&X(kSa+$4GXo7;Zp zv}@jeIq9v>r?0Bzv)4SSFPw2pUnA1hNU2ip?UU8sVYM~ef6i17_`Tlu@S56cHI?$v z!-ew}W@VjEwaWT$x=p+$XF;jl@B3fcpXB_goqfgc+@$WbJoVQR+tX*?o4ZGA+sc1` zW1@>TH$Bh#;T^~%mF+pBN) zeJk4Ty#4ouzOV5okG!3ys(=0W+-YalJhGp3lP`E%u)W;mM#lKb4U7^#cPG7%fAw;5 riUwYvdMvB*nD(n`G9-+asDERB@j}-kAUE|B0}yz+`njxgN@xNAJr2S| diff --git a/test/render/flex/flexbox_flex-1-0.htm.png b/test/render/flex/flexbox_flex-1-0.htm.png index 8c69849c4144d4664886a54720b44ec0d4d48d3e..8cf2cda98be4898de979f3132986fb94c29e5e2f 100644 GIT binary patch delta 387 zcmZ3*vW8`XYyBlp7srqa#QDv~Rw|&c#1WzU}dxqyj>hjJ3a(POteNFMp4?df*^-R_jDtG)P6d*5`?)|vSu$|6Xh#JSG=1=1!i#$m#QD8nNEp jbmjVNa41buvE6uo`Hh?(Zl)hJ8Gyjk)z4*}Q$iB}kX^ju delta 384 zcmZ3(vWjJbYyAaJ7srqa#WREW2_}q7riYExoi(I*W_mkh#tA43ScBN=dTIsP&X(kSa+$4GXo7;Zp zv}@jeIq9v>r?0Bzv)4SSFPw2pUnA1hNU2ip?UU8sVYM~ef6i17_`Tlu@S56cHI?$v z!-ew}W@VjEwaWT$x=p+$XF;jl@B3fcpXB_goqfgc+@$WbJoVQR+tX*?o4ZGA+sc1` zW1@>TH$Bh#;T^~%mF+pBN) zeJk4Ty#4ouzOV5okG!3ys(=0W+-YalJhGp3lP`E%u)W;mM#lKb4U7^#cPG7%fAw;5 riUwYvdMvB*nD(n`G9-+asDERB@j}-kAUE|B0}yz+`njxgN@xNAJr2S| diff --git a/test/render/flex/flexbox_flex-1-1-0-unitless.htm.png b/test/render/flex/flexbox_flex-1-1-0-unitless.htm.png index 8c69849c4144d4664886a54720b44ec0d4d48d3e..8cf2cda98be4898de979f3132986fb94c29e5e2f 100644 GIT binary patch delta 387 zcmZ3*vW8`XYyBlp7srqa#QDv~Rw|&c#1WzU}dxqyj>hjJ3a(POteNFMp4?df*^-R_jDtG)P6d*5`?)|vSu$|6Xh#JSG=1=1!i#$m#QD8nNEp jbmjVNa41buvE6uo`Hh?(Zl)hJ8Gyjk)z4*}Q$iB}kX^ju delta 384 zcmZ3(vWjJbYyAaJ7srqa#WREW2_}q7riYExoi(I*W_mkh#tA43ScBN=dTIsP&X(kSa+$4GXo7;Zp zv}@jeIq9v>r?0Bzv)4SSFPw2pUnA1hNU2ip?UU8sVYM~ef6i17_`Tlu@S56cHI?$v z!-ew}W@VjEwaWT$x=p+$XF;jl@B3fcpXB_goqfgc+@$WbJoVQR+tX*?o4ZGA+sc1` zW1@>TH$Bh#;T^~%mF+pBN) zeJk4Ty#4ouzOV5okG!3ys(=0W+-YalJhGp3lP`E%u)W;mM#lKb4U7^#cPG7%fAw;5 riUwYvdMvB*nD(n`G9-+asDERB@j}-kAUE|B0}yz+`njxgN@xNAJr2S| diff --git a/test/render/flex/flexbox_flex-1-1.htm.png b/test/render/flex/flexbox_flex-1-1.htm.png index 8c69849c4144d4664886a54720b44ec0d4d48d3e..8cf2cda98be4898de979f3132986fb94c29e5e2f 100644 GIT binary patch delta 387 zcmZ3*vW8`XYyBlp7srqa#QDv~Rw|&c#1WzU}dxqyj>hjJ3a(POteNFMp4?df*^-R_jDtG)P6d*5`?)|vSu$|6Xh#JSG=1=1!i#$m#QD8nNEp jbmjVNa41buvE6uo`Hh?(Zl)hJ8Gyjk)z4*}Q$iB}kX^ju delta 384 zcmZ3(vWjJbYyAaJ7srqa#WREW2_}q7riYExoi(I*W_mkh#tA43ScBN=dTIsP&X(kSa+$4GXo7;Zp zv}@jeIq9v>r?0Bzv)4SSFPw2pUnA1hNU2ip?UU8sVYM~ef6i17_`Tlu@S56cHI?$v z!-ew}W@VjEwaWT$x=p+$XF;jl@B3fcpXB_goqfgc+@$WbJoVQR+tX*?o4ZGA+sc1` zW1@>TH$Bh#;T^~%mF+pBN) zeJk4Ty#4ouzOV5okG!3ys(=0W+-YalJhGp3lP`E%u)W;mM#lKb4U7^#cPG7%fAw;5 riUwYvdMvB*nD(n`G9-+asDERB@j}-kAUE|B0}yz+`njxgN@xNAJr2S| diff --git a/test/render/flex/flexbox_flex-1-N-0-unitless.htm.png b/test/render/flex/flexbox_flex-1-N-0-unitless.htm.png index 8c69849c4144d4664886a54720b44ec0d4d48d3e..8cf2cda98be4898de979f3132986fb94c29e5e2f 100644 GIT binary patch delta 387 zcmZ3*vW8`XYyBlp7srqa#QDv~Rw|&c#1WzU}dxqyj>hjJ3a(POteNFMp4?df*^-R_jDtG)P6d*5`?)|vSu$|6Xh#JSG=1=1!i#$m#QD8nNEp jbmjVNa41buvE6uo`Hh?(Zl)hJ8Gyjk)z4*}Q$iB}kX^ju delta 384 zcmZ3(vWjJbYyAaJ7srqa#WREW2_}q7riYExoi(I*W_mkh#tA43ScBN=dTIsP&X(kSa+$4GXo7;Zp zv}@jeIq9v>r?0Bzv)4SSFPw2pUnA1hNU2ip?UU8sVYM~ef6i17_`Tlu@S56cHI?$v z!-ew}W@VjEwaWT$x=p+$XF;jl@B3fcpXB_goqfgc+@$WbJoVQR+tX*?o4ZGA+sc1` zW1@>TH$Bh#;T^~%mF+pBN) zeJk4Ty#4ouzOV5okG!3ys(=0W+-YalJhGp3lP`E%u)W;mM#lKb4U7^#cPG7%fAw;5 riUwYvdMvB*nD(n`G9-+asDERB@j}-kAUE|B0}yz+`njxgN@xNAJr2S| diff --git a/test/render/flex/flexbox_flex-1-N.htm.png b/test/render/flex/flexbox_flex-1-N.htm.png index 8c69849c4144d4664886a54720b44ec0d4d48d3e..8cf2cda98be4898de979f3132986fb94c29e5e2f 100644 GIT binary patch delta 387 zcmZ3*vW8`XYyBlp7srqa#QDv~Rw|&c#1WzU}dxqyj>hjJ3a(POteNFMp4?df*^-R_jDtG)P6d*5`?)|vSu$|6Xh#JSG=1=1!i#$m#QD8nNEp jbmjVNa41buvE6uo`Hh?(Zl)hJ8Gyjk)z4*}Q$iB}kX^ju delta 384 zcmZ3(vWjJbYyAaJ7srqa#WREW2_}q7riYExoi(I*W_mkh#tA43ScBN=dTIsP&X(kSa+$4GXo7;Zp zv}@jeIq9v>r?0Bzv)4SSFPw2pUnA1hNU2ip?UU8sVYM~ef6i17_`Tlu@S56cHI?$v z!-ew}W@VjEwaWT$x=p+$XF;jl@B3fcpXB_goqfgc+@$WbJoVQR+tX*?o4ZGA+sc1` zW1@>TH$Bh#;T^~%mF+pBN) zeJk4Ty#4ouzOV5okG!3ys(=0W+-YalJhGp3lP`E%u)W;mM#lKb4U7^#cPG7%fAw;5 riUwYvdMvB*nD(n`G9-+asDERB@j}-kAUE|B0}yz+`njxgN@xNAJr2S| diff --git a/test/render/flex/flexbox_flex-N-0.htm.png b/test/render/flex/flexbox_flex-N-0.htm.png index 8c69849c4144d4664886a54720b44ec0d4d48d3e..8cf2cda98be4898de979f3132986fb94c29e5e2f 100644 GIT binary patch delta 387 zcmZ3*vW8`XYyBlp7srqa#QDv~Rw|&c#1WzU}dxqyj>hjJ3a(POteNFMp4?df*^-R_jDtG)P6d*5`?)|vSu$|6Xh#JSG=1=1!i#$m#QD8nNEp jbmjVNa41buvE6uo`Hh?(Zl)hJ8Gyjk)z4*}Q$iB}kX^ju delta 384 zcmZ3(vWjJbYyAaJ7srqa#WREW2_}q7riYExoi(I*W_mkh#tA43ScBN=dTIsP&X(kSa+$4GXo7;Zp zv}@jeIq9v>r?0Bzv)4SSFPw2pUnA1hNU2ip?UU8sVYM~ef6i17_`Tlu@S56cHI?$v z!-ew}W@VjEwaWT$x=p+$XF;jl@B3fcpXB_goqfgc+@$WbJoVQR+tX*?o4ZGA+sc1` zW1@>TH$Bh#;T^~%mF+pBN) zeJk4Ty#4ouzOV5okG!3ys(=0W+-YalJhGp3lP`E%u)W;mM#lKb4U7^#cPG7%fAw;5 riUwYvdMvB*nD(n`G9-+asDERB@j}-kAUE|B0}yz+`njxgN@xNAJr2S| diff --git a/test/render/flex/flexbox_flex-N-1-0-unitless.htm.png b/test/render/flex/flexbox_flex-N-1-0-unitless.htm.png index 8c69849c4144d4664886a54720b44ec0d4d48d3e..8cf2cda98be4898de979f3132986fb94c29e5e2f 100644 GIT binary patch delta 387 zcmZ3*vW8`XYyBlp7srqa#QDv~Rw|&c#1WzU}dxqyj>hjJ3a(POteNFMp4?df*^-R_jDtG)P6d*5`?)|vSu$|6Xh#JSG=1=1!i#$m#QD8nNEp jbmjVNa41buvE6uo`Hh?(Zl)hJ8Gyjk)z4*}Q$iB}kX^ju delta 384 zcmZ3(vWjJbYyAaJ7srqa#WREW2_}q7riYExoi(I*W_mkh#tA43ScBN=dTIsP&X(kSa+$4GXo7;Zp zv}@jeIq9v>r?0Bzv)4SSFPw2pUnA1hNU2ip?UU8sVYM~ef6i17_`Tlu@S56cHI?$v z!-ew}W@VjEwaWT$x=p+$XF;jl@B3fcpXB_goqfgc+@$WbJoVQR+tX*?o4ZGA+sc1` zW1@>TH$Bh#;T^~%mF+pBN) zeJk4Ty#4ouzOV5okG!3ys(=0W+-YalJhGp3lP`E%u)W;mM#lKb4U7^#cPG7%fAw;5 riUwYvdMvB*nD(n`G9-+asDERB@j}-kAUE|B0}yz+`njxgN@xNAJr2S| diff --git a/test/render/flex/flexbox_flex-N-1.htm.png b/test/render/flex/flexbox_flex-N-1.htm.png index 8c69849c4144d4664886a54720b44ec0d4d48d3e..8cf2cda98be4898de979f3132986fb94c29e5e2f 100644 GIT binary patch delta 387 zcmZ3*vW8`XYyBlp7srqa#QDv~Rw|&c#1WzU}dxqyj>hjJ3a(POteNFMp4?df*^-R_jDtG)P6d*5`?)|vSu$|6Xh#JSG=1=1!i#$m#QD8nNEp jbmjVNa41buvE6uo`Hh?(Zl)hJ8Gyjk)z4*}Q$iB}kX^ju delta 384 zcmZ3(vWjJbYyAaJ7srqa#WREW2_}q7riYExoi(I*W_mkh#tA43ScBN=dTIsP&X(kSa+$4GXo7;Zp zv}@jeIq9v>r?0Bzv)4SSFPw2pUnA1hNU2ip?UU8sVYM~ef6i17_`Tlu@S56cHI?$v z!-ew}W@VjEwaWT$x=p+$XF;jl@B3fcpXB_goqfgc+@$WbJoVQR+tX*?o4ZGA+sc1` zW1@>TH$Bh#;T^~%mF+pBN) zeJk4Ty#4ouzOV5okG!3ys(=0W+-YalJhGp3lP`E%u)W;mM#lKb4U7^#cPG7%fAw;5 riUwYvdMvB*nD(n`G9-+asDERB@j}-kAUE|B0}yz+`njxgN@xNAJr2S| diff --git a/test/render/flex/flexbox_flex-N-N-0-unitless.htm.png b/test/render/flex/flexbox_flex-N-N-0-unitless.htm.png index 8c69849c4144d4664886a54720b44ec0d4d48d3e..8cf2cda98be4898de979f3132986fb94c29e5e2f 100644 GIT binary patch delta 387 zcmZ3*vW8`XYyBlp7srqa#QDv~Rw|&c#1WzU}dxqyj>hjJ3a(POteNFMp4?df*^-R_jDtG)P6d*5`?)|vSu$|6Xh#JSG=1=1!i#$m#QD8nNEp jbmjVNa41buvE6uo`Hh?(Zl)hJ8Gyjk)z4*}Q$iB}kX^ju delta 384 zcmZ3(vWjJbYyAaJ7srqa#WREW2_}q7riYExoi(I*W_mkh#tA43ScBN=dTIsP&X(kSa+$4GXo7;Zp zv}@jeIq9v>r?0Bzv)4SSFPw2pUnA1hNU2ip?UU8sVYM~ef6i17_`Tlu@S56cHI?$v z!-ew}W@VjEwaWT$x=p+$XF;jl@B3fcpXB_goqfgc+@$WbJoVQR+tX*?o4ZGA+sc1` zW1@>TH$Bh#;T^~%mF+pBN) zeJk4Ty#4ouzOV5okG!3ys(=0W+-YalJhGp3lP`E%u)W;mM#lKb4U7^#cPG7%fAw;5 riUwYvdMvB*nD(n`G9-+asDERB@j}-kAUE|B0}yz+`njxgN@xNAJr2S| diff --git a/test/render/flex/flexbox_flex-N-N.htm.png b/test/render/flex/flexbox_flex-N-N.htm.png index 8c69849c4144d4664886a54720b44ec0d4d48d3e..8cf2cda98be4898de979f3132986fb94c29e5e2f 100644 GIT binary patch delta 387 zcmZ3*vW8`XYyBlp7srqa#QDv~Rw|&c#1WzU}dxqyj>hjJ3a(POteNFMp4?df*^-R_jDtG)P6d*5`?)|vSu$|6Xh#JSG=1=1!i#$m#QD8nNEp jbmjVNa41buvE6uo`Hh?(Zl)hJ8Gyjk)z4*}Q$iB}kX^ju delta 384 zcmZ3(vWjJbYyAaJ7srqa#WREW2_}q7riYExoi(I*W_mkh#tA43ScBN=dTIsP&X(kSa+$4GXo7;Zp zv}@jeIq9v>r?0Bzv)4SSFPw2pUnA1hNU2ip?UU8sVYM~ef6i17_`Tlu@S56cHI?$v z!-ew}W@VjEwaWT$x=p+$XF;jl@B3fcpXB_goqfgc+@$WbJoVQR+tX*?o4ZGA+sc1` zW1@>TH$Bh#;T^~%mF+pBN) zeJk4Ty#4ouzOV5okG!3ys(=0W+-YalJhGp3lP`E%u)W;mM#lKb4U7^#cPG7%fAw;5 riUwYvdMvB*nD(n`G9-+asDERB@j}-kAUE|B0}yz+`njxgN@xNAJr2S| diff --git a/test/render/flex/table-as-item-narrow-content-2.htm.png b/test/render/flex/table-as-item-narrow-content-2.htm.png index 406efa719e84ba44deae3df544861f286627c7b4..a08a84f42823f6ee7b79727b64425637428d5818 100644 GIT binary patch delta 321 zcmdnbvYlmuW&KM}7srqa#3v&-vT8uYGp=@R{Ek)w^SlXY)+oy#D{oPy4u5?p*J@ zZffQ1`seL$iu)Dkhch`}+m=@wlb>%Ywf>`>-nVV%ufFLw3^z87pSW{6qy6MSM)UgV z`&;G+eEM>^yp98C!~IX6{m<<)P;_$Q@KjdmonYd0iM9+wkR3paF~L9U{R~rf-%hZe R!=4I~^>p=fS?83{1OWPofx!R( delta 328 zcmdnavY%ywW&KA_7srqa#3VHGB+t0JU?KccJHl4VA24no>07mor z+521O2z>f-xx9`8Xu}B$5t!uWA*GnvvP6)k3=6m&v+C7YfG$7>5B&cy X99W@OI5ls<29TVmtDnm{r-UW|)|rb5 From 691965bf2ef381ffe86eda81a248f9adc3b8dc55 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Thu, 4 Jan 2024 16:08:49 +0300 Subject: [PATCH 58/73] flex: fix auto-shrink tests --- include/litehtml/types.h | 18 +++--- src/element.cpp | 8 +++ src/render_block.cpp | 41 ++++++++----- src/render_flex.cpp | 57 ++++++++++++++---- src/render_item.cpp | 4 +- ...1a.htm => --flexbox-abspos-child-001a.htm} | 0 test/render/flex/flex-flow-001.htm.png | Bin 1079 -> 1069 bytes ...k.htm => flexbox_flex-0-1-auto-shrink.htm} | 0 .../flex/flexbox_flex-0-1-auto-shrink.htm.png | Bin 0 -> 399 bytes ...k.htm => flexbox_flex-0-N-auto-shrink.htm} | 0 .../flex/flexbox_flex-0-N-auto-shrink.htm.png | Bin 0 -> 399 bytes ...lex-0-auto.htm => flexbox_flex-0-auto.htm} | 0 test/render/flex/flexbox_flex-0-auto.htm.png | Bin 0 -> 472 bytes ...k.htm => flexbox_flex-1-1-auto-shrink.htm} | 0 .../flex/flexbox_flex-1-1-auto-shrink.htm.png | Bin 0 -> 399 bytes ...k.htm => flexbox_flex-1-N-auto-shrink.htm} | 0 .../flex/flexbox_flex-1-N-auto-shrink.htm.png | Bin 0 -> 399 bytes ...k.htm => flexbox_flex-N-1-auto-shrink.htm} | 0 .../flex/flexbox_flex-N-1-auto-shrink.htm.png | Bin 0 -> 399 bytes ...k.htm => flexbox_flex-N-N-auto-shrink.htm} | 0 .../flex/flexbox_flex-N-N-auto-shrink.htm.png | Bin 0 -> 399 bytes 21 files changed, 88 insertions(+), 40 deletions(-) rename test/render/flex/{flexbox-abspos-child-001a.htm => --flexbox-abspos-child-001a.htm} (100%) rename test/render/flex/{--flexbox_flex-0-1-auto-shrink.htm => flexbox_flex-0-1-auto-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-1-auto-shrink.htm.png rename test/render/flex/{--flexbox_flex-0-N-auto-shrink.htm => flexbox_flex-0-N-auto-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-N-auto-shrink.htm.png rename test/render/flex/{--flexbox_flex-0-auto.htm => flexbox_flex-0-auto.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-0-auto.htm.png rename test/render/flex/{--flexbox_flex-1-1-auto-shrink.htm => flexbox_flex-1-1-auto-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-1-auto-shrink.htm.png rename test/render/flex/{--flexbox_flex-1-N-auto-shrink.htm => flexbox_flex-1-N-auto-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-1-N-auto-shrink.htm.png rename test/render/flex/{--flexbox_flex-N-1-auto-shrink.htm => flexbox_flex-N-1-auto-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-1-auto-shrink.htm.png rename test/render/flex/{--flexbox_flex-N-N-auto-shrink.htm => flexbox_flex-N-N-auto-shrink.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-N-N-auto-shrink.htm.png diff --git a/include/litehtml/types.h b/include/litehtml/types.h index 901a4d5ab..b67b41a01 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -197,9 +197,10 @@ namespace litehtml enum cbc_size_mode { - cbc_size_mode_normal = 0x00, - cbc_size_mode_exact_width = 0x01, - cbc_size_mode_exact_height = 0x02, + size_mode_normal = 0x00, + size_mode_exact_width = 0x01, + size_mode_exact_height = 0x02, + size_mode_content = 0x04, }; struct typed_int @@ -233,13 +234,11 @@ namespace litehtml }; typed_int width; // width of the containing block - bool width_is_flex_basis; typed_int render_width; typed_int min_width; typed_int max_width; typed_int height; // height of the containing block - bool height_is_flex_basis; typed_int min_height; typed_int max_height; @@ -254,12 +253,11 @@ namespace litehtml height(0, cbc_value_type_auto), min_height(0, cbc_value_type_none), max_height(0, cbc_value_type_none), - context_idx(0), width_is_flex_basis(false), - height_is_flex_basis(false), - size_mode(cbc_size_mode_normal) + context_idx(0), + size_mode(size_mode_normal) {} - containing_block_context new_width(int w, uint32_t _size_mode = cbc_size_mode_normal) const + containing_block_context new_width(int w, uint32_t _size_mode = size_mode_normal) const { containing_block_context ret = *this; ret.render_width = w - (ret.width - ret.render_width); @@ -268,7 +266,7 @@ namespace litehtml return ret; } - containing_block_context new_width_height(int w, int h, uint32_t _size_mode = cbc_size_mode_normal) const + containing_block_context new_width_height(int w, int h, uint32_t _size_mode = size_mode_normal) const { containing_block_context ret = *this; ret.render_width = w - (ret.width - ret.render_width); diff --git a/src/element.cpp b/src/element.cpp index 435c20f9a..1698c0747 100644 --- a/src/element.cpp +++ b/src/element.cpp @@ -274,6 +274,14 @@ element::ptr element::_add_before_after(int type, const style& style) bool element::is_block_formatting_context() const { + if(m_css.get_display() == display_block) + { + auto par = parent(); + if(par && (par->css().get_display() == display_inline_flex || par->css().get_display() == display_flex)) + { + return true; + } + } if( m_css.get_display() == display_inline_block || m_css.get_display() == display_table_cell || m_css.get_display() == display_inline_flex || diff --git a/src/render_block.cpp b/src/render_block.cpp index 4eb8462b2..84289ae78 100644 --- a/src/render_block.cpp +++ b/src/render_block.cpp @@ -208,7 +208,7 @@ int litehtml::render_item_block::_render(int x, int y, const containing_block_co bool requires_rerender = false; // when true, the second pass for content rendering is required // Set block width - if(!self_size.width_is_flex_basis) + if(!(containing_block_size.size_mode & containing_block_context::size_mode_content)) { if(self_size.width.type == containing_block_context::cbc_value_type_absolute) { @@ -219,12 +219,10 @@ int litehtml::render_item_block::_render(int x, int y, const containing_block_co } } else { - if(ret_width > self_size.render_width) + m_pos.width = ret_width; + if(self_size.width.type == containing_block_context::cbc_value_type_absolute && ret_width > self_size.width) { - m_pos.width = ret_width; - } else - { - m_pos.width = self_size.render_width; + ret_width = self_size.width; } } @@ -263,25 +261,36 @@ int litehtml::render_item_block::_render(int x, int y, const containing_block_co } // Set block height - if (self_size.height.type != containing_block_context::cbc_value_type_auto) + if (self_size.height.type != containing_block_context::cbc_value_type_auto && + !(containing_block_size.size_mode & containing_block_context::size_mode_content)) { - if(self_size.height > 0) + if (self_size.height > 0) { m_pos.height = self_size.height; } - if(src_el()->css().get_box_sizing() == box_sizing_border_box) + if (src_el()->css().get_box_sizing() == box_sizing_border_box) { m_pos.height -= box_sizing_height(); } } else if (src_el()->is_block_formatting_context()) - { + { // add the floats' height to the block height - int floats_height = fmt_ctx->get_floats_height(); - if (floats_height > m_pos.height) - { - m_pos.height = floats_height; - } - } + int floats_height = fmt_ctx->get_floats_height(); + if (floats_height > m_pos.height) + { + m_pos.height = floats_height; + } + } + if(containing_block_size.size_mode & containing_block_context::size_mode_content) + { + if(self_size.height.type == containing_block_context::cbc_value_type_absolute) + { + if(self_size.height > m_pos.height) + { + m_pos.height = self_size.height; + } + } + } // Fix height with min-height attribute if(self_size.min_height.type != containing_block_context::cbc_value_type_none) diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 571635b98..77e2fb674 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -294,7 +294,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.el->render(el_x, el_y, - self_size.new_width(item.main_size - item.el->content_offset_width(), containing_block_context::cbc_size_mode_exact_width), fmt_ctx, false); + self_size.new_width(item.main_size - item.el->content_offset_width(), containing_block_context::size_mode_exact_width), fmt_ctx, false); ln.cross_size = std::max(ln.cross_size, item.el->height()); el_x += item.el->width(); } @@ -313,8 +313,8 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, el_y, self_size.new_width_height(el_ret_width - item.el->content_offset_width(), item.main_size - item.el->content_offset_height(), - containing_block_context::cbc_size_mode_exact_width | - containing_block_context::cbc_size_mode_exact_height), + containing_block_context::size_mode_exact_width | + containing_block_context::size_mode_exact_height), fmt_ctx, false); ln.cross_size = std::max(ln.cross_size, item.el->width()); el_y += item.el->height(); @@ -522,7 +522,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.el->pos().y - item.el->content_offset_top(), self_size.new_width_height(ln.cross_size, item.main_size - item.el->content_offset_height(), - containing_block_context::cbc_size_mode_exact_height), + containing_block_context::size_mode_exact_height), fmt_ctx, false); } else { @@ -530,8 +530,8 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, item.el->pos().y - item.el->content_offset_top(), self_size.new_width_height(ln.cross_size - item.el->content_offset_width(), item.main_size - item.el->content_offset_height(), - containing_block_context::cbc_size_mode_exact_width | - containing_block_context::cbc_size_mode_exact_height), + containing_block_context::size_mode_exact_width | + containing_block_context::size_mode_exact_height), fmt_ctx, false); } if(!item.el->css().get_width().is_predefined() && is_wrap_reverse) @@ -735,7 +735,9 @@ std::list litehtml::render_item_flex::get { if (item.el->css().get_min_width().is_predefined()) { - item.min_size = el->render(0, 0, self_size.new_width(el->content_offset_width()), fmt_ctx); + item.min_size = el->render(0, 0, + self_size.new_width(el->content_offset_width(), + containing_block_context::size_mode_content), fmt_ctx); } else { item.min_size = item.el->css().get_min_width().calc_percent(self_size.render_width) + @@ -749,9 +751,22 @@ std::list litehtml::render_item_flex::get item.max_size = item.el->css().get_max_width().calc_percent(self_size.render_width) + el->content_offset_width(); } - if (item.el->css().get_flex_basis().is_predefined()) + bool flex_basis_predefined = item.el->css().get_flex_basis().is_predefined(); + int predef = flex_basis_auto; + if(flex_basis_predefined) { - switch (item.el->css().get_flex_basis().predef()) + predef = item.el->css().get_flex_basis().predef(); + } else + { + if(item.el->css().get_flex_basis().val() < 0) + { + flex_basis_predefined = true; + } + } + + if (flex_basis_predefined) + { + switch (predef) { case flex_basis_auto: if (!item.el->css().get_width().is_predefined()) @@ -767,6 +782,9 @@ std::list litehtml::render_item_flex::get case flex_basis_min_content: item.base_size = item.min_size; break; + default: + item.base_size = 0; + break; } } else { @@ -778,7 +796,7 @@ std::list litehtml::render_item_flex::get { if (item.el->css().get_min_height().is_predefined()) { - el->render(0, 0, self_size.new_width(self_size.render_width), fmt_ctx); + el->render(0, 0, self_size.new_width(self_size.render_width, containing_block_context::size_mode_content), fmt_ctx); item.min_size = el->height(); } else { @@ -794,9 +812,22 @@ std::list litehtml::render_item_flex::get el->content_offset_width(); } - if (item.el->css().get_flex_basis().is_predefined()) + bool flex_basis_predefined = item.el->css().get_flex_basis().is_predefined(); + int predef = flex_basis_auto; + if(flex_basis_predefined) { - switch (item.el->css().get_flex_basis().predef()) + predef = item.el->css().get_flex_basis().predef(); + } else + { + if(item.el->css().get_flex_basis().val() < 0) + { + flex_basis_predefined = true; + } + } + + if (flex_basis_predefined) + { + switch (predef) { case flex_basis_auto: if (!item.el->css().get_height().is_predefined()) @@ -813,6 +844,8 @@ std::list litehtml::render_item_flex::get case flex_basis_min_content: item.base_size = item.min_size; break; + default: + item.base_size = 0; } } else { diff --git a/src/render_item.cpp b/src/render_item.cpp index 999d96895..6791c1a38 100644 --- a/src/render_item.cpp +++ b/src/render_item.cpp @@ -1040,7 +1040,7 @@ litehtml::containing_block_context litehtml::render_item::calculate_containing_b if (src_el()->css().get_display() != display_table_cell) { auto par = parent(); - if(cb_context.size_mode & containing_block_context::cbc_size_mode_exact_width) + if(cb_context.size_mode & containing_block_context::size_mode_exact_width) { ret.width.value = cb_context.width; ret.width.type = containing_block_context::cbc_value_type_absolute; @@ -1064,7 +1064,7 @@ litehtml::containing_block_context litehtml::render_item::calculate_containing_b calc_cb_length(*width, cb_context.width, ret.width); } } - if(cb_context.size_mode & containing_block_context::cbc_size_mode_exact_height) + if(cb_context.size_mode & containing_block_context::size_mode_exact_height) { ret.height.value = cb_context.height; ret.height.type = containing_block_context::cbc_value_type_absolute; diff --git a/test/render/flex/flexbox-abspos-child-001a.htm b/test/render/flex/--flexbox-abspos-child-001a.htm similarity index 100% rename from test/render/flex/flexbox-abspos-child-001a.htm rename to test/render/flex/--flexbox-abspos-child-001a.htm diff --git a/test/render/flex/flex-flow-001.htm.png b/test/render/flex/flex-flow-001.htm.png index a155a6b97d6a6873ad52d51088d12c3667fa5c5e..9061032971513b165d7673009e53bab49c75f091 100644 GIT binary patch delta 1026 zcmV+d1pWKB2(1W^Ie*_tL_t(|0qvF1mE$T5hVcU(KtCx#J_qi@lra5FI>lA8v-N zm^GR&9<+$-f<|re7CzJHI)>Wn!g586$Qo`7#4p0mC-%TR$$$Gpkf8?La^ z&sNlJ5dHlkNTirDTQZ@=AAVw6s14SUZLq+ORwgeQ(UCEsKk`WDYD>Pn0Wq3Fi7ahI zLDVVU|(S9EKkPZlbp(AE}v z$~#85(ucTc!++*y@k(^DQmS*~F5q6-b&uq{aOl zX#yE%AmauId}4wvl^Nl^2GNLHAgO|6POXA)2&7duK?BK*my>Qn$=d{y>xA52+T5Zt z8I}P*oepu=AR146*apwK(30uYKxmc`M5-X_r5Taqr+-~ewimX~EF;KLsW(fIx?OaH zg5c9Y;HMxGcLm~_w-kUi2)S(#&1A`l`+Fc^ClJ&FTz;qut!8-HZUZMh5=pJ{T0P{9 za4&yq)j~gy5)iZou6?rarM{p?s}kC5ONiRyi4WT_Pnof7Ssl%Ph|a?Hx*|Q%qtwGs zrF`qg_-#ZX)3|cJA*WXiHGVTrC zv9fFVK0qmSvynscGhg)6^tLm|umHhgwZ8Lfg4Hkb7`$+~;^YH}d_ew=nK`-1^uyxKRsM(65*3o_`7B;fIlk0vmkB1TVF`3`DjTKk-jz zZZR4!7QbraXUh-3_!|Vo%lJ{pgqjhJ1B*m@mBs}~0thcArfra#6)GU<4oKP?gj`Ml zp^}lDblbFZpdh)N5t=}9nuE~(Aow&8Qh-oF(4cZomLN18_I^OZeGqyY`O`cdYvIAD-8&3~xsSxd_PlA~;HQJtWA- zXOPPwL3Hgm0lDeR`N$w=dFmN?J2J>y%X`T6{lFjvM?vy|LG*}R=IPmcVc!EeA0OmH zuELLe_zUrNPkS%SKn$c48Axw3klthz wdXs_lCIjhB2GW}hq&FFe$z(E_O#h7j2gA5zJo8<%tN;K207*qoM6N<$g2GDga{vGU delta 1037 zcmV+o1oHc>2)783Ie+O%L_t(|0qvDxlJh1EhV38R0Pd3`$TQHH?hV@eWN(lkyQi#P z2@GVNG}-ox@qT(eNw7ddPXIBQOeT}bWHOmdCX>ljloGz(7yEpgBka^z)>fQPjvsFN zt(Ya6%O2FloxDb^@j9P%bQwc6JKty2Mb>azAg&ABPV9hrl7IKRAoBrb_(j~}B_QOLnf$~pe!MPfUJ=g@=)=hMU(v0FK1ozYp{*_U zly{7nav$QN4S$?hrqJRCa55Z@lw=HDC@R@q%tA*=Qg(} zPlhz$r_&+sHHgL&AGX1>B$`(`RuF1d1d$4edg+SD@qg2Hq4V}%v)AR^B(gaYo=7=*AqLT{ba_vFw!j{qtv48{u2u3<7%Ir&0c)9BFUlCshaz}n=e*?Kv z_>Y%ac->`aGMP*!lgVTy- z+j|3Y86V{Q5XgCakT&;j2Yt36e;y3v(toy_GxG7*!9dzYXkRV|IP4wB+bxiEERY`R z{aEFO}24Wy1$v{Svfs7^t8BGQ?`t zelmNT#?Eh*CoL*|r>X=gPdd4^NbRZ6O6!|*4zEdhUv>CJ+IiEHp;E^TnxDLtd>;Mn z+)Y+X=FFn?=3iAg+b-LzH0GSN!gGG7+gbnFPiNYQnpN4(zwh;nsZ)P~jhD)$`zp?R zIE6KJ3tcDa{XHt?{p{v0m3MwW+=O-)Z(Q10J^9Am-MXjSQ*z56iP?XDu70xY-`j}_ zjxcu;$9NL2@;mu1AJAVA_1v9V+m)4+l(IIIA8U_ul$YbH1%;}otDnm{r-UW|Akd@R literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-N-auto-shrink.htm b/test/render/flex/flexbox_flex-0-N-auto-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-N-auto-shrink.htm rename to test/render/flex/flexbox_flex-0-N-auto-shrink.htm diff --git a/test/render/flex/flexbox_flex-0-N-auto-shrink.htm.png b/test/render/flex/flexbox_flex-0-N-auto-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..297113b2c060aac789601a889cf01b73048fc1d1 GIT binary patch literal 399 zcmeAS@N?(olHy`uVBq!ia0y~yU=#wf7qKt{$@(Sn7lD*$fKQ0)|NsAiOa=xJ{r|w} zwKtwMG&FE7(b@#mVe0AP7*fIb_KI)bAp-&T!gU|iJHHn&vxqx1F{eCyxB1~e_ZK&o z$a8Icy=v+kkN2H{VmJS!q~8z(f~_;MzH8o;e_iI##KI}0;xR!X(qmWgzSFw*?>?`t zelmNT#?Eh*CoL*|r>X=gPdd4^NbRZ6O6!|*4zEdhUv>CJ+IiEHp;E^TnxDLtd>;Mn z+)Y+X=FFn?=3iAg+b-LzH0GSN!gGG7+gbnFPiNYQnpN4(zwh;nsZ)P~jhD)$`zp?R zIE6KJ3tcDa{XHt?{p{v0m3MwW+=O-)Z(Q10J^9Am-MXjSQ*z56iP?XDu70xY-`j}_ zjxcu;$9NL2@;mu1AJAVA_1v9V+m)4+l(IIIA8U_ul$YbH1%;}otDnm{r-UW|Akd@R literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-0-auto.htm b/test/render/flex/flexbox_flex-0-auto.htm similarity index 100% rename from test/render/flex/--flexbox_flex-0-auto.htm rename to test/render/flex/flexbox_flex-0-auto.htm diff --git a/test/render/flex/flexbox_flex-0-auto.htm.png b/test/render/flex/flexbox_flex-0-auto.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d4107b044a2bb4d6eae9116283f0362f587051a3 GIT binary patch literal 472 zcmeAS@N?(olHy`uVBq!ia0y~yU@QV+6DDS$h>v%`YaqoL;1lBd|Nnm=lY!xXaIo72 zpo%U}7srqa#6ckqXhC9Cf*k$K*Gf*l?AN)4^XDx4{QXw$*L54CHwWPlL;e4Sr-jy){(19C_Ub9V ztlf9z=+&cD_3P~ZeOvhbS=pA)X;a>=&?#S*-R72R9?w*Q4}95L)w^IZ5ah4UUK+y$ zbmrq_@7{i#{yr3>>&yMG+jjW-UH)19c3ai;8*3wWUAraSJYm&3m1W4`_-*MdW`~3CmcWX@_05IIXE&4 Pf}+RM)z4*}Q$iB}%K+U1 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-1-auto-shrink.htm b/test/render/flex/flexbox_flex-1-1-auto-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-1-auto-shrink.htm rename to test/render/flex/flexbox_flex-1-1-auto-shrink.htm diff --git a/test/render/flex/flexbox_flex-1-1-auto-shrink.htm.png b/test/render/flex/flexbox_flex-1-1-auto-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..297113b2c060aac789601a889cf01b73048fc1d1 GIT binary patch literal 399 zcmeAS@N?(olHy`uVBq!ia0y~yU=#wf7qKt{$@(Sn7lD*$fKQ0)|NsAiOa=xJ{r|w} zwKtwMG&FE7(b@#mVe0AP7*fIb_KI)bAp-&T!gU|iJHHn&vxqx1F{eCyxB1~e_ZK&o z$a8Icy=v+kkN2H{VmJS!q~8z(f~_;MzH8o;e_iI##KI}0;xR!X(qmWgzSFw*?>?`t zelmNT#?Eh*CoL*|r>X=gPdd4^NbRZ6O6!|*4zEdhUv>CJ+IiEHp;E^TnxDLtd>;Mn z+)Y+X=FFn?=3iAg+b-LzH0GSN!gGG7+gbnFPiNYQnpN4(zwh;nsZ)P~jhD)$`zp?R zIE6KJ3tcDa{XHt?{p{v0m3MwW+=O-)Z(Q10J^9Am-MXjSQ*z56iP?XDu70xY-`j}_ zjxcu;$9NL2@;mu1AJAVA_1v9V+m)4+l(IIIA8U_ul$YbH1%;}otDnm{r-UW|Akd@R literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-1-N-auto-shrink.htm b/test/render/flex/flexbox_flex-1-N-auto-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-1-N-auto-shrink.htm rename to test/render/flex/flexbox_flex-1-N-auto-shrink.htm diff --git a/test/render/flex/flexbox_flex-1-N-auto-shrink.htm.png b/test/render/flex/flexbox_flex-1-N-auto-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..297113b2c060aac789601a889cf01b73048fc1d1 GIT binary patch literal 399 zcmeAS@N?(olHy`uVBq!ia0y~yU=#wf7qKt{$@(Sn7lD*$fKQ0)|NsAiOa=xJ{r|w} zwKtwMG&FE7(b@#mVe0AP7*fIb_KI)bAp-&T!gU|iJHHn&vxqx1F{eCyxB1~e_ZK&o z$a8Icy=v+kkN2H{VmJS!q~8z(f~_;MzH8o;e_iI##KI}0;xR!X(qmWgzSFw*?>?`t zelmNT#?Eh*CoL*|r>X=gPdd4^NbRZ6O6!|*4zEdhUv>CJ+IiEHp;E^TnxDLtd>;Mn z+)Y+X=FFn?=3iAg+b-LzH0GSN!gGG7+gbnFPiNYQnpN4(zwh;nsZ)P~jhD)$`zp?R zIE6KJ3tcDa{XHt?{p{v0m3MwW+=O-)Z(Q10J^9Am-MXjSQ*z56iP?XDu70xY-`j}_ zjxcu;$9NL2@;mu1AJAVA_1v9V+m)4+l(IIIA8U_ul$YbH1%;}otDnm{r-UW|Akd@R literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-1-auto-shrink.htm b/test/render/flex/flexbox_flex-N-1-auto-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-1-auto-shrink.htm rename to test/render/flex/flexbox_flex-N-1-auto-shrink.htm diff --git a/test/render/flex/flexbox_flex-N-1-auto-shrink.htm.png b/test/render/flex/flexbox_flex-N-1-auto-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..297113b2c060aac789601a889cf01b73048fc1d1 GIT binary patch literal 399 zcmeAS@N?(olHy`uVBq!ia0y~yU=#wf7qKt{$@(Sn7lD*$fKQ0)|NsAiOa=xJ{r|w} zwKtwMG&FE7(b@#mVe0AP7*fIb_KI)bAp-&T!gU|iJHHn&vxqx1F{eCyxB1~e_ZK&o z$a8Icy=v+kkN2H{VmJS!q~8z(f~_;MzH8o;e_iI##KI}0;xR!X(qmWgzSFw*?>?`t zelmNT#?Eh*CoL*|r>X=gPdd4^NbRZ6O6!|*4zEdhUv>CJ+IiEHp;E^TnxDLtd>;Mn z+)Y+X=FFn?=3iAg+b-LzH0GSN!gGG7+gbnFPiNYQnpN4(zwh;nsZ)P~jhD)$`zp?R zIE6KJ3tcDa{XHt?{p{v0m3MwW+=O-)Z(Q10J^9Am-MXjSQ*z56iP?XDu70xY-`j}_ zjxcu;$9NL2@;mu1AJAVA_1v9V+m)4+l(IIIA8U_ul$YbH1%;}otDnm{r-UW|Akd@R literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-N-N-auto-shrink.htm b/test/render/flex/flexbox_flex-N-N-auto-shrink.htm similarity index 100% rename from test/render/flex/--flexbox_flex-N-N-auto-shrink.htm rename to test/render/flex/flexbox_flex-N-N-auto-shrink.htm diff --git a/test/render/flex/flexbox_flex-N-N-auto-shrink.htm.png b/test/render/flex/flexbox_flex-N-N-auto-shrink.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..297113b2c060aac789601a889cf01b73048fc1d1 GIT binary patch literal 399 zcmeAS@N?(olHy`uVBq!ia0y~yU=#wf7qKt{$@(Sn7lD*$fKQ0)|NsAiOa=xJ{r|w} zwKtwMG&FE7(b@#mVe0AP7*fIb_KI)bAp-&T!gU|iJHHn&vxqx1F{eCyxB1~e_ZK&o z$a8Icy=v+kkN2H{VmJS!q~8z(f~_;MzH8o;e_iI##KI}0;xR!X(qmWgzSFw*?>?`t zelmNT#?Eh*CoL*|r>X=gPdd4^NbRZ6O6!|*4zEdhUv>CJ+IiEHp;E^TnxDLtd>;Mn z+)Y+X=FFn?=3iAg+b-LzH0GSN!gGG7+gbnFPiNYQnpN4(zwh;nsZ)P~jhD)$`zp?R zIE6KJ3tcDa{XHt?{p{v0m3MwW+=O-)Z(Q10J^9Am-MXjSQ*z56iP?XDu70xY-`j}_ zjxcu;$9NL2@;mu1AJAVA_1v9V+m)4+l(IIIA8U_ul$YbH1%;}otDnm{r-UW|Akd@R literal 0 HcmV?d00001 From 88e255c37cf4b4b00529dcdf727af9182a48db62 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Sat, 6 Jan 2024 03:19:02 +0300 Subject: [PATCH 59/73] flex: support for items max-width/max-height and auto-margins --- include/litehtml/render_flex.h | 16 ++- src/render_flex.cpp | 113 ++++++++++++++++-- ....htm => flexbox_justifycontent-center.htm} | 0 .../flexbox_justifycontent-center.htm.png | Bin 0 -> 423 bytes ...tm => flexbox_justifycontent-flex-end.htm} | 0 .../flexbox_justifycontent-flex-end.htm.png | Bin 0 -> 422 bytes ... => flexbox_justifycontent-flex-start.htm} | 0 .../flexbox_justifycontent-flex-start.htm.png | Bin 0 -> 425 bytes ...exbox_justifycontent-spacearound-only.htm} | 0 ...ox_justifycontent-spacearound-only.htm.png | Bin 0 -> 230 bytes ...=> flexbox_justifycontent-spacearound.htm} | 0 ...flexbox_justifycontent-spacearound.htm.png | Bin 0 -> 425 bytes ...> flexbox_justifycontent-spacebetween.htm} | 0 ...lexbox_justifycontent-spacebetween.htm.png | Bin 0 -> 427 bytes ...argin-auto.htm => flexbox_margin-auto.htm} | 0 test/render/flex/flexbox_margin-auto.htm.png | Bin 0 -> 277 bytes ...left-ex.htm => flexbox_margin-left-ex.htm} | 0 .../flex/flexbox_margin-left-ex.htm.png | Bin 0 -> 344 bytes 18 files changed, 112 insertions(+), 17 deletions(-) rename test/render/flex/{--flexbox_justifycontent-center.htm => flexbox_justifycontent-center.htm} (100%) create mode 100644 test/render/flex/flexbox_justifycontent-center.htm.png rename test/render/flex/{--flexbox_justifycontent-flex-end.htm => flexbox_justifycontent-flex-end.htm} (100%) create mode 100644 test/render/flex/flexbox_justifycontent-flex-end.htm.png rename test/render/flex/{--flexbox_justifycontent-flex-start.htm => flexbox_justifycontent-flex-start.htm} (100%) create mode 100644 test/render/flex/flexbox_justifycontent-flex-start.htm.png rename test/render/flex/{--flexbox_justifycontent-spacearound-only.htm => flexbox_justifycontent-spacearound-only.htm} (100%) create mode 100644 test/render/flex/flexbox_justifycontent-spacearound-only.htm.png rename test/render/flex/{--flexbox_justifycontent-spacearound.htm => flexbox_justifycontent-spacearound.htm} (100%) create mode 100644 test/render/flex/flexbox_justifycontent-spacearound.htm.png rename test/render/flex/{--flexbox_justifycontent-spacebetween.htm => flexbox_justifycontent-spacebetween.htm} (100%) create mode 100644 test/render/flex/flexbox_justifycontent-spacebetween.htm.png rename test/render/flex/{--flexbox_margin-auto.htm => flexbox_margin-auto.htm} (100%) create mode 100644 test/render/flex/flexbox_margin-auto.htm.png rename test/render/flex/{--flexbox_margin-left-ex.htm => flexbox_margin-left-ex.htm} (100%) create mode 100644 test/render/flex/flexbox_margin-left-ex.htm.png diff --git a/include/litehtml/render_flex.h b/include/litehtml/render_flex.h index 897e1dbbb..8bcc85d77 100644 --- a/include/litehtml/render_flex.h +++ b/include/litehtml/render_flex.h @@ -12,7 +12,7 @@ namespace litehtml std::shared_ptr el; int base_size; int min_size; - int max_size; + def_value max_size; int main_size; int grow; int shrink; @@ -20,6 +20,8 @@ namespace litehtml bool frozen; int order; int src_order; + def_value auto_margin_start; + def_value auto_margin_end; flex_align_items align; explicit flex_item(std::shared_ptr &_el) : @@ -34,7 +36,9 @@ namespace litehtml max_size(0), order(0), src_order(0), - scaled_flex_shrink_factor(0) + scaled_flex_shrink_factor(0), + auto_margin_start(0), + auto_margin_end(0) {} bool operator<(const flex_item& b) const @@ -54,6 +58,8 @@ namespace litehtml int base_size; int total_grow; int total_shrink; + int num_auto_margin_start; // number of items with auto margin left/top + int num_auto_margin_end; // number of items with auto margin right/bottom flex_line() : cross_size(0), @@ -61,13 +67,15 @@ namespace litehtml total_grow(0), base_size(0), total_shrink(0), - main_size(0) + main_size(0), + num_auto_margin_start(0), + num_auto_margin_end(0) {} void clear() { items.clear(); - top = cross_size = main_size = base_size = total_shrink = total_grow = 0; + num_auto_margin_start = num_auto_margin_end = top = cross_size = main_size = base_size = total_shrink = total_grow = 0; } void distribute_free_space(int container_main_size); diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 77e2fb674..8d6e56f33 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -290,11 +290,10 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, // render items into new size and find line cross_size for (auto &item: ln.items) { - ln.main_size += item.main_size; - item.el->render(el_x, el_y, self_size.new_width(item.main_size - item.el->content_offset_width(), containing_block_context::size_mode_exact_width), fmt_ctx, false); + ln.main_size += item.el->width(); ln.cross_size = std::max(ln.cross_size, item.el->height()); el_x += item.el->width(); } @@ -304,8 +303,6 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { for (auto &item: ln.items) { - ln.main_size += item.main_size; - int el_ret_width = item.el->render(el_x, el_y, self_size, fmt_ctx, false); @@ -316,6 +313,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, containing_block_context::size_mode_exact_width | containing_block_context::size_mode_exact_height), fmt_ctx, false); + ln.main_size += item.el->height(); ln.cross_size = std::max(ln.cross_size, item.el->width()); el_y += item.el->height(); } @@ -381,11 +379,53 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, for(auto& ln : lines) { + int free_main_size = container_main_size - ln.main_size; + // distribute auto margins + if(free_main_size > 0 && (ln.num_auto_margin_start || ln.num_auto_margin_end)) + { + int add = (int) (free_main_size / (ln.items.size() * 2)); + for (auto &item: ln.items) + { + if(!item.auto_margin_start.is_default()) + { + item.auto_margin_start = add; + item.main_size += add; + ln.main_size += add; + free_main_size -= add; + } + if(!item.auto_margin_end.is_default()) + { + item.auto_margin_end = add; + item.main_size += add; + ln.main_size += add; + free_main_size -= add; + } + } + while (free_main_size > 0) + { + for (auto &item: ln.items) + { + if(!item.auto_margin_start.is_default()) + { + item.auto_margin_start = item.auto_margin_start + 1; + free_main_size--; + if(!free_main_size) break; + } + if(!item.auto_margin_end.is_default()) + { + item.auto_margin_end = item.auto_margin_end + 1; + free_main_size--; + if(!free_main_size) break; + } + } + } + } + ln.cross_size += lines_spread.add_line_size(); flex_justify_content_spread content_spread(css().get_flex_justify_content(), (int) ln.items.size(), - container_main_size - ln.main_size, is_row_direction, reverse); + free_main_size, is_row_direction, reverse); if(is_row_direction) { if(is_wrap_reverse) @@ -404,6 +444,13 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } for (auto &item: ln.items) { + // apply auto margins to item + if(!item.auto_margin_start.is_default()) + { + item.el->get_margins().left = item.auto_margin_start; + item.el->pos().x += item.auto_margin_start; + } + if(!item.auto_margin_end.is_default()) item.el->get_margins().right = item.auto_margin_end; if(!reverse) { // justify content [before_item] @@ -486,6 +533,14 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } for (auto &item: ln.items) { + // apply auto margins to item + if(!item.auto_margin_start.is_default()) + { + item.el->get_margins().top = item.auto_margin_start; + item.el->pos().y += item.auto_margin_start; + } + if(!item.auto_margin_end.is_default()) item.el->get_margins().bottom = item.auto_margin_end; + if(!reverse) { // justify content [before_item] @@ -534,6 +589,14 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, containing_block_context::size_mode_exact_height), fmt_ctx, false); } + // apply auto margins to item after rendering + if(!item.auto_margin_start.is_default()) + { + item.el->get_margins().top = item.auto_margin_start; + item.el->pos().y += item.auto_margin_start; + } + if(!item.auto_margin_end.is_default()) item.el->get_margins().bottom = item.auto_margin_end; + if(!item.el->css().get_width().is_predefined() && is_wrap_reverse) { item.el->pos().x = el_x + ln.cross_size - item.el->width() + item.el->content_offset_left(); @@ -657,6 +720,12 @@ litehtml::render_item_flex::flex_line::distribute_free_space(int container_main_ item.main_size = item.min_size; item.frozen = true; } + if(!item.max_size.is_default() && item.main_size >= item.max_size) + { + total_clamped++; + item.main_size = item.max_size; + item.frozen = true; + } } else { // If using the flex grow factor @@ -677,6 +746,12 @@ litehtml::render_item_flex::flex_line::distribute_free_space(int container_main_ item.main_size = container_main_size; item.frozen = true; } + if(!item.max_size.is_default() && item.main_size >= item.max_size) + { + total_clamped++; + item.main_size = item.max_size; + item.frozen = true; + } } } } @@ -733,6 +808,14 @@ std::list litehtml::render_item_flex::get if (is_row_direction) { + if(item.el->css().get_margins().left.is_predefined()) + { + item.auto_margin_start = 0; + } + if(item.el->css().get_margins().right.is_predefined()) + { + item.auto_margin_end = 0; + } if (item.el->css().get_min_width().is_predefined()) { item.min_size = el->render(0, 0, @@ -743,10 +826,7 @@ std::list litehtml::render_item_flex::get item.min_size = item.el->css().get_min_width().calc_percent(self_size.render_width) + el->content_offset_width(); } - if (item.el->css().get_max_width().is_predefined()) - { - item.max_size = self_size.render_width; - } else + if (!item.el->css().get_max_width().is_predefined()) { item.max_size = item.el->css().get_max_width().calc_percent(self_size.render_width) + el->content_offset_width(); @@ -794,6 +874,14 @@ std::list litehtml::render_item_flex::get } } else { + if(item.el->css().get_margins().top.is_predefined()) + { + item.auto_margin_start = 0; + } + if(item.el->css().get_margins().bottom.is_predefined()) + { + item.auto_margin_end = 0; + } if (item.el->css().get_min_height().is_predefined()) { el->render(0, 0, self_size.new_width(self_size.render_width, containing_block_context::size_mode_content), fmt_ctx); @@ -803,10 +891,7 @@ std::list litehtml::render_item_flex::get item.min_size = item.el->css().get_min_height().calc_percent(self_size.height) + el->content_offset_height(); } - if (item.el->css().get_max_height().is_predefined()) - { - item.max_size = self_size.height; - } else + if (!item.el->css().get_max_height().is_predefined()) { item.max_size = item.el->css().get_max_height().calc_percent(self_size.height) + el->content_offset_width(); @@ -884,6 +969,8 @@ std::list litehtml::render_item_flex::get line.base_size += item.base_size; line.total_grow += item.grow; line.total_shrink += item.shrink; + if(!item.auto_margin_start.is_default()) line.num_auto_margin_start++; + if(!item.auto_margin_end.is_default()) line.num_auto_margin_end++; line.items.push_back(item); } // Add the last line to the lines list diff --git a/test/render/flex/--flexbox_justifycontent-center.htm b/test/render/flex/flexbox_justifycontent-center.htm similarity index 100% rename from test/render/flex/--flexbox_justifycontent-center.htm rename to test/render/flex/flexbox_justifycontent-center.htm diff --git a/test/render/flex/flexbox_justifycontent-center.htm.png b/test/render/flex/flexbox_justifycontent-center.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c2731d3c93961f7419eed47cf942b6303a5089dd GIT binary patch literal 423 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRFJfT^k{)hB3xJeRfKQ0)|NsAiOa=xJ{r|w} zwKtwk&-xezR36~z;uuoF`1Y!!-=P43hQxISTNWJJ&(5MBo)s|CDN{2_dVhF-+F7(L;o!{%H zkN&(fS-ZXa^Y6T<_fJlrj=z5W(}a_2hO(>7&O}&WlyfyFcgm zO_!3NGHGHz&Ca$LM!nxNo&VQ2>;B@N^K+^vt^eU~XI52S1LKKuXNv-|I>|DP{!sXMjY)sMQMZvChKVn8pRIQiPe sFHXJalhwq@*I!1mdKI;Vst04=q?-2eap literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_justifycontent-flex-end.htm b/test/render/flex/flexbox_justifycontent-flex-end.htm similarity index 100% rename from test/render/flex/--flexbox_justifycontent-flex-end.htm rename to test/render/flex/flexbox_justifycontent-flex-end.htm diff --git a/test/render/flex/flexbox_justifycontent-flex-end.htm.png b/test/render/flex/flexbox_justifycontent-flex-end.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..cd44e7c312fd6d50e2fc679303f3cb8165218716 GIT binary patch literal 422 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRFJfT^k{)hB3xJeRfKQ0)|NsAiOa=xJ{r|w} zwKtwk&-xezRPOKT;uuoF`1Y!!-=P43hQxIST-rr%uOGkrvr+oG`p-|FzP~m3S$h3x`mpYUAp|Y;q;%|Ywq2(`}zNm(YpPg3MWpcE?6JB@7jrzuU-7& t)Qdh@O`LokU$DhQw_K-w!bbL@;b(;*~zIspKwxac%ma`@!q`o;=A_QhzUOSvmj2$=@!1_mvt>fBwH14)49K1LH^n#_nhc??<@9w{mJR_ckcAu z9ao=Ro*@3_+ehoTEw}x5UXicfo3VX<@yz;D+2z$g-~Y^w{QN0(;$-TA{Lp{bm63g` pUi8VX_VnUtYhajoPTJCG$MEXBa`D%LRpy}Z_H^}gS?83{1OSKO)`9>4 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_justifycontent-spacearound-only.htm b/test/render/flex/flexbox_justifycontent-spacearound-only.htm similarity index 100% rename from test/render/flex/--flexbox_justifycontent-spacearound-only.htm rename to test/render/flex/flexbox_justifycontent-spacearound-only.htm diff --git a/test/render/flex/flexbox_justifycontent-spacearound-only.htm.png b/test/render/flex/flexbox_justifycontent-spacearound-only.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..f48978676b74d8310e871e48b0ca1adcade5a48e GIT binary patch literal 230 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRFJfW_lE>MW14#zX0G|-o|NsAk*bM)JgWWCw z=^36bjv*C{Z?A0RJ!Bx_8fbn`A+jkms7C*wh{;RM8BLmwSGHX1o>XjmVB*r{_f_C5bH{_no{^75Cx*IrG%6kq#u-|JVeJO0^j+qGuj^-IOG z_kY^D@G@BGay-<0!MT1w`7f2fIJTO4PAWNMXX79J*U$DhQw_K-w!bbL@;b(;*~zIspKwxac%ma`@!q`o;=A_QhzUOSvmj2$=@!1_mvt>fBwH14)49K1LH^n#_nhc??<@9w{mJR_ckcAu z9ao=Ro*@3_+ehoTEw}x5UXicfo3VX<@yz;D+2z$g-~Y^w{QN0(;$-TA{Lp{bm63g` pUi8VX_VnUtYhajoPTJCG$MEXBa`D%LRpy}Z_H^}gS?83{1OSKO)`9>4 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_justifycontent-spacebetween.htm b/test/render/flex/flexbox_justifycontent-spacebetween.htm similarity index 100% rename from test/render/flex/--flexbox_justifycontent-spacebetween.htm rename to test/render/flex/flexbox_justifycontent-spacebetween.htm diff --git a/test/render/flex/flexbox_justifycontent-spacebetween.htm.png b/test/render/flex/flexbox_justifycontent-spacebetween.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..f03ac862978fb8d12a6b3d739005d194537d9df8 GIT binary patch literal 427 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRFJfT^k{)hB3xJeRfKQ0)|NsAiOa=xJ{r|w} zwKtwk&-xezR375#;uuoF`1Wd`->U$DhQw_K-w!bbL@;b(;*~zI*rdU zntuLUSadJT&QG#zl8Wafl}u^Zt^1z*pO;mtqOLD&SvmK_$=5D^aq2~%to}~1kAMEv z=%fAIyw6p$f7~fHUtj*|{^b4du1~zrANz0OWc`WmfA&9#`JJg@@AgJme!ETdsn0vx ztL@u6^v)-Wo$Sxt*K_&Tx$2(_^6Q@$_J2Hcb5YIyMSHSU`+r1#syY67?RkF%x&5D? zN#~XRw0Oc@R{dW#f6s0IomblT-mBO?zj$W-Df!!PSO1-N|Cwp5oqiE@!Kbw+Rzp2H raq{)fIeYw`JSqJ(&3!90T!d>G^e-wGPyNm>2?}vfS3j3^P6E0+i(^OyOGuNS0YxGaiQYL&%pmX zpIaz+Oj5b3uYac?ILH6=w&e@JAfh*k=lkEiJE~v)krLTm-?ght^Q-2v@1n=A9G&#@ zd6)AWz3g+5Q_j}MY+Skc#bM7sr~k#Ha}{^CEZ1P(-5hf$_|_sj;RDYdYS#Yv z8{u*4_xEOZE00MkU)Qg>^KMB+RqXb3E->iY9pbaRoL~O;^{}t!-uhlWlB@kKd3V=e z(NylP@76iNg(o!I|5Q#-?pqkQRK|P7y8HJE=ZQJ%tbL?oxe!uADJT*l_C8&$Z`I)XjN5 x^#}XB2O`9SwMl0+AmE*UU|60x&^M*;d3Qz6JGY9XU Date: Sat, 6 Jan 2024 04:12:32 +0300 Subject: [PATCH 60/73] flex: some passed tests added --- .../render/flex/{--flex-002.htm => flex-002.htm} | 0 test/render/flex/flex-002.htm.png | Bin 0 -> 992 bytes .../render/flex/{--flex-004.htm => flex-004.htm} | 0 test/render/flex/flex-004.htm.png | Bin 0 -> 992 bytes .../{--flex-flow-004.htm => flex-flow-004.htm} | 0 test/render/flex/flex-flow-004.htm.png | Bin 0 -> 1069 bytes ...--flex-shrink-001.htm => flex-shrink-001.htm} | 0 test/render/flex/flex-shrink-001.htm.png | Bin 0 -> 577 bytes ...--flex-shrink-003.htm => flex-shrink-003.htm} | 0 test/render/flex/flex-shrink-003.htm.png | Bin 0 -> 577 bytes ...--flex-shrink-006.htm => flex-shrink-006.htm} | 0 test/render/flex/flex-shrink-006.htm.png | Bin 0 -> 577 bytes ...--flex-shrink-007.htm => flex-shrink-007.htm} | 0 test/render/flex/flex-shrink-007.htm.png | Bin 0 -> 577 bytes ....htm => flexbox-break-request-horiz-002a.htm} | 0 .../flexbox-break-request-horiz-002a.htm.png | Bin 0 -> 329 bytes ....htm => flexbox-break-request-horiz-002b.htm} | 0 .../flexbox-break-request-horiz-002b.htm.png | Bin 0 -> 329 bytes ...z-001.htm => flexbox-flex-wrap-horiz-001.htm} | 0 .../flex/flexbox-flex-wrap-horiz-001.htm.png | Bin 0 -> 335 bytes ...001.htm => flexbox-margin-auto-horiz-001.htm} | 0 .../flex/flexbox-margin-auto-horiz-001.htm.png | Bin 0 -> 345 bytes ...rse.htm => flexbox_direction-row-reverse.htm} | 0 .../flex/flexbox_direction-row-reverse.htm.png | Bin 0 -> 210 bytes ...flex-initial.htm => flexbox_flex-initial.htm} | 0 test/render/flex/flexbox_flex-initial.htm.png | Bin 0 -> 472 bytes ...exbox_wrap-long.htm => flexbox_wrap-long.htm} | 0 test/render/flex/flexbox_wrap-long.htm.png | Bin 0 -> 340 bytes ...crash.htm => negative-flex-margins-crash.htm} | 0 .../flex/negative-flex-margins-crash.htm.png | Bin 0 -> 180 bytes ...eights-009.htm => percentage-heights-009.htm} | 0 test/render/flex/percentage-heights-009.htm.png | Bin 0 -> 577 bytes 32 files changed, 0 insertions(+), 0 deletions(-) rename test/render/flex/{--flex-002.htm => flex-002.htm} (100%) create mode 100644 test/render/flex/flex-002.htm.png rename test/render/flex/{--flex-004.htm => flex-004.htm} (100%) create mode 100644 test/render/flex/flex-004.htm.png rename test/render/flex/{--flex-flow-004.htm => flex-flow-004.htm} (100%) create mode 100644 test/render/flex/flex-flow-004.htm.png rename test/render/flex/{--flex-shrink-001.htm => flex-shrink-001.htm} (100%) create mode 100644 test/render/flex/flex-shrink-001.htm.png rename test/render/flex/{--flex-shrink-003.htm => flex-shrink-003.htm} (100%) create mode 100644 test/render/flex/flex-shrink-003.htm.png rename test/render/flex/{--flex-shrink-006.htm => flex-shrink-006.htm} (100%) create mode 100644 test/render/flex/flex-shrink-006.htm.png rename test/render/flex/{--flex-shrink-007.htm => flex-shrink-007.htm} (100%) create mode 100644 test/render/flex/flex-shrink-007.htm.png rename test/render/flex/{--flexbox-break-request-horiz-002a.htm => flexbox-break-request-horiz-002a.htm} (100%) create mode 100644 test/render/flex/flexbox-break-request-horiz-002a.htm.png rename test/render/flex/{--flexbox-break-request-horiz-002b.htm => flexbox-break-request-horiz-002b.htm} (100%) create mode 100644 test/render/flex/flexbox-break-request-horiz-002b.htm.png rename test/render/flex/{--flexbox-flex-wrap-horiz-001.htm => flexbox-flex-wrap-horiz-001.htm} (100%) create mode 100644 test/render/flex/flexbox-flex-wrap-horiz-001.htm.png rename test/render/flex/{--flexbox-margin-auto-horiz-001.htm => flexbox-margin-auto-horiz-001.htm} (100%) create mode 100644 test/render/flex/flexbox-margin-auto-horiz-001.htm.png rename test/render/flex/{--flexbox_direction-row-reverse.htm => flexbox_direction-row-reverse.htm} (100%) create mode 100644 test/render/flex/flexbox_direction-row-reverse.htm.png rename test/render/flex/{--flexbox_flex-initial.htm => flexbox_flex-initial.htm} (100%) create mode 100644 test/render/flex/flexbox_flex-initial.htm.png rename test/render/flex/{--flexbox_wrap-long.htm => flexbox_wrap-long.htm} (100%) create mode 100644 test/render/flex/flexbox_wrap-long.htm.png rename test/render/flex/{--negative-flex-margins-crash.htm => negative-flex-margins-crash.htm} (100%) create mode 100644 test/render/flex/negative-flex-margins-crash.htm.png rename test/render/flex/{--percentage-heights-009.htm => percentage-heights-009.htm} (100%) create mode 100644 test/render/flex/percentage-heights-009.htm.png diff --git a/test/render/flex/--flex-002.htm b/test/render/flex/flex-002.htm similarity index 100% rename from test/render/flex/--flex-002.htm rename to test/render/flex/flex-002.htm diff --git a/test/render/flex/flex-002.htm.png b/test/render/flex/flex-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..156126b1f60065e6fdfaca6e17cf15f6e0d71ec5 GIT binary patch literal 992 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZVifKQ0)|NsAiOa_Mk|Ccg& zCszCgD(v@kaSW+od^%`8lAZjI_6yOPTv zb^Aj9uGH>OG1TMD_Wu9n*3z&^As5;wex2KK-Yf5Ex$)MER{CG}?%378{@aa-vde>> z%k6GmdeoNbIb+JX-wHdK53ZAGOpw`g_9Z_0VkS9g-l_xSbqTQ8b@-9gP;Kc{ND z@(tDhcizmcc)KD$v+7Mp?YAG*db($~{`!$+d*a&4Mw#6Y-+e4^UZSnA!eY9^CB_r? z%#%bFZhxP@ch`bdF5cT0{Iu+jXzdhpPZRHK($|VQdO&}@vBdI|i>AK6xq5T(=SKER z78$&^iZ@NodAD%(y=a-$hbr&Q6G&G-w(ipR>c>BClw8cUuTnqp#Z%$)%a)(4yWid@ ze7EoRpHI7&uekp7dF%EMb4$J+SzTgYWNf;1#azDF{F=Q5HGCdFawnAf+A~XD5#7(v z(8=xhCG*#*!jF?>1LwS}`}AnZ|4o;L|8^|s<*4&?5|K;%xLNXZ?X>>6$0vWcb;?Ry z+Qj1dE8%PI;@tOP?_Jl=bEqiU;=R}V)0R!uS$jWTyj_#Wa#DMO<@f$6>=SAPm;AiL z(sXvZXh(^4&?X<(%O@r;w_D^^;6E*hugUQ5nrBVdVnem(Hgp@*2sJTLPvsy;GW2b5TpEE_qA% z+8qk7{>N>7lf5Z2Y^%|#Yq|>BOW*GNlt1ZgX0h>!^DnPE)ctxf$-E*6mZ$^YU#buP z@_)Xz5{Dy)lR%R|ivo)xZJ9L|9H1Ok8(q(M;zn&kiU=n^D4Tk^`njxgN@xNApbp0@ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flex-004.htm b/test/render/flex/flex-004.htm similarity index 100% rename from test/render/flex/--flex-004.htm rename to test/render/flex/flex-004.htm diff --git a/test/render/flex/flex-004.htm.png b/test/render/flex/flex-004.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..156126b1f60065e6fdfaca6e17cf15f6e0d71ec5 GIT binary patch literal 992 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZVifKQ0)|NsAiOa_Mk|Ccg& zCszCgD(v@kaSW+od^%`8lAZjI_6yOPTv zb^Aj9uGH>OG1TMD_Wu9n*3z&^As5;wex2KK-Yf5Ex$)MER{CG}?%378{@aa-vde>> z%k6GmdeoNbIb+JX-wHdK53ZAGOpw`g_9Z_0VkS9g-l_xSbqTQ8b@-9gP;Kc{ND z@(tDhcizmcc)KD$v+7Mp?YAG*db($~{`!$+d*a&4Mw#6Y-+e4^UZSnA!eY9^CB_r? z%#%bFZhxP@ch`bdF5cT0{Iu+jXzdhpPZRHK($|VQdO&}@vBdI|i>AK6xq5T(=SKER z78$&^iZ@NodAD%(y=a-$hbr&Q6G&G-w(ipR>c>BClw8cUuTnqp#Z%$)%a)(4yWid@ ze7EoRpHI7&uekp7dF%EMb4$J+SzTgYWNf;1#azDF{F=Q5HGCdFawnAf+A~XD5#7(v z(8=xhCG*#*!jF?>1LwS}`}AnZ|4o;L|8^|s<*4&?5|K;%xLNXZ?X>>6$0vWcb;?Ry z+Qj1dE8%PI;@tOP?_Jl=bEqiU;=R}V)0R!uS$jWTyj_#Wa#DMO<@f$6>=SAPm;AiL z(sXvZXh(^4&?X<(%O@r;w_D^^;6E*hugUQ5nrBVdVnem(Hgp@*2sJTLPvsy;GW2b5TpEE_qA% z+8qk7{>N>7lf5Z2Y^%|#Yq|>BOW*GNlt1ZgX0h>!^DnPE)ctxf$-E*6mZ$^YU#buP z@_)Xz5{Dy)lR%R|ivo)xZJ9L|9H1Ok8(q(M;zn&kiU=n^D4Tk^`njxgN@xNApbp0@ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flex-flow-004.htm b/test/render/flex/flex-flow-004.htm similarity index 100% rename from test/render/flex/--flex-flow-004.htm rename to test/render/flex/flex-flow-004.htm diff --git a/test/render/flex/flex-flow-004.htm.png b/test/render/flex/flex-flow-004.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..9061032971513b165d7673009e53bab49c75f091 GIT binary patch literal 1069 zcmV+|1k(G7P)00009P)t-s|Ns90 z0001h07cR<761SP-$_J4RCodHmC=>sDh!74106s=DM3C5?!%NY{Y*N@LsI3{FM+W= zPIfZ88{-}QIdQN+f-eH$OeT}bWHOmdCX>lzs>&Hp|H(d_h6Fp!EK@5DC(j>lhOL-2 znlB!-i0gtzZSfX9)95;e+Umk`MT^K9ZVSXO!pWpLnl)l$nC#7Jq^!wPYl)1Nty>`d4&op-&bnqtMnCd&)aT zxYCEXXv5}b@k(^DQmS*~F5q6-b&uq{aOlX#yE% zAmauId}4wvl^Nl^2GNLHAgO|6POXA)2&7duK?BK*my>Qn$=d{y>xA52+T5Zt8I}P* zoepu=AR146*apwK(30uYKxmc`M5-X_r5Taqr(I6A7q-tVBgj&zH%pMZU37$k;L||h zryvq{1>%~w6o54dxor^5WXXv8dmv#a5Yz))ey9qqW_a0d11CKaNv-l)J>-mVFMn#) zLO+iZ5VQuaeX{SRzMw~|654D_h}z#6Q(H3b4c)P_YxzDv zDRi@uL-I3U^wadVGsv(2!D6+(^J{|DFY@E%eMb@jRT8BdX>fnNCF5iCZ=tWniVP_=?+NR8-!d=0HKnRoOIi? zbD$u(oDrHpa+-tC{vh}?5K@3pLC~ObPL?1v9rk`e!hH~W8sudcXCzMpp9oL70936Z z;f%!Or2_d`O`cdYvIAD-8&3~xsSxd_PlA~;HQJtWA-XOPPwL3Hgm z0lDeR`N$w=dFmN?J2J>y%gFWpz#s)jLGpn?^oU&M>DhZ>-vc=xALK)>!jF9T3-NYO zdoRpD45SkoNN+Nb-ee%X$v}FOf%GN==}iXGn+&8k8Axw3klth4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p)*P$N3=%Cv7@6SW3AJslLqep56y`S{e9)5@1}FNzy97`pD6Ui{q^x57k;jue|awh z3x|M$LjwaN6PPiNb7hph+qKHq&r9^rXsXQSDgL4_a8Wk;S!%xg`PF-CW22AmH~8*k z^W}c|?)T?jSANuo>4X?DA>CA6BUcg@>oBpUXO@geCxc CfQs<| literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-break-request-horiz-002b.htm b/test/render/flex/flexbox-break-request-horiz-002b.htm similarity index 100% rename from test/render/flex/--flexbox-break-request-horiz-002b.htm rename to test/render/flex/flexbox-break-request-horiz-002b.htm diff --git a/test/render/flex/flexbox-break-request-horiz-002b.htm.png b/test/render/flex/flexbox-break-request-horiz-002b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..32f06e7fd0cfc585f3a6cf00eb9533d45388b1c5 GIT binary patch literal 329 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK)*P$N3=%Cv7@6SW3AJslLqep56y`S{e9)5@1}FNzy97`pD6Ui{q^x57k;jue|awh z3x|M$LjwaN6PPiNb7hph+qKHq&r9^rXsXQSDgL4_a8Wk;S!%xg`PF-CW22AmH~8*k z^W}c|?)T?jSANuo>4X?DA>CA6BUcg@>oBpUXO@geCxc CfQs<| literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-flex-wrap-horiz-001.htm b/test/render/flex/flexbox-flex-wrap-horiz-001.htm similarity index 100% rename from test/render/flex/--flexbox-flex-wrap-horiz-001.htm rename to test/render/flex/flexbox-flex-wrap-horiz-001.htm diff --git a/test/render/flex/flexbox-flex-wrap-horiz-001.htm.png b/test/render/flex/flexbox-flex-wrap-horiz-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..703987050e60f52ccd856d65684e90dd32721a55 GIT binary patch literal 335 zcmV-V0kHmwP)aNRifDQ+ite_$hlaJbX!Am8^b1iWF(%HKnHw zd%CJGmVzsV^tv=;P)vUiX~dxDDLtK6N>68&($ngM9RKn1au}p%Rw1=Kb z_JS)VL5dV<%$m~E`o~XMu&OT>gLD%hy)KOylz&YRgVfy(q(2!HJ*B7fO8e-kWG@Jc h1Zm`;ChsXs$_I=5rl)RE&v*a;002ovPDHLkV1o3xkp%z% literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-margin-auto-horiz-001.htm b/test/render/flex/flexbox-margin-auto-horiz-001.htm similarity index 100% rename from test/render/flex/--flexbox-margin-auto-horiz-001.htm rename to test/render/flex/flexbox-margin-auto-horiz-001.htm diff --git a/test/render/flex/flexbox-margin-auto-horiz-001.htm.png b/test/render/flex/flexbox-margin-auto-horiz-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..5b484565615ca47464317fbbe18f120b246bccc6 GIT binary patch literal 345 zcmeAS@N?(olHy`uVBq!ia0vp^Hy9Wg#aNhutZ%bj)&VL00G|-o|NsAAzI>UXf#Lsw z(+vy_t5-6V0oAd3x;TbZFuuKb(D$%|KwDsx!9qqIsg7+-D&OOUm-Ae5iL`M$m-uPl z=XLYG-8c64^JYr+ZeE@Uk_71ay*XZ!dbf1uWHk(CFIsldrG8 z_&D?Qj?%k^$~<5-5x=L+{hPPTwfg-bh_ci*`IE2r16B3k`0~5H9%9g&tsC~;-TSk4 z@7GAlvTf>6t;c?u&HR|X=}heOh#yri&O`L?6}z_mk{r8vJHkcA$3kx3=hol&feY*^ zo@pER$;K?(Vh1-SY?k3NsikKVL0$m5Q|;xIItJDE>=l90Cl3L`iow&>&t;ucLK6UB C`jvSA literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_direction-row-reverse.htm b/test/render/flex/flexbox_direction-row-reverse.htm similarity index 100% rename from test/render/flex/--flexbox_direction-row-reverse.htm rename to test/render/flex/flexbox_direction-row-reverse.htm diff --git a/test/render/flex/flexbox_direction-row-reverse.htm.png b/test/render/flex/flexbox_direction-row-reverse.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..be94316ad47d1603924596b1d5fb9bcd555dcbfa GIT binary patch literal 210 zcmeAS@N?(olHy`uVBq!ia0vp^8-Q4Wkr_yK$S1@BDYgKg5ZC|z|1&WBuQ*`y87R{3 z>Eakt!FcujMqVaE9@c=Exi=n6$dFK;I+MX|QG!6*LQC&!scdEoe3p0|JIKN*v|`=K z{6#jAo&Q(e_E6q0`QVMqr5&RK1=)C%$wqFkAI|8eKb&bQF}`w z{{Cg_xqR8b(ymuM`Rx6y>vL0#7|WT`M=7OwpZ|SX|3~Rgy4-bp&d#;Jg(d)<#Ng@b K=d#Wzp$PzP(N)_3 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_flex-initial.htm b/test/render/flex/flexbox_flex-initial.htm similarity index 100% rename from test/render/flex/--flexbox_flex-initial.htm rename to test/render/flex/flexbox_flex-initial.htm diff --git a/test/render/flex/flexbox_flex-initial.htm.png b/test/render/flex/flexbox_flex-initial.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d4107b044a2bb4d6eae9116283f0362f587051a3 GIT binary patch literal 472 zcmeAS@N?(olHy`uVBq!ia0y~yU@QV+6DDS$h>v%`YaqoL;1lBd|Nnm=lY!xXaIo72 zpo%U}7srqa#6ckqXhC9Cf*k$K*Gf*l?AN)4^XDx4{QXw$*L54CHwWPlL;e4Sr-jy){(19C_Ub9V ztlf9z=+&cD_3P~ZeOvhbS=pA)X;a>=&?#S*-R72R9?w*Q4}95L)w^IZ5ah4UUK+y$ zbmrq_@7{i#{yr3>>&yMG+jjW-UH)19c3ai;8*3wWUAraSJYm&3m1W4`_-*MdW`~3CmcWX@_05IIXE&4 Pf}+RM)z4*}Q$iB}%K+U1 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_wrap-long.htm b/test/render/flex/flexbox_wrap-long.htm similarity index 100% rename from test/render/flex/--flexbox_wrap-long.htm rename to test/render/flex/flexbox_wrap-long.htm diff --git a/test/render/flex/flexbox_wrap-long.htm.png b/test/render/flex/flexbox_wrap-long.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..1f9bbde033a947505b27db5f40ae2462d03a18ab GIT binary patch literal 340 zcmeAS@N?(olHy`uVBq!ia0y~yU<6`@O-#%{GPh&B7m(r%@CkAK|NlRb$-wYGIN0q1 zP!*e}i(^OyN5EfePj9q5zmdbtUFnjr!aGH3M8t$VLkjm zGkyLV-?U|df`MUjcV2q#t?hWrCkg~#Lt~rr8aTgly}G%p({=UtMbnq}-Lg%+_I`1A z;Q3`j|9L}hu};0>RnDjd1FtUi&5o-x+@u#B``oZ}?$`cRvsZT1uFbpV8~bMS*7xb5 zfs(UAe;vHV|LW|9TSg(dcXuCO{rhwAtD+Ba_uuH=zj`r$!6nN8&$E_W1L2_f%2HYL zziL;FuavG^oTs*Ik(}-8qf_jbuXyvd$@?2>|IKlz;#L literal 0 HcmV?d00001 diff --git a/test/render/flex/--negative-flex-margins-crash.htm b/test/render/flex/negative-flex-margins-crash.htm similarity index 100% rename from test/render/flex/--negative-flex-margins-crash.htm rename to test/render/flex/negative-flex-margins-crash.htm diff --git a/test/render/flex/negative-flex-margins-crash.htm.png b/test/render/flex/negative-flex-margins-crash.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d4ea7f4a75b23abd66c645cd0705b1e0e8695b35 GIT binary patch literal 180 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK6&Qg8!=cBD5kRWi)5S5Qg7NL8jl4$;I9M-i zmU!T15j#_G#SGrRjJD0I&phZ7P<qzI{JM*lsZ*D$=p0V@tw!sZ@X-g zHgX&mNl6JfI=@NaTjKf)u0N!&q)2yIed=~P)oT!-!Zoq6#Qw%9j&tvmvX{9`5Nq}U e88GR@X-kI5Y4(Lbg(v+7Imgr0&t;ucLK6T?HAZUy literal 0 HcmV?d00001 diff --git a/test/render/flex/--percentage-heights-009.htm b/test/render/flex/percentage-heights-009.htm similarity index 100% rename from test/render/flex/--percentage-heights-009.htm rename to test/render/flex/percentage-heights-009.htm diff --git a/test/render/flex/percentage-heights-009.htm.png b/test/render/flex/percentage-heights-009.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p Date: Sun, 7 Jan 2024 01:12:13 +0300 Subject: [PATCH 61/73] flex: "flex-basis: 0" is valid value --- src/css_properties.cpp | 2 +- .../{--flex-basis-005.htm => flex-basis-005.htm} | 0 test/render/flex/flex-basis-005.htm.png | Bin 0 -> 577 bytes 3 files changed, 1 insertion(+), 1 deletion(-) rename test/render/flex/{--flex-basis-005.htm => flex-basis-005.htm} (100%) create mode 100644 test/render/flex/flex-basis-005.htm.png diff --git a/src/css_properties.cpp b/src/css_properties.cpp index 9df08e351..d02361108 100644 --- a/src/css_properties.cpp +++ b/src/css_properties.cpp @@ -409,7 +409,7 @@ void litehtml::css_properties::compute_flex(const element* el, const document::p m_flex_shrink = el->get_number_property(_flex_shrink_, false, 1, offset(m_flex_shrink)); m_flex_align_self = (flex_align_items) el->get_enum_property(_align_self_, false, flex_align_items_auto, offset(m_flex_align_self)); m_flex_basis = el->get_length_property(_flex_basis_, false, css_length::predef_value(flex_basis_auto), offset(m_flex_basis)); - if(!m_flex_basis.is_predefined() && m_flex_basis.units() == css_units_none) + if(!m_flex_basis.is_predefined() && m_flex_basis.units() == css_units_none && m_flex_basis.val() != 0) { // flex-basis property must contain units m_flex_basis.predef(flex_basis_auto); diff --git a/test/render/flex/--flex-basis-005.htm b/test/render/flex/flex-basis-005.htm similarity index 100% rename from test/render/flex/--flex-basis-005.htm rename to test/render/flex/flex-basis-005.htm diff --git a/test/render/flex/flex-basis-005.htm.png b/test/render/flex/flex-basis-005.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p Date: Sun, 7 Jan 2024 01:33:36 +0300 Subject: [PATCH 62/73] flex: fixed the height calc in size_mode_content mode --- src/render_block.cpp | 2 +- ...d-001b.htm => --flexbox-abspos-child-001b.htm} | 0 .../{--flex-flow-007.htm => flex-flow-007.htm} | 0 test/render/flex/flex-flow-007.htm.png | Bin 0 -> 922 bytes .../{--flex-flow-010.htm => flex-flow-010.htm} | 0 test/render/flex/flex-flow-010.htm.png | Bin 0 -> 922 bytes 6 files changed, 1 insertion(+), 1 deletion(-) rename test/render/flex/{flexbox-abspos-child-001b.htm => --flexbox-abspos-child-001b.htm} (100%) rename test/render/flex/{--flex-flow-007.htm => flex-flow-007.htm} (100%) create mode 100644 test/render/flex/flex-flow-007.htm.png rename test/render/flex/{--flex-flow-010.htm => flex-flow-010.htm} (100%) create mode 100644 test/render/flex/flex-flow-010.htm.png diff --git a/src/render_block.cpp b/src/render_block.cpp index 84289ae78..333395235 100644 --- a/src/render_block.cpp +++ b/src/render_block.cpp @@ -285,7 +285,7 @@ int litehtml::render_item_block::_render(int x, int y, const containing_block_co { if(self_size.height.type == containing_block_context::cbc_value_type_absolute) { - if(self_size.height > m_pos.height) + if(m_pos.height > self_size.height) { m_pos.height = self_size.height; } diff --git a/test/render/flex/flexbox-abspos-child-001b.htm b/test/render/flex/--flexbox-abspos-child-001b.htm similarity index 100% rename from test/render/flex/flexbox-abspos-child-001b.htm rename to test/render/flex/--flexbox-abspos-child-001b.htm diff --git a/test/render/flex/--flex-flow-007.htm b/test/render/flex/flex-flow-007.htm similarity index 100% rename from test/render/flex/--flex-flow-007.htm rename to test/render/flex/flex-flow-007.htm diff --git a/test/render/flex/flex-flow-007.htm.png b/test/render/flex/flex-flow-007.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0b9ed1f42022b105c668f8be4d001dd80b06f6ec GIT binary patch literal 922 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZV)fKQ0)|NsAiOoj#q*Gq?iITmEOK>Z9=BbBAjP17)ul*iJ9{lIp(X`HUU4OXkJM1@q*xTrcGBdw3^A zdHaf*-i2omm>(}LdXuX%bGKggg!S*IXILB&I4w0q(;CY> z=aVuUpJ>H@7P`-|_0sZG-Mr_E6%4)hO}sAFujjr(#_L^Z(SDby%ZnE6IcoeN@l%QX zl-+qQlXj+liz$Ad_iF$AgYO02{ki>Mzts1_eeOqIic0=&JTK1pV7^h!KKa`6r_JyG zs~oqH-mmHSWakqL)ynDH%dO&X?+^RVR53l4NBC)u|MiIV>!wt?FL}%QK`&CUQy}oD zveMy)H_Lx6I3W?4vf^g<`bk^cjyx3?d|BD+!z~C&H4F^)jj!d-@7pM^{pn+#%abJ6 zCn>H+&RlHjFjH8>Ypk@~Tv^FlN}!R$MPZRhM+URftp=FPV!?@zC6#vVm?gOJQ%}tv zX~CTlp8M0amE5(JexB_(arIQ6gNwAlMK+f$jDoo^W}%gopyfQpMcu1KCw5OwKXRsT zhM?i+4YPrS)18YAKx>!;m%u?> literal 0 HcmV?d00001 diff --git a/test/render/flex/--flex-flow-010.htm b/test/render/flex/flex-flow-010.htm similarity index 100% rename from test/render/flex/--flex-flow-010.htm rename to test/render/flex/flex-flow-010.htm diff --git a/test/render/flex/flex-flow-010.htm.png b/test/render/flex/flex-flow-010.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..0b9ed1f42022b105c668f8be4d001dd80b06f6ec GIT binary patch literal 922 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*Dx^y$$u>hM}ZV)fKQ0)|NsAiOoj#q*Gq?iITmEOK>Z9=BbBAjP17)ul*iJ9{lIp(X`HUU4OXkJM1@q*xTrcGBdw3^A zdHaf*-i2omm>(}LdXuX%bGKggg!S*IXILB&I4w0q(;CY> z=aVuUpJ>H@7P`-|_0sZG-Mr_E6%4)hO}sAFujjr(#_L^Z(SDby%ZnE6IcoeN@l%QX zl-+qQlXj+liz$Ad_iF$AgYO02{ki>Mzts1_eeOqIic0=&JTK1pV7^h!KKa`6r_JyG zs~oqH-mmHSWakqL)ynDH%dO&X?+^RVR53l4NBC)u|MiIV>!wt?FL}%QK`&CUQy}oD zveMy)H_Lx6I3W?4vf^g<`bk^cjyx3?d|BD+!z~C&H4F^)jj!d-@7pM^{pn+#%abJ6 zCn>H+&RlHjFjH8>Ypk@~Tv^FlN}!R$MPZRhM+URftp=FPV!?@zC6#vVm?gOJQ%}tv zX~CTlp8M0amE5(JexB_(arIQ6gNwAlMK+f$jDoo^W}%gopyfQpMcu1KCw5OwKXRsT zhM?i+4YPrS)18YAKx>!;m%u?> literal 0 HcmV?d00001 From ca4eed0c85cd16a8473ab3183aa9469b92f84589 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Sun, 7 Jan 2024 01:45:01 +0300 Subject: [PATCH 63/73] flex: added validation for flex-grow and flex-shrink (must be positive number) --- src/render_flex.cpp | 9 +++++++++ ...{--flex-shrink-002.htm => flex-shrink-002.htm} | 0 test/render/flex/flex-shrink-002.htm.png | Bin 0 -> 577 bytes 3 files changed, 9 insertions(+) rename test/render/flex/{--flex-shrink-002.htm => flex-shrink-002.htm} (100%) create mode 100644 test/render/flex/flex-shrink-002.htm.png diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 8d6e56f33..55f663836 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -792,8 +792,17 @@ std::list litehtml::render_item_flex::get for( auto& el : m_children) { flex_item item(el); + item.grow = (int) (item.el->css().get_flex_grow() * 1000.0); + // Negative numbers are invalid. + // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-grow-number + if(item.grow < 0) item.grow = 0; + item.shrink = (int) (item.el->css().get_flex_shrink() * 1000.0); + // Negative numbers are invalid. + // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-shrink-number + if(item.shrink < 0) item.shrink = 1000.0; + item.el->calc_outlines(self_size.render_width); item.order = item.el->css().get_order(); item.src_order = src_order++; diff --git a/test/render/flex/--flex-shrink-002.htm b/test/render/flex/flex-shrink-002.htm similarity index 100% rename from test/render/flex/--flex-shrink-002.htm rename to test/render/flex/flex-shrink-002.htm diff --git a/test/render/flex/flex-shrink-002.htm.png b/test/render/flex/flex-shrink-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p Date: Sun, 7 Jan 2024 02:55:16 +0300 Subject: [PATCH 64/73] flex: Added support for flex-grow/flex-shring with values less then 1 --- src/render_flex.cpp | 29 ++++++++++++++++-- ...{--flex-grow-007.htm => flex-grow-007.htm} | 0 test/render/flex/flex-grow-007.htm.png | Bin 0 -> 577 bytes ...lex-shrink-008.htm => flex-shrink-008.htm} | 0 test/render/flex/flex-shrink-008.htm.png | Bin 0 -> 577 bytes 5 files changed, 26 insertions(+), 3 deletions(-) rename test/render/flex/{--flex-grow-007.htm => flex-grow-007.htm} (100%) create mode 100644 test/render/flex/flex-grow-007.htm.png rename test/render/flex/{--flex-shrink-008.htm => flex-shrink-008.htm} (100%) create mode 100644 test/render/flex/flex-shrink-008.htm.png diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 55f663836..179fac994 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -1,6 +1,7 @@ #include "html.h" #include "types.h" #include "render_flex.h" +#include namespace litehtml { @@ -644,10 +645,32 @@ litehtml::render_item_flex::flex_line::distribute_free_space(int container_main_ { grow = false; total_flex_factor = total_shrink; + // Flex values between 0 and 1 have a somewhat special behavior: when the sum of the flex values on the line + // is less than 1, they will take up less than 100% of the free space. + // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-flex-grow + if(total_flex_factor < 1000) + { + for(auto &item : items) + { + item.main_size += initial_free_space * item.shrink / 1000; + } + return; + } } else { grow = true; total_flex_factor = total_grow; + // Flex values between 0 and 1 have a somewhat special behavior: when the sum of the flex values on the line + // is less than 1, they will take up less than 100% of the free space. + // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-flex-grow + if(total_flex_factor < 1000) + { + for(auto &item : items) + { + item.main_size += initial_free_space * item.grow / 1000; + } + return; + } } if(total_flex_factor > 0) @@ -793,15 +816,15 @@ std::list litehtml::render_item_flex::get { flex_item item(el); - item.grow = (int) (item.el->css().get_flex_grow() * 1000.0); + item.grow = (int) std::nearbyint(item.el->css().get_flex_grow() * 1000.0); // Negative numbers are invalid. // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-grow-number if(item.grow < 0) item.grow = 0; - item.shrink = (int) (item.el->css().get_flex_shrink() * 1000.0); + item.shrink = (int) std::nearbyint(item.el->css().get_flex_shrink() * 1000.0); // Negative numbers are invalid. // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-shrink-number - if(item.shrink < 0) item.shrink = 1000.0; + if(item.shrink < 0) item.shrink = 1000; item.el->calc_outlines(self_size.render_width); item.order = item.el->css().get_order(); diff --git a/test/render/flex/--flex-grow-007.htm b/test/render/flex/flex-grow-007.htm similarity index 100% rename from test/render/flex/--flex-grow-007.htm rename to test/render/flex/flex-grow-007.htm diff --git a/test/render/flex/flex-grow-007.htm.png b/test/render/flex/flex-grow-007.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..d230b8dd39a156c536467aae926481808742f273 GIT binary patch literal 577 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK=P)q?$zT7}Gk_FlfKQ0)|NsAiOoj#q*Gq4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p4)PHfuUGeIii2py?U&Ytes_xvIt|V8jw`s>S+q&1? zDQ`52&T({Yxp!>K-*fMjtKa0#-kW}AalY8+j^ni^zlF>v8Q=a;vw5an-s0=It;cKH z>K9Mh{`K_q&M&tf_f+eeZ90Ch{nDzve&>Il`RcR%(x*A=KmW1n3ych(qAT@&&R1Qf zvRVGF#~fAiUe7&Ip?=A2-G|#ZU5{N=y1dTDb&tjxnMFEf6EmxdQv{FgwRO>%e0xhx zU$p Date: Sun, 7 Jan 2024 03:16:32 +0300 Subject: [PATCH 65/73] flex: apply max-height to the flex container --- src/render_flex.cpp | 5 +++++ ...ert-001.htm => flexbox-flex-wrap-vert-001.htm} | 0 .../flex/flexbox-flex-wrap-vert-001.htm.png | Bin 0 -> 316 bytes ...ert-002.htm => flexbox-flex-wrap-vert-002.htm} | 0 .../flex/flexbox-flex-wrap-vert-002.htm.png | Bin 0 -> 207 bytes 5 files changed, 5 insertions(+) rename test/render/flex/{--flexbox-flex-wrap-vert-001.htm => flexbox-flex-wrap-vert-001.htm} (100%) create mode 100644 test/render/flex/flexbox-flex-wrap-vert-001.htm.png rename test/render/flex/{--flexbox-flex-wrap-vert-002.htm => flexbox-flex-wrap-vert-002.htm} (100%) create mode 100644 test/render/flex/flexbox-flex-wrap-vert-002.htm.png diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 179fac994..1c49fa5d0 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -258,6 +258,11 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { container_main_size = self_size.min_height; } + if(self_size.max_height.type != containing_block_context::cbc_value_type_auto && self_size.max_height > container_main_size) + { + container_main_size = self_size.max_height; + single_line = false; + } } // Split flex items to lines diff --git a/test/render/flex/--flexbox-flex-wrap-vert-001.htm b/test/render/flex/flexbox-flex-wrap-vert-001.htm similarity index 100% rename from test/render/flex/--flexbox-flex-wrap-vert-001.htm rename to test/render/flex/flexbox-flex-wrap-vert-001.htm diff --git a/test/render/flex/flexbox-flex-wrap-vert-001.htm.png b/test/render/flex/flexbox-flex-wrap-vert-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c4c60aa5d17ff54267880d0c547cb4aeab009182 GIT binary patch literal 316 zcmeAS@N?(olHy`uVBq!ia0vp^8-RE@3p0>(_B!ncq=W)|LR|m<{|{s`F#K;|XjpsW z*?)%r;(~ngK!K;8E{-7;jBl?V>}@s>a7!%9RB&KU%wTZg&Q$!nU5Nk2F&-C%Ru|5y z_n%G||KN)`(Qz)wuA6mx*uin4EW}No-p=_wMR>@67%@5oTnDg8349uB(^Z@_d^Rn*ah2=I&p{ z@cTQ{yRDXM-m}K^9Od1x_cm`q(fYIvZ|fV@-wgZ7u>IK;CYbhmA+fi-AMQ0Yg1~-W gpst*IF7|hspWS-5p>pEJSD+y9boFyt=akR{0LC1E_W%F@ literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-flex-wrap-vert-002.htm b/test/render/flex/flexbox-flex-wrap-vert-002.htm similarity index 100% rename from test/render/flex/--flexbox-flex-wrap-vert-002.htm rename to test/render/flex/flexbox-flex-wrap-vert-002.htm diff --git a/test/render/flex/flexbox-flex-wrap-vert-002.htm.png b/test/render/flex/flexbox-flex-wrap-vert-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ae6c9077f18792793477398c9659005e18ca4079 GIT binary patch literal 207 zcmeAS@N?(olHy`uVBq!ia0vp^0YJQoi5W<)_`F~{km3pO332`Z|38q)!0>gJV!GMSLLeGVXG7G2cJUkj|)mGy4G05{^kgtn?PUye(fC`}x zA2@5(&%Akk(n4UT;js<=2Q`;YNcVL}P&Qc|QE#yzik&I``0KiJPrm$OV%g@hxvS~Z zs;}%P&cwL|#H~{Hc+SwM`n2p`QoB9>AKO`>A?53S=gg>%Z@4(K#1-T!Pgg&ebxsLQ E09zVV Date: Sun, 7 Jan 2024 18:15:26 +0300 Subject: [PATCH 66/73] flex: support for 'align-self: inherit' --- src/css_properties.cpp | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/css_properties.cpp b/src/css_properties.cpp index d02361108..a3b458ebf 100644 --- a/src/css_properties.cpp +++ b/src/css_properties.cpp @@ -402,12 +402,12 @@ void litehtml::css_properties::compute_flex(const element* el, const document::p m_flex_align_items = (flex_align_items) el->get_enum_property(_align_items_, false, flex_align_items_flex_normal, offset(m_flex_align_items)); m_flex_align_content = (flex_align_content) el->get_enum_property(_align_content_, false, flex_align_content_stretch, offset(m_flex_align_content)); } + m_flex_align_self = (flex_align_items) el->get_enum_property(_align_self_, false, flex_align_items_auto, offset(m_flex_align_self)); auto parent = el->parent(); if (parent && (parent->css().m_display == display_flex || parent->css().m_display == display_inline_flex)) { m_flex_grow = el->get_number_property(_flex_grow_, false, 0, offset(m_flex_grow)); m_flex_shrink = el->get_number_property(_flex_shrink_, false, 1, offset(m_flex_shrink)); - m_flex_align_self = (flex_align_items) el->get_enum_property(_align_self_, false, flex_align_items_auto, offset(m_flex_align_self)); m_flex_basis = el->get_length_property(_flex_basis_, false, css_length::predef_value(flex_basis_auto), offset(m_flex_basis)); if(!m_flex_basis.is_predefined() && m_flex_basis.units() == css_units_none && m_flex_basis.val() != 0) { From b6e60a680353eb2bf83be9cb6d024068c97b976a Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Tue, 9 Jan 2024 02:44:04 +0300 Subject: [PATCH 67/73] flex: added support for align-items: baseline --- include/litehtml/render_block_context.h | 2 + include/litehtml/render_flex.h | 22 ++-- include/litehtml/render_inline.h | 10 +- include/litehtml/render_inline_context.h | 3 +- include/litehtml/render_item.h | 14 +- include/litehtml/style.h | 1 + include/litehtml/types.h | 6 +- src/line_box.cpp | 10 +- src/render_block_context.cpp | 20 +++ src/render_flex.cpp | 122 ++++++++++++++++-- src/render_inline_context.cpp | 41 +++--- src/render_item.cpp | 31 ----- src/style.cpp | 52 +++++++- ...ign-items-004.htm => -align-items-004.htm} | 0 ...2.htm => -contain-layout-baseline-002.htm} | 0 ...-align-self-006.htm => align-self-006.htm} | 0 test/render/flex/align-self-006.htm.png | Bin 0 -> 1026 bytes ...-align-self-010.htm => align-self-010.htm} | 0 test/render/flex/align-self-010.htm.png | Bin 0 -> 1026 bytes ...lexbox-align-self-baseline-horiz-001a.htm} | 0 ...box-align-self-baseline-horiz-001a.htm.png | Bin 0 -> 2293 bytes ...lexbox-align-self-baseline-horiz-001b.htm} | 0 ...box-align-self-baseline-horiz-001b.htm.png | Bin 0 -> 2293 bytes ...flexbox-align-self-baseline-horiz-004.htm} | 0 ...xbox-align-self-baseline-horiz-004.htm.png | Bin 0 -> 335 bytes ...flexbox-align-self-baseline-horiz-005.htm} | 0 ...xbox-align-self-baseline-horiz-005.htm.png | Bin 0 -> 336 bytes ...flexbox-align-self-baseline-horiz-007.htm} | 0 ...xbox-align-self-baseline-horiz-007.htm.png | Bin 0 -> 905 bytes ...=> flexbox-align-self-horiz-001-block.htm} | 0 ...flexbox-align-self-horiz-001-block.htm.png | Bin 0 -> 1438 bytes ...aseline-align-self-baseline-horiz-001.htm} | 0 ...line-align-self-baseline-horiz-001.htm.png | Bin 0 -> 281 bytes ...baseline-align-self-baseline-vert-001.htm} | 0 ...eline-align-self-baseline-vert-001.htm.png | Bin 0 -> 305 bytes ...lexbox-baseline-multi-item-horiz-001a.htm} | 0 ...box-baseline-multi-item-horiz-001a.htm.png | Bin 0 -> 192 bytes ...lexbox-baseline-multi-item-horiz-001b.htm} | 0 ...box-baseline-multi-item-horiz-001b.htm.png | Bin 0 -> 192 bytes ...flexbox-baseline-multi-item-vert-001a.htm} | 0 ...xbox-baseline-multi-item-vert-001a.htm.png | Bin 0 -> 187 bytes ...flexbox-baseline-multi-item-vert-001b.htm} | 0 ...xbox-baseline-multi-item-vert-001b.htm.png | Bin 0 -> 187 bytes ...flexbox-baseline-multi-line-horiz-001.htm} | 0 ...xbox-baseline-multi-line-horiz-001.htm.png | Bin 0 -> 242 bytes ...flexbox-baseline-multi-line-horiz-002.htm} | 0 ...xbox-baseline-multi-line-horiz-002.htm.png | Bin 0 -> 244 bytes ...flexbox-baseline-multi-line-horiz-003.htm} | 0 ...xbox-baseline-multi-line-horiz-003.htm.png | Bin 0 -> 319 bytes ... flexbox-baseline-multi-line-vert-001.htm} | 0 ...exbox-baseline-multi-line-vert-001.htm.png | Bin 0 -> 251 bytes ... flexbox-baseline-multi-line-vert-002.htm} | 0 ...exbox-baseline-multi-line-vert-002.htm.png | Bin 0 -> 252 bytes ...tm => flexbox-break-request-vert-002a.htm} | 0 .../flexbox-break-request-vert-002a.htm.png | Bin 0 -> 479 bytes ...tm => flexbox-break-request-vert-002b.htm} | 0 .../flexbox-break-request-vert-002b.htm.png | Bin 0 -> 479 bytes ...e.htm => flexbox_align-items-baseline.htm} | 0 .../flex/flexbox_align-items-baseline.htm.png | Bin 0 -> 397 bytes .../flex/percentage-heights-004.htm.png | Bin 1083 -> 1081 bytes 60 files changed, 257 insertions(+), 77 deletions(-) rename test/render/flex/{align-items-004.htm => -align-items-004.htm} (100%) rename test/render/flex/{contain-layout-baseline-002.htm => -contain-layout-baseline-002.htm} (100%) rename test/render/flex/{--align-self-006.htm => align-self-006.htm} (100%) create mode 100644 test/render/flex/align-self-006.htm.png rename test/render/flex/{--align-self-010.htm => align-self-010.htm} (100%) create mode 100644 test/render/flex/align-self-010.htm.png rename test/render/flex/{--flexbox-align-self-baseline-horiz-001a.htm => flexbox-align-self-baseline-horiz-001a.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-baseline-horiz-001a.htm.png rename test/render/flex/{--flexbox-align-self-baseline-horiz-001b.htm => flexbox-align-self-baseline-horiz-001b.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-baseline-horiz-001b.htm.png rename test/render/flex/{--flexbox-align-self-baseline-horiz-004.htm => flexbox-align-self-baseline-horiz-004.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-baseline-horiz-004.htm.png rename test/render/flex/{--flexbox-align-self-baseline-horiz-005.htm => flexbox-align-self-baseline-horiz-005.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-baseline-horiz-005.htm.png rename test/render/flex/{--flexbox-align-self-baseline-horiz-007.htm => flexbox-align-self-baseline-horiz-007.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-baseline-horiz-007.htm.png rename test/render/flex/{--flexbox-align-self-horiz-001-block.htm => flexbox-align-self-horiz-001-block.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-horiz-001-block.htm.png rename test/render/flex/{--flexbox-baseline-align-self-baseline-horiz-001.htm => flexbox-baseline-align-self-baseline-horiz-001.htm} (100%) create mode 100644 test/render/flex/flexbox-baseline-align-self-baseline-horiz-001.htm.png rename test/render/flex/{--flexbox-baseline-align-self-baseline-vert-001.htm => flexbox-baseline-align-self-baseline-vert-001.htm} (100%) create mode 100644 test/render/flex/flexbox-baseline-align-self-baseline-vert-001.htm.png rename test/render/flex/{--flexbox-baseline-multi-item-horiz-001a.htm => flexbox-baseline-multi-item-horiz-001a.htm} (100%) create mode 100644 test/render/flex/flexbox-baseline-multi-item-horiz-001a.htm.png rename test/render/flex/{--flexbox-baseline-multi-item-horiz-001b.htm => flexbox-baseline-multi-item-horiz-001b.htm} (100%) create mode 100644 test/render/flex/flexbox-baseline-multi-item-horiz-001b.htm.png rename test/render/flex/{--flexbox-baseline-multi-item-vert-001a.htm => flexbox-baseline-multi-item-vert-001a.htm} (100%) create mode 100644 test/render/flex/flexbox-baseline-multi-item-vert-001a.htm.png rename test/render/flex/{--flexbox-baseline-multi-item-vert-001b.htm => flexbox-baseline-multi-item-vert-001b.htm} (100%) create mode 100644 test/render/flex/flexbox-baseline-multi-item-vert-001b.htm.png rename test/render/flex/{--flexbox-baseline-multi-line-horiz-001.htm => flexbox-baseline-multi-line-horiz-001.htm} (100%) create mode 100644 test/render/flex/flexbox-baseline-multi-line-horiz-001.htm.png rename test/render/flex/{--flexbox-baseline-multi-line-horiz-002.htm => flexbox-baseline-multi-line-horiz-002.htm} (100%) create mode 100644 test/render/flex/flexbox-baseline-multi-line-horiz-002.htm.png rename test/render/flex/{--flexbox-baseline-multi-line-horiz-003.htm => flexbox-baseline-multi-line-horiz-003.htm} (100%) create mode 100644 test/render/flex/flexbox-baseline-multi-line-horiz-003.htm.png rename test/render/flex/{--flexbox-baseline-multi-line-vert-001.htm => flexbox-baseline-multi-line-vert-001.htm} (100%) create mode 100644 test/render/flex/flexbox-baseline-multi-line-vert-001.htm.png rename test/render/flex/{--flexbox-baseline-multi-line-vert-002.htm => flexbox-baseline-multi-line-vert-002.htm} (100%) create mode 100644 test/render/flex/flexbox-baseline-multi-line-vert-002.htm.png rename test/render/flex/{--flexbox-break-request-vert-002a.htm => flexbox-break-request-vert-002a.htm} (100%) create mode 100644 test/render/flex/flexbox-break-request-vert-002a.htm.png rename test/render/flex/{--flexbox-break-request-vert-002b.htm => flexbox-break-request-vert-002b.htm} (100%) create mode 100644 test/render/flex/flexbox-break-request-vert-002b.htm.png rename test/render/flex/{--flexbox_align-items-baseline.htm => flexbox_align-items-baseline.htm} (100%) create mode 100644 test/render/flex/flexbox_align-items-baseline.htm.png diff --git a/include/litehtml/render_block_context.h b/include/litehtml/render_block_context.h index 3b5192261..c69389832 100644 --- a/include/litehtml/render_block_context.h +++ b/include/litehtml/render_block_context.h @@ -23,6 +23,8 @@ namespace litehtml { return std::make_shared(src_el()); } + int get_first_baseline() override; + int get_last_baseline() override; }; } diff --git a/include/litehtml/render_flex.h b/include/litehtml/render_flex.h index 8bcc85d77..41c3b6c04 100644 --- a/include/litehtml/render_flex.h +++ b/include/litehtml/render_flex.h @@ -60,6 +60,8 @@ namespace litehtml int total_shrink; int num_auto_margin_start; // number of items with auto margin left/top int num_auto_margin_end; // number of items with auto margin right/bottom + int first_baseline; + int last_baseline; flex_line() : cross_size(0), @@ -69,24 +71,25 @@ namespace litehtml total_shrink(0), main_size(0), num_auto_margin_start(0), - num_auto_margin_end(0) + num_auto_margin_end(0), + first_baseline(0), + last_baseline(0) {} - void clear() - { - items.clear(); - num_auto_margin_start = num_auto_margin_end = top = cross_size = main_size = base_size = total_shrink = total_grow = 0; - } - void distribute_free_space(int container_main_size); }; + std::list m_lines; + def_value m_first_baseline; + def_value m_last_baseline; + std::list get_lines(const containing_block_context &self_size, formatting_context *fmt_ctx, bool is_row_direction, int container_main_size, bool single_line); int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; public: - explicit render_item_flex(std::shared_ptr src_el) : render_item_block(std::move(src_el)) + explicit render_item_flex(std::shared_ptr src_el) : render_item_block(std::move(src_el)), + m_first_baseline(0), m_last_baseline(0) {} std::shared_ptr clone() override @@ -94,6 +97,9 @@ namespace litehtml return std::make_shared(src_el()); } std::shared_ptr init() override; + + int get_first_baseline() override; + int get_last_baseline() override; }; } diff --git a/include/litehtml/render_inline.h b/include/litehtml/render_inline.h index 476011563..666074b90 100644 --- a/include/litehtml/render_inline.h +++ b/include/litehtml/render_inline.h @@ -18,7 +18,14 @@ namespace litehtml void set_inline_boxes( position::vector& boxes ) override { m_boxes = boxes; } void add_inline_box( const position& box ) override { m_boxes.emplace_back(box); }; void clear_inline_boxes() override { m_boxes.clear(); } - int get_base_line() override { return src_el()->css().get_font_metrics().base_line(); } + int get_first_baseline() override + { + return src_el()->css().get_font_metrics().height - src_el()->css().get_font_metrics().base_line(); + } + int get_last_baseline() override + { + return src_el()->css().get_font_metrics().height - src_el()->css().get_font_metrics().base_line(); + } std::shared_ptr clone() override { @@ -28,3 +35,4 @@ namespace litehtml } #endif //LITEHTML_RENDER_INLINE_H + diff --git a/include/litehtml/render_inline_context.h b/include/litehtml/render_inline_context.h index 894cfe989..7d629bc7f 100644 --- a/include/litehtml/render_inline_context.h +++ b/include/litehtml/render_inline_context.h @@ -48,7 +48,8 @@ namespace litehtml return std::make_shared(src_el()); } - int get_base_line() override; + int get_first_baseline() override; + int get_last_baseline() override; }; } diff --git a/include/litehtml/render_item.h b/include/litehtml/render_item.h index 2589974bb..038c95a68 100644 --- a/include/litehtml/render_item.h +++ b/include/litehtml/render_item.h @@ -304,15 +304,23 @@ namespace litehtml } int render(int x, int y, const containing_block_context& containing_block_size, formatting_context* fmt_ctx, bool second_pass = false); - int calc_width(int defVal, int containing_block_width) const; - bool get_predefined_height(int& p_height, int containing_block_height) const; void apply_relative_shift(const containing_block_context &containing_block_size); void calc_outlines( int parent_width ); int calc_auto_margins(int parent_width); // returns left margin virtual std::shared_ptr init(); virtual void apply_vertical_align() {} - virtual int get_base_line() { return 0; } + /** + * Get first baseline position. Default position is element bottom without bottom margin. + * @returns offset of the first baseline from element top + */ + virtual int get_first_baseline() { return height() - margin_bottom(); } + /** + * Get last baseline position. Default position is element bottom without bottom margin. + * @returns offset of the last baseline from element top + */ + virtual int get_last_baseline() { return height() - margin_bottom(); } + virtual std::shared_ptr clone() { return std::make_shared(src_el()); diff --git a/include/litehtml/style.h b/include/litehtml/style.h index c83876ad6..2e04059f2 100644 --- a/include/litehtml/style.h +++ b/include/litehtml/style.h @@ -199,6 +199,7 @@ namespace litehtml bool parse_one_background_size(const string& val, css_size& size); void parse_font(const string& val, bool important); void parse_flex(const string& val, bool important); + void parse_align_self(string_id name, const string& val, bool important); static css_length parse_border_width(const string& str); static void parse_two_lengths(const string& str, css_length len[2]); static int parse_four_lengths(const string& str, css_length len[4]); diff --git a/include/litehtml/types.h b/include/litehtml/types.h index b67b41a01..88da49428 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -896,7 +896,11 @@ namespace litehtml flex_align_items_end, flex_align_items_baseline, flex_align_items_stretch, - flex_align_items_auto // used for align-self property only + flex_align_items_auto, // used for align-self property only + flex_align_items_first = 0x100, + flex_align_items_last = 0x200, + flex_align_items_unsafe = 0x400, + flex_align_items_safe = 0x800, }; #define flex_align_content_strings "flex-start;start;flex-end;end;center;space-between;space-around;stretch" diff --git a/src/line_box.cpp b/src/line_box.cpp index 1ca9c85d7..2cf5f8502 100644 --- a/src/line_box.cpp +++ b/src/line_box.cpp @@ -363,7 +363,7 @@ std::list< std::unique_ptr > litehtml::line_box::finish case va_super: { int bl = calc_va_baseline(current_context, lbi->get_el()->css().get_vertical_align(), current_context.fm, line_top, line_bottom); - lbi->pos().y = bl - lbi->get_el()->height() + lbi->get_el()->get_base_line() + + lbi->pos().y = bl - lbi->get_el()->get_last_baseline() + lbi->get_el()->content_offset_top(); } break; @@ -374,7 +374,7 @@ std::list< std::unique_ptr > litehtml::line_box::finish lbi->pos().y = line_top + lbi->get_el()->content_offset_top(); break; case va_baseline: - lbi->pos().y = current_context.baseline - lbi->get_el()->height() + lbi->get_el()->get_base_line() + + lbi->pos().y = current_context.baseline - lbi->get_el()->get_last_baseline() + lbi->get_el()->content_offset_top(); break; case va_text_top: @@ -557,6 +557,12 @@ bool litehtml::line_box::can_hold(const std::unique_ptr& item, wh { auto last_el = get_last_text_part(); + // the first word is always can be hold + if(!last_el) + { + return true; + } + // force new line if the last placed element was line break if (last_el && last_el->src_el()->is_break()) { diff --git a/src/render_block_context.cpp b/src/render_block_context.cpp index c94bc5668..bf6b09277 100644 --- a/src/render_block_context.cpp +++ b/src/render_block_context.cpp @@ -132,3 +132,23 @@ int litehtml::render_item_block_context::_render_content(int x, int y, bool seco return ret_width; } + +int litehtml::render_item_block_context::get_first_baseline() +{ + if(m_children.empty()) + { + return height() - margin_bottom(); + } + const auto &item = m_children.front(); + return content_offset_top() + item->top() + item->get_first_baseline(); +} + +int litehtml::render_item_block_context::get_last_baseline() +{ + if(m_children.empty()) + { + return height() - margin_bottom(); + } + const auto &item = m_children.back(); + return content_offset_top() + item->top() + item->get_last_baseline(); +} diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 1c49fa5d0..84946900b 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -215,6 +215,9 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, bool reverse = false; int container_main_size = self_size.render_width; + m_first_baseline.reset(0); + m_last_baseline.reset(0); + switch (css().get_flex_direction()) { case flex_direction_column: @@ -266,7 +269,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } // Split flex items to lines - std::list lines = get_lines(self_size, fmt_ctx, is_row_direction, container_main_size, single_line); + m_lines = get_lines(self_size, fmt_ctx, is_row_direction, container_main_size, single_line); // Resolving Flexible Lengths // REF: https://www.w3.org/TR/css-flexbox-1/#resolve-flexible-lengths @@ -276,10 +279,12 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, int sum_cross_size = 0; int sum_main_size = 0; int ret_width = 0; - for(auto& ln : lines) + for(auto& ln : m_lines) { ln.cross_size = 0; ln.main_size = 0; + ln.first_baseline = 0; + ln.last_baseline = 0; if(is_row_direction) { @@ -294,17 +299,48 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, if(is_row_direction) { // render items into new size and find line cross_size + bool has_baseline_alignment = false; for (auto &item: ln.items) { - item.el->render(el_x, - el_y, + item.el->render(0, + 0, self_size.new_width(item.main_size - item.el->content_offset_width(), containing_block_context::size_mode_exact_width), fmt_ctx, false); + if((item.align & 0xFF) == flex_align_items_baseline) + { + has_baseline_alignment = true; + if(item.align & flex_align_items_last) + { + ln.last_baseline = std::max(ln.last_baseline, item.el->get_last_baseline()); + } else + { + ln.first_baseline = std::max(ln.first_baseline, item.el->get_first_baseline()); + } + } ln.main_size += item.el->width(); ln.cross_size = std::max(ln.cross_size, item.el->height()); - el_x += item.el->width(); + } + if(has_baseline_alignment) + { + int top = 0; + int bottom = 0; + for (auto &item: ln.items) + { + if((item.align & 0xFF) == flex_align_items_baseline) + { + if(item.align & flex_align_items_last) + { + item.el->pos().y = ln.last_baseline - item.el->get_last_baseline() + item.el->content_offset_top(); + } else + { + item.el->pos().y = ln.first_baseline - item.el->get_first_baseline() + item.el->content_offset_top(); + } + } + top = std::min(top, item.el->top()); + bottom = std::max(bottom, item.el->bottom()); + } + ln.cross_size = bottom - top; } sum_cross_size += ln.cross_size; - el_x = 0; } else { for (auto &item: ln.items) @@ -361,7 +397,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, el_x = el_y = 0; bool is_wrap_reverse = css().get_flex_wrap() == flex_wrap_wrap_reverse; - flex_align_content_spread lines_spread(css().get_flex_align_content(), css().get_flex_wrap(), (int) lines.size(), free_cross_size); + flex_align_content_spread lines_spread(css().get_flex_align_content(), css().get_flex_wrap(), (int) m_lines.size(), free_cross_size); if(is_wrap_reverse) { @@ -383,7 +419,8 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } } - for(auto& ln : lines) + int line_num = 0; + for(auto& ln : m_lines) { int free_main_size = container_main_size - ln.main_size; // distribute auto margins @@ -470,8 +507,22 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, el_x -= item.el->width(); item.el->pos().x = el_x + item.el->content_offset_left(); } - switch (item.align) + switch (item.align & 0xFF) { + case flex_align_items_baseline: + if(item.align & flex_align_items_last) + { + item.el->pos().y = el_y + ln.last_baseline - item.el->get_last_baseline() + item.el->content_offset_top(); + m_last_baseline = el_y + ln.last_baseline + content_offset_top(); + } else + { + item.el->pos().y = el_y + ln.first_baseline - item.el->get_first_baseline() + item.el->content_offset_top(); + if(line_num == 0) + { + m_first_baseline = el_y + ln.first_baseline + content_offset_top(); + } + } + break; case flex_align_items_flex_end: case flex_align_items_end: item.el->pos().y = el_y + ln.cross_size - item.el->height() + item.el->content_offset_top(); @@ -512,7 +563,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { el_y -= lines_spread.after_line(); } - } else + } else // if(is_row_direction) { if(!reverse) { @@ -626,7 +677,8 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { el_x -= lines_spread.after_line(); } - } + } // if(is_row_direction) + line_num++; } // calculate the final position @@ -1001,7 +1053,7 @@ std::list litehtml::render_item_flex::get if(!line.items.empty() && !single_line && line.base_size + item.base_size > container_main_size) { lines.push_back(line); - line.clear(); + line = flex_line(); } line.base_size += item.base_size; line.total_grow += item.grow; @@ -1090,3 +1142,49 @@ std::shared_ptr litehtml::render_item_flex::init() return shared_from_this(); } + +int litehtml::render_item_flex::get_first_baseline() +{ + if(css().get_flex_direction() == flex_direction_row || css().get_flex_direction() == flex_direction_row_reverse) + { + if(!m_first_baseline.is_default()) + { + return m_first_baseline; + } + if(!m_last_baseline.is_default()) + { + return m_last_baseline; + } + } + if(!m_lines.empty()) + { + if(!m_lines.front().items.empty()) + { + return m_lines.front().items.front().el->get_first_baseline() + content_offset_top(); + } + } + return height(); +} + +int litehtml::render_item_flex::get_last_baseline() +{ + if(css().get_flex_direction() == flex_direction_row || css().get_flex_direction() == flex_direction_row_reverse) + { + if(!m_last_baseline.is_default()) + { + return m_last_baseline; + } + if(!m_first_baseline.is_default()) + { + return m_first_baseline; + } + } + if(!m_lines.empty()) + { + if(!m_lines.front().items.empty()) + { + return m_lines.front().items.front().el->get_last_baseline() + content_offset_top(); + } + } + return height(); +} diff --git a/src/render_inline_context.cpp b/src/render_inline_context.cpp index 2d8f2e173..4f5d77015 100644 --- a/src/render_inline_context.cpp +++ b/src/render_inline_context.cpp @@ -382,21 +382,30 @@ void litehtml::render_item_inline_context::apply_vertical_align() } } -int litehtml::render_item_inline_context::get_base_line() +int litehtml::render_item_inline_context::get_first_baseline() { - auto el_parent = parent(); - if(el_parent && src_el()->css().get_display() == display_inline_flex) - { - return el_parent->get_base_line(); - } - if(src_el()->is_replaced()) - { - return 0; - } - int bl = 0; - if(!m_line_boxes.empty()) - { - bl = m_line_boxes.back()->baseline() + content_offset_bottom(); - } - return bl; + int bl; + if(!m_line_boxes.empty()) + { + const auto &line = m_line_boxes.front(); + bl = line->bottom() - line->baseline() + content_offset_top(); + } else + { + bl = height() - margin_bottom(); + } + return bl; +} + +int litehtml::render_item_inline_context::get_last_baseline() +{ + int bl; + if(!m_line_boxes.empty()) + { + const auto &line = m_line_boxes.back(); + bl = line->bottom() - line->baseline() + content_offset_top(); + } else + { + bl = height() - margin_bottom(); + } + return bl; } diff --git a/src/render_item.cpp b/src/render_item.cpp index 6791c1a38..72f3a409e 100644 --- a/src/render_item.cpp +++ b/src/render_item.cpp @@ -138,37 +138,6 @@ void litehtml::render_item::apply_relative_shift(const containing_block_context } } -bool litehtml::render_item::get_predefined_height(int& p_height, int containing_block_height) const -{ - css_length h = src_el()->css().get_height(); - if(h.is_predefined()) - { - p_height = m_pos.height; - return false; - } - if(h.units() == css_units_percentage) - { - p_height = h.calc_percent(containing_block_height); - return containing_block_height > 0; - } - p_height = src_el()->get_document()->to_pixels(h, src_el()->css().get_font_size()); - return p_height > 0; -} - -int litehtml::render_item::calc_width(int defVal, int containing_block_width) const -{ - css_length w = src_el()->css().get_width(); - if(w.is_predefined() || src_el()->css().get_display() == display_table_cell) - { - return defVal; - } - if(w.units() == css_units_percentage) - { - return w.calc_percent(containing_block_width); - } - return src_el()->get_document()->to_pixels(w, src_el()->css().get_font_size()); -} - std::tuple< std::shared_ptr, std::shared_ptr, diff --git a/src/style.cpp b/src/style.cpp index 9ce8cdf3f..84a5bb0af 100644 --- a/src/style.cpp +++ b/src/style.cpp @@ -128,9 +128,7 @@ void style::add_property(string_id name, const string& val, const string& baseur case _flex_direction_: case _flex_wrap_: case _justify_content_: - case _align_items_: case _align_content_: - case _align_self_: case _caption_side_: @@ -141,6 +139,11 @@ void style::add_property(string_id name, const string& val, const string& baseur } break; + case _align_items_: + case _align_self_: + parse_align_self(name, val, important); + break; + // case _text_indent_: case _padding_left_: @@ -1088,6 +1091,51 @@ void style::parse_flex(const string& val, bool important) } } +void style::parse_align_self(string_id name, const string& val, bool important) +{ + string_vector tokens; + split_string(val, tokens, " "); + if(tokens.size() == 1) + { + int idx = value_index(val, m_valid_values[name]); + if (idx >= 0) + { + add_parsed_property(name, property_value(idx, important)); + } + } else + { + int val1 = 0; + int val2 = -1; + for(auto &token : tokens) + { + if(token == "first") + { + val1 |= flex_align_items_first; + } else if(token == "last") + { + val1 |= flex_align_items_last; + } else if(token == "safe") + { + val1 |= flex_align_items_safe; + } else if(token == "unsafe") + { + val1 |= flex_align_items_unsafe; + } else + { + int idx = value_index(token, m_valid_values[name]); + if(idx >= 0) + { + val2 = idx; + } + } + } + if(val2 >= 0) + { + add_parsed_property(name, property_value(val1 | val2, important)); + } + } +} + void style::add_parsed_property( string_id name, const property_value& propval ) { auto prop = m_properties.find(name); diff --git a/test/render/flex/align-items-004.htm b/test/render/flex/-align-items-004.htm similarity index 100% rename from test/render/flex/align-items-004.htm rename to test/render/flex/-align-items-004.htm diff --git a/test/render/flex/contain-layout-baseline-002.htm b/test/render/flex/-contain-layout-baseline-002.htm similarity index 100% rename from test/render/flex/contain-layout-baseline-002.htm rename to test/render/flex/-contain-layout-baseline-002.htm diff --git a/test/render/flex/--align-self-006.htm b/test/render/flex/align-self-006.htm similarity index 100% rename from test/render/flex/--align-self-006.htm rename to test/render/flex/align-self-006.htm diff --git a/test/render/flex/align-self-006.htm.png b/test/render/flex/align-self-006.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e877c3605ace85dc00aeb40a37d98d9402160e77 GIT binary patch literal 1026 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*D)~z$<02E=YSMvfKQ0)|NsAiOa_Mk!NG19 zfU355x;TbZFutAY-M7R-pp92Z`dZrkSyxy1HKti=FHd=QI51#+(43-2{RbS%0)u03 zstPXo*RR9%hvWC>ZU+v<76B&?#Us3-`Sr^Ud3Kny%dR%Mba|S{)|CCF;;IuaeW{+f z_LyDPRpl_vi)&Ob>wOC=mtVQ1J;OKCTCVTO#*VNW^`N&dvljhHo%qUg;;Yw6r#WOg zY^GI&{EkSGe_cFr@pgaLU00quzT)BZFFGkZIV00!>V&|5-sf~rpZGTIny1`5SC-6a zT}47mZ9KP#1ZI1vuG%&$XiHciTY0r}*5&fkw{^W`Pi~#JK(%-G6T6NjGp>X&otPX` zbYFLE$AKM>rAq#I&+4m)Nq2Gg{Jdn&kx4aIE)@3f+VUjNbSc}TmjaoRd#9Ie2|q0z z#iO)*?ZSC(dbPhCmYkm7`J`MaHZI*|yWOjD%hS?}7O^e5d#_XB|F!5Rd+xmDJ)5r- z-QBybwaiZ7;E|afC5+ro_r5DR>nSyx^}Sxg1qMl3ngG1ZUXSm>11 zgy$7q9-5iH|L33B;Ii?3RwBdO}6pOta&4 zzCT#~@%75uL=C4C-oa&T=U#9A?KIJSVz=><*)`@LpXOB6+&=&A{N*JUC*nIaLunhbbaMSk+z=7N=Ct*kG#)txSW#P`9{%ZiO7>Hla5|Jaq{ZZ(_McKl}^9b z-BmLE{{dlOA_AqP%4rW-11A1^Gx1NcR+mMy(!B*8<{FQBlPCU^yH#nkJO93-QTK_G zvitjzGq)Pae&782o2=5-jz6_!_vZ=xOqaX=?&~(~XO%h6v(KFnxg~IF-3r$yZ$({h zZIpYzY0ERg>o;Tn+`2UD-m|KC@7}Jkzo{(z?ZlGnsswQYskF$$0_;D*U;9Va>H1SE1{fpp5M4>gTe~DWM4fPtEWE literal 0 HcmV?d00001 diff --git a/test/render/flex/--align-self-010.htm b/test/render/flex/align-self-010.htm similarity index 100% rename from test/render/flex/--align-self-010.htm rename to test/render/flex/align-self-010.htm diff --git a/test/render/flex/align-self-010.htm.png b/test/render/flex/align-self-010.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e877c3605ace85dc00aeb40a37d98d9402160e77 GIT binary patch literal 1026 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OK*D)~z$<02E=YSMvfKQ0)|NsAiOa_Mk!NG19 zfU355x;TbZFutAY-M7R-pp92Z`dZrkSyxy1HKti=FHd=QI51#+(43-2{RbS%0)u03 zstPXo*RR9%hvWC>ZU+v<76B&?#Us3-`Sr^Ud3Kny%dR%Mba|S{)|CCF;;IuaeW{+f z_LyDPRpl_vi)&Ob>wOC=mtVQ1J;OKCTCVTO#*VNW^`N&dvljhHo%qUg;;Yw6r#WOg zY^GI&{EkSGe_cFr@pgaLU00quzT)BZFFGkZIV00!>V&|5-sf~rpZGTIny1`5SC-6a zT}47mZ9KP#1ZI1vuG%&$XiHciTY0r}*5&fkw{^W`Pi~#JK(%-G6T6NjGp>X&otPX` zbYFLE$AKM>rAq#I&+4m)Nq2Gg{Jdn&kx4aIE)@3f+VUjNbSc}TmjaoRd#9Ie2|q0z z#iO)*?ZSC(dbPhCmYkm7`J`MaHZI*|yWOjD%hS?}7O^e5d#_XB|F!5Rd+xmDJ)5r- z-QBybwaiZ7;E|afC5+ro_r5DR>nSyx^}Sxg1qMl3ngG1ZUXSm>11 zgy$7q9-5iH|L33B;Ii?3RwBdO}6pOta&4 zzCT#~@%75uL=C4C-oa&T=U#9A?KIJSVz=><*)`@LpXOB6+&=&A{N*JUC*nIaLunhbbaMSk+z=7N=Ct*kG#)txSW#P`9{%ZiO7>Hla5|Jaq{ZZ(_McKl}^9b z-BmLE{{dlOA_AqP%4rW-11A1^Gx1NcR+mMy(!B*8<{FQBlPCU^yH#nkJO93-QTK_G zvitjzGq)Pae&782o2=5-jz6_!_vZ=xOqaX=?&~(~XO%h6v(KFnxg~IF-3r$yZ$({h zZIpYzY0ERg>o;Tn+`2UD-m|KC@7}Jkzo{(z?ZlGnsswQYskF$$0_;D*U;9Va>H1SE1{fpp5M4>gTe~DWM4fPtEWE literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-align-self-baseline-horiz-001a.htm b/test/render/flex/flexbox-align-self-baseline-horiz-001a.htm similarity index 100% rename from test/render/flex/--flexbox-align-self-baseline-horiz-001a.htm rename to test/render/flex/flexbox-align-self-baseline-horiz-001a.htm diff --git a/test/render/flex/flexbox-align-self-baseline-horiz-001a.htm.png b/test/render/flex/flexbox-align-self-baseline-horiz-001a.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b6a570651b0e9b1762fc8535a8e45acd3b73195b GIT binary patch literal 2293 zcmbtWdo+~$8vf>H#xVJi%KaN=myME3tCPrFlxgoxq#A{UAzg56+il#&EtJbgWsB@e zBzs71qao((VjCLCJO6y9 zV!*e58I}KWuV`Lyx+=EJWHEHUg%7H3RMFj8QjeZ^m?w8|{%c@W7g9qQY=L~f7OrD> z`5z-<-#gsa_?x7mP`%JgfD>W~f?!SsUowW!)P;QZKn%%R+<}IrUaY9ctLbrk_bUCl z`#I1|2gY4(0Yt}9b8jo{qz>+Oqy5=q<4dv|ERWAG#|G#9qtHH!4_T293$KsJ9KxxS zSFCEDIGUur3mhpJXzCsmpI7hqGs9M-$w#dN6Zh z>|GJg!Ov8%3BHE{YlqQ3%Q@G7@As8i#xK9MNN{VRO;4z1b<#n7SNGZ`&q!2m5y&A= zTZ%F&*qg^x4cOwdVw||$ecJC&fd%;#rQ+oD4oVGbJbHA1*H#*&uV9WU(P&-#o`jWR zx!CHMbel@5inQ@p%IWq5nG&3{gBd%W49xju{y~(y+)t9E4oQY3oDnSi$$%p3(t%qx zk%eckcXK{`Fj3)5GFA)ayzEN9d`2NIR836O$!5ei%lN7)hhhU!L#I5TkW`s1RL%)= z9o#C(+Yt50TK1avlA>5P)$j{!Lq5s~MCzl{wb(Hw3gTfle|32WW&8l5gku2x94?=X z9{HJducwg;bZ9Fc-5Ivy;d}L5);UC^iVxc=6UFmTP$c6QUEt?A^|L-8&QNl@XMYJ& zT3xR=!C?)Tk-2eH;d>xG6EkEg$$1lzH+sv4$Q>Tt6RHIF?uJ?M%9tBwS%|Fo!%#-W zuQ|}`Dg8v*BfPH?Y<7V}|MTsTV!GXi6zd;tL3yVh%S0<0p7(wBVH4!-5!iSrPaZp; zs#hiT&x_j!3>Ab9u4MqZTHM}Y$v$G7lz|cbNSy-?YoN=GjJJ>*wXqglWs;DSr~BiE z2m7u;q3(cazzX^pbPFLGVD4c4uBh324Vr-wj=1rL*V<5#BT{V_*Xteor{h|!TUjq~ z1FXt+FJPZb2s{dOAni@bt^Wna1Rwvk7ZYuEz*OaKL5%r4!x2G`PobEa0~U3P;b}$1 zKuPJh6p?kgoqsLQYb%@S$fAlo>)lo~_^90Ddg6d`#_VLLpwon4k&VK`zlBg+t=l&# zZVqXv?H!BQ1)tRY-c|*y#wTrq3{8~BwVT7rQ}th-$C5Y;0(?_+c%-9|cTsJxd%>C1 z1vLGC26AZ$^&uL<{^WdOeiRaJ@ke*; zcfgUy{YPs6i_PR~7|?J15pe16g+A2~Uc@0`qc0n`D-g518hHhULR*9&#s4HR=JnIW zGbsyumC{NdngUb7hrpq#-Ly*u>ZG!7$d?MRt=)^t5Uq<#wWxqyx)c*NEs8ZMvJ)+c zk_Icdtfnbji9bsgQ@a9!6HKQcc`e0#vlMt9)cdQL$gu10QfGS@5yT;F!Tj4bZkY<2 z7hPOE85cM%s^plvlukv;dA3!=5~>`b_8ppdY9H9Bi3@hs=xNMThdNA>P3eyh1=abf zk{>AC8SVxR*d7F`6y#xW`an+|74Q*R(g2@z;wUGQZ>%ib2I?uVh`LhjtSQD8s8%7^ zf=#=iEN~qf3DN%eQocrO5z0Pn9)ZGi$R1bOurDAOL<;8P9?^{HTN0Rn=0zuPuhWV{ z-kTUtB*~b)BJT{2aabPV#IG`23XiDxq*|-nTQ=LM1#$}s%@?Oq>~>Xx5ofVV`jgAW z+u6ydpk+%~!H_+3!a%B9G8lwu)iaag&k@3+FI`Z8@9Tk=&3)khyf&q$=LJXiVLQ4M z`cx8kN-8YDVg{DlmG_2QS+tVToz(LxsiBg}HH#KipVX^4rpBPRnIs1gK-W5|AW^nQ zjcZEDop;`1!uONv@@g+8JdWob*nc+7Ie+N=CF{OE>lt?-1Owt}tJ-O|^v&tSiJL;_ zvJmJ-whoSK>W;bB50*THDKh2#%7xo_1#5Y`Sw=HPpHG5HQXfO%=Dz?zg@+65ATTpwF6z zp6;Cf2m8@4P3Q+`b1i^(515;Mw-%r#$d2YCJspvA^k6TWfvEc^QhoY~G$p8G-P>2$ zR<;0X&lgt%#isvHi-+Vyjge(LBrzGJ;)n|oi`p~Zzok)T2080z3vl?Lll=qgnZ$ns DC++Pm literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-align-self-baseline-horiz-001b.htm b/test/render/flex/flexbox-align-self-baseline-horiz-001b.htm similarity index 100% rename from test/render/flex/--flexbox-align-self-baseline-horiz-001b.htm rename to test/render/flex/flexbox-align-self-baseline-horiz-001b.htm diff --git a/test/render/flex/flexbox-align-self-baseline-horiz-001b.htm.png b/test/render/flex/flexbox-align-self-baseline-horiz-001b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..b6a570651b0e9b1762fc8535a8e45acd3b73195b GIT binary patch literal 2293 zcmbtWdo+~$8vf>H#xVJi%KaN=myME3tCPrFlxgoxq#A{UAzg56+il#&EtJbgWsB@e zBzs71qao((VjCLCJO6y9 zV!*e58I}KWuV`Lyx+=EJWHEHUg%7H3RMFj8QjeZ^m?w8|{%c@W7g9qQY=L~f7OrD> z`5z-<-#gsa_?x7mP`%JgfD>W~f?!SsUowW!)P;QZKn%%R+<}IrUaY9ctLbrk_bUCl z`#I1|2gY4(0Yt}9b8jo{qz>+Oqy5=q<4dv|ERWAG#|G#9qtHH!4_T293$KsJ9KxxS zSFCEDIGUur3mhpJXzCsmpI7hqGs9M-$w#dN6Zh z>|GJg!Ov8%3BHE{YlqQ3%Q@G7@As8i#xK9MNN{VRO;4z1b<#n7SNGZ`&q!2m5y&A= zTZ%F&*qg^x4cOwdVw||$ecJC&fd%;#rQ+oD4oVGbJbHA1*H#*&uV9WU(P&-#o`jWR zx!CHMbel@5inQ@p%IWq5nG&3{gBd%W49xju{y~(y+)t9E4oQY3oDnSi$$%p3(t%qx zk%eckcXK{`Fj3)5GFA)ayzEN9d`2NIR836O$!5ei%lN7)hhhU!L#I5TkW`s1RL%)= z9o#C(+Yt50TK1avlA>5P)$j{!Lq5s~MCzl{wb(Hw3gTfle|32WW&8l5gku2x94?=X z9{HJducwg;bZ9Fc-5Ivy;d}L5);UC^iVxc=6UFmTP$c6QUEt?A^|L-8&QNl@XMYJ& zT3xR=!C?)Tk-2eH;d>xG6EkEg$$1lzH+sv4$Q>Tt6RHIF?uJ?M%9tBwS%|Fo!%#-W zuQ|}`Dg8v*BfPH?Y<7V}|MTsTV!GXi6zd;tL3yVh%S0<0p7(wBVH4!-5!iSrPaZp; zs#hiT&x_j!3>Ab9u4MqZTHM}Y$v$G7lz|cbNSy-?YoN=GjJJ>*wXqglWs;DSr~BiE z2m7u;q3(cazzX^pbPFLGVD4c4uBh324Vr-wj=1rL*V<5#BT{V_*Xteor{h|!TUjq~ z1FXt+FJPZb2s{dOAni@bt^Wna1Rwvk7ZYuEz*OaKL5%r4!x2G`PobEa0~U3P;b}$1 zKuPJh6p?kgoqsLQYb%@S$fAlo>)lo~_^90Ddg6d`#_VLLpwon4k&VK`zlBg+t=l&# zZVqXv?H!BQ1)tRY-c|*y#wTrq3{8~BwVT7rQ}th-$C5Y;0(?_+c%-9|cTsJxd%>C1 z1vLGC26AZ$^&uL<{^WdOeiRaJ@ke*; zcfgUy{YPs6i_PR~7|?J15pe16g+A2~Uc@0`qc0n`D-g518hHhULR*9&#s4HR=JnIW zGbsyumC{NdngUb7hrpq#-Ly*u>ZG!7$d?MRt=)^t5Uq<#wWxqyx)c*NEs8ZMvJ)+c zk_Icdtfnbji9bsgQ@a9!6HKQcc`e0#vlMt9)cdQL$gu10QfGS@5yT;F!Tj4bZkY<2 z7hPOE85cM%s^plvlukv;dA3!=5~>`b_8ppdY9H9Bi3@hs=xNMThdNA>P3eyh1=abf zk{>AC8SVxR*d7F`6y#xW`an+|74Q*R(g2@z;wUGQZ>%ib2I?uVh`LhjtSQD8s8%7^ zf=#=iEN~qf3DN%eQocrO5z0Pn9)ZGi$R1bOurDAOL<;8P9?^{HTN0Rn=0zuPuhWV{ z-kTUtB*~b)BJT{2aabPV#IG`23XiDxq*|-nTQ=LM1#$}s%@?Oq>~>Xx5ofVV`jgAW z+u6ydpk+%~!H_+3!a%B9G8lwu)iaag&k@3+FI`Z8@9Tk=&3)khyf&q$=LJXiVLQ4M z`cx8kN-8YDVg{DlmG_2QS+tVToz(LxsiBg}HH#KipVX^4rpBPRnIs1gK-W5|AW^nQ zjcZEDop;`1!uONv@@g+8JdWob*nc+7Ie+N=CF{OE>lt?-1Owt}tJ-O|^v&tSiJL;_ zvJmJ-whoSK>W;bB50*THDKh2#%7xo_1#5Y`Sw=HPpHG5HQXfO%=Dz?zg@+65ATTpwF6z zp6;Cf2m8@4P3Q+`b1i^(515;Mw-%r#$d2YCJspvA^k6TWfvEc^QhoY~G$p8G-P>2$ zR<;0X&lgt%#isvHi-+Vyjge(LBrzGJ;)n|oi`p~Zzok)T2080z3vl?Lll=qgnZ$ns DC++Pm literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-align-self-baseline-horiz-004.htm b/test/render/flex/flexbox-align-self-baseline-horiz-004.htm similarity index 100% rename from test/render/flex/--flexbox-align-self-baseline-horiz-004.htm rename to test/render/flex/flexbox-align-self-baseline-horiz-004.htm diff --git a/test/render/flex/flexbox-align-self-baseline-horiz-004.htm.png b/test/render/flex/flexbox-align-self-baseline-horiz-004.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..79bcc64cfa80d88842140f2b7592ed538cc99e99 GIT binary patch literal 335 zcmV-V0kHmwP) zjdSm;SRzw?PU{U1u<$)gd@rn15bN|CD(t;#;jFnkYQA?ab~9^^i9H5o)27cr96u*z z;T|Xp_t$OULw#;vnASJE7TH!ih@7?;NX*4_qxkd$40 zoSkO!Iiq4C7?mr+{j%sBliO?SNdVrP!7NwF%HP ziq!mD_=++1Z~AxXlBj@VP7xNZd3ACNRxN2{n_S?T)E5B<8zWd&^$Kk~j)_{ut z?l)$BywQ+&SxvxD@c(kFZT0GbPxX!eumjBkf#?rhF%w$$vSsNoZ<3hO^t@k2Q14Cg`x1@S}G*PY%>TJCh>+Dw6a)}lti3R()M ze>_!eeNt&+Fw~&I`0CR(PTw|9f|D;%TYWl};{K48@LXi7GjToH`YpN_qCpD%i;ZHv?r+0>bL_Jwsm zv+?xPN}V`iQpbNOS?$k)wMeNO!Su_B+@Ng+k& zN$Nv$+w$#~?**QCpQ|V4r0_&rG5wMFsl&l1ey{D>rnJv$SIPQj=S2oRt6qvkDPfoC#m&@i?OJX-Tv=fJH0wWj+eKb(El5y_|RBjQp<-{pOzzMT2?4z zh8H`n5p`w!FO>8)OUdQF^8EG*A&Pf>T1$i#x6N2N;fuh2jg%|1j1;#uOjzH-vnh_F zbTx-$jk|u!sk>a2&%~xgO$=+^vP4IidD3ZP7vmt!Tvgq+=m}eApNa~rX*-eg`^$$5 z-(UQGqth}e@JCHX`ft%ocm1O8@pCi^$U7a-!j?vnl5S7j3GIS|*YtMa$RX@W_!S61y$)a69$R6{D__JqW?bgZ^+_faV{mnDyMlo)ic3jGc z{1cm417_Z){8fu;t~iQYY-o1g-CX!)bj}6%kUjGcU@h2_+f{R^LXW4S1!K}>;`O)q z>>Ff%j2RSDdOY_DZNIecB6cOf!RPuGcna>g8>K34oU@TFv9qc8W7{k@(*#Y8(N8sS z;JB5eCKLCo=&IL}p9otA-6&5+b3F%eW0eh^s+YKJdX$?S93g8qLn51-X*f zg00eq2JoOrIz@795=Uf7Ock0yhU*J_M~uim^J>dobvKv^Q(KrTT18VHgVOq4lrmFA z3YaPPNmzc9R~Vk-v7>%MmGM{`ac`toA7d%Ntvp+PZmx^rTL(Mq!w-d2?oN6P8G@JTJzKFlWJHp1aFLu_1B}vSklqLX8*TaAY!6?PEgw6^s z+a&T0J$6KcUQ~-x+l#7->0v(xFYke4_#n^ zT}#+BU=*79F57@)4h7D5cNoBUrSU&|h$cQ`4EZ=f?oN=DIEVRCowWWMB-FFWjWHzN zL(ZOUjy;UT;lBCMpsw+E@vD~wDFR5!nOPE2BGDrRmf~BGnj|1yBXDGxAD&n55_f|u zuD6+SLnltuR>^xJa4%bAIx78hsl%NidsbYsilygq7h4woL z4bIfw+@-YwOOHYrb{!vCYln-h(@4$^QAZYcR~@&y5HYJq;+_BeRg#t&f2qwOebKIw zGXk`P@W#3x8i+lR_N3qLgP_N8YR+c|5kd$5z>U1ATv@;?|t9aG9_Y>2?N6Z=2F! zK*gJ``RGcQusamzSQbN(*}4%bCzi!Rzf+Mln>h*48Vf9UZTAdUj{ktll%&0_wOt3X z24P&Zj-~e#r7wQ`iyxEQ4w46G{SyW)d|whPZHmyE1SPqTupgbAQL{)4v=ml`n< z@qo0K2(_>)0!tHn{zfGg8tjI}L<6^l{CpQ^GZ>wO5wqSC<0%22CxuH`+2nsP{}oz? z{{JC}0HvSo!@!06788;X#El(Q=Lt%A6;N9#@uaRIjY7o+cpJwcCYP)_CHpjb?^say z?LXWTT?!<%0o1A<23#Fl9DDkkG=k#Rg08S+arV9>WZ=-aXzrRG`!I--)76vpP3@w+ z%SAbjjmp{d)iN>2i*IsW(1UA#D>TyLk#7y{)=A^(xV6dicm$p?^0T6t3>K(x`#Sk= DPRf^Q literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-baseline-align-self-baseline-horiz-001.htm b/test/render/flex/flexbox-baseline-align-self-baseline-horiz-001.htm similarity index 100% rename from test/render/flex/--flexbox-baseline-align-self-baseline-horiz-001.htm rename to test/render/flex/flexbox-baseline-align-self-baseline-horiz-001.htm diff --git a/test/render/flex/flexbox-baseline-align-self-baseline-horiz-001.htm.png b/test/render/flex/flexbox-baseline-align-self-baseline-horiz-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..6fc471302420239d4ab31127725d13f168c6e5a0 GIT binary patch literal 281 zcmV+!0p|XRP)=KRJvJl=9oDz|{$=&pp$A*N-JamS5=9!?BlL_;hj6)*KaUr2!;z}zp z%nvmYxWpX@R|7!J(hz8|O1$)wY6QEF1Pa0MMp){w#7_D+q4LMPjJ#ThRZ<2}k6XqV ftK=IW?C+8%!>>oC_3s>;00000NkvXXu0mjfA`x}7 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-baseline-align-self-baseline-vert-001.htm b/test/render/flex/flexbox-baseline-align-self-baseline-vert-001.htm similarity index 100% rename from test/render/flex/--flexbox-baseline-align-self-baseline-vert-001.htm rename to test/render/flex/flexbox-baseline-align-self-baseline-vert-001.htm diff --git a/test/render/flex/flexbox-baseline-align-self-baseline-vert-001.htm.png b/test/render/flex/flexbox-baseline-align-self-baseline-vert-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..9c4d99ea229aeb469b7353e29450c972b65d8a48 GIT binary patch literal 305 zcmV-10nYx3P)@R4oKy(dT#b_F{!!ul(Y-RS|m zctDfY&qFC2*)7M}<^h4R;y;PD!ah}!ahGkGvxz;aIU8}dj8ACINa_{r}iZ(brk{17t=P|!o18K{| zEZoKDaOD;@Rtj`gtLi@-br-fxj)z|@-RAmJbA5gSv4S)O3@5hZ00000NkvXXu0mjf DaO!~| literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-baseline-multi-item-horiz-001a.htm b/test/render/flex/flexbox-baseline-multi-item-horiz-001a.htm similarity index 100% rename from test/render/flex/--flexbox-baseline-multi-item-horiz-001a.htm rename to test/render/flex/flexbox-baseline-multi-item-horiz-001a.htm diff --git a/test/render/flex/flexbox-baseline-multi-item-horiz-001a.htm.png b/test/render/flex/flexbox-baseline-multi-item-horiz-001a.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..10b053cec08c56c6cb8c531c17bfd10abfbff0eb GIT binary patch literal 192 zcmeAS@N?(olHy`uVBq!ia0vp^9zd+c#0(^J_kV2#Qk(%kA+G=b|6hCK8IU*8sZkI} z6?wWihEy}k>1f_#BepsA%%e}>cL(Fpd za;@8YpKxkBgdmJ}k>1f_#BepsA%%e}>cL(Fpd za;@8YpKxkBgdmJiI&AmmNRmJ?Hv0QCmhiXYte8_UX!J zNY9g`-`4axUW(ze%msP-5pPMhTZ$C>XR`S s))?m{@cQ7vg9rZ){=)oC9`)sV0Ha;0`a;3VO8@`>07*qoM6N<$g8k@g5C8xG literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-baseline-multi-line-horiz-002.htm b/test/render/flex/flexbox-baseline-multi-line-horiz-002.htm similarity index 100% rename from test/render/flex/--flexbox-baseline-multi-line-horiz-002.htm rename to test/render/flex/flexbox-baseline-multi-line-horiz-002.htm diff --git a/test/render/flex/flexbox-baseline-multi-line-horiz-002.htm.png b/test/render/flex/flexbox-baseline-multi-line-horiz-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..394239381b6ca2ee4b46aa572c60272a3d4b0f85 GIT binary patch literal 244 zcmV%wG z4qHCM%HuAl>6{efNaigP3H)wtfrvZ?yIzB7RU00006lV2)(k&^p(V9OE-a!QC3TJv!0 zlvX@sPZ4}}o!E`WJHrgIH5a5RujNdta^=dEE9W_I+^)eRA^&if+TZX$f2p2`3;1(K ztDi<5efDkPA$_@NT>96+*i4_#zRlH-S8m4YK=|HJ?uY6Ow+|ezD(85!()&y^sdwb` zW%#Q;UxG}mmF*0^rkt1aF35N%Uf{5RPw%@STZr6>c?`47;8e=v;c%xp&b$m>%3~b| z(u}L)MsQV-a&Bjo|01__yj#Fy9Y4TVa#zPcY6+ApS1w9jhjXdQU*H-W#TnJR2YRT9 Rm#_c;002ovPDHLkV1mqqlb8Si literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-baseline-multi-line-vert-001.htm b/test/render/flex/flexbox-baseline-multi-line-vert-001.htm similarity index 100% rename from test/render/flex/--flexbox-baseline-multi-line-vert-001.htm rename to test/render/flex/flexbox-baseline-multi-line-vert-001.htm diff --git a/test/render/flex/flexbox-baseline-multi-line-vert-001.htm.png b/test/render/flex/flexbox-baseline-multi-line-vert-001.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..38a3400fa23e60f094a0020156680c03a2ed71df GIT binary patch literal 251 zcmVhrJ{XGH#YRIna`E$Xs(H!!FeR;im{ZbygzjlryWi*T zVh^+N<)<0G%w8M^x$)06VSW{Jt8Bv#9yhrJ{XG!L~D!uYZIg zL7K}-`RyZX%1*Pa6zz2sm*n+WAMdq(Rq=~h6GP5J{OkdbK{XS7@=GC=^fjgXC8gg> zIyali+?R9EH&Cb_W#ac z1dq7)k96v%Z+J|V-ktt0wob$ZY*h)S`3S`Lr+XV#cM z4;j8MnV{miwPv2k`|9_{G}rCy$*BC5H|No>$bFBs{qOe%OE@KS^eURPUBJc&R!`AW zj+(bmdijsJ=hy$3{rr61oI?Uq&KW!l4O@<3XPjz*Sk|^g>eQbb>&dlng>cZb%SJ3X zECJcS%|LA_(408SO0ih-;-@cnEnMeL zFq%J2(E!cMzH=u)-MYxnW2XOU0SPp3V%n$T`TwSUq-?u>f{utaD3&~3{an^LB{Ts5 Dm{-88 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-break-request-vert-002b.htm b/test/render/flex/flexbox-break-request-vert-002b.htm similarity index 100% rename from test/render/flex/--flexbox-break-request-vert-002b.htm rename to test/render/flex/flexbox-break-request-vert-002b.htm diff --git a/test/render/flex/flexbox-break-request-vert-002b.htm.png b/test/render/flex/flexbox-break-request-vert-002b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..c2139c89a3a1e6d27bdce1bf92a264423a83ae7a GIT binary patch literal 479 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKuQ4$L$q-w$ZY*h)S`3S`Lr+XV#cM z4;j8MnV{miwPv2k`|9_{G}rCy$*BC5H|No>$bFBs{qOe%OE@KS^eURPUBJc&R!`AW zj+(bmdijsJ=hy$3{rr61oI?Uq&KW!l4O@<3XPjz*Sk|^g>eQbb>&dlng>cZb%SJ3X zECJcS%|LA_(408SO0ih-;-@cnEnMeL zFq%J2(E!cMzH=u)-MYxnW2XOU0SPp3V%n$T`TwSUq-?u>f{utaD3&~3{an^LB{Ts5 Dm{-88 literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_align-items-baseline.htm b/test/render/flex/flexbox_align-items-baseline.htm similarity index 100% rename from test/render/flex/--flexbox_align-items-baseline.htm rename to test/render/flex/flexbox_align-items-baseline.htm diff --git a/test/render/flex/flexbox_align-items-baseline.htm.png b/test/render/flex/flexbox_align-items-baseline.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..2b55682407527b4404b7e95d875ac0a6ec1b59c9 GIT binary patch literal 397 zcmeAS@N?(olHy`uVBq!ia0y~yVEhDRH?c4SN&i>j(}0vvfKQ0)|NsAiOa=xJ{r|w} zwKtwk&-xezRBq#!pI&Ku>ba{QI@rfnS^5MO)a$SB zn*#?me=ylIYVHd@v!##dRoH6MIg{h~j KpUXO@geCwf(amT8 literal 0 HcmV?d00001 diff --git a/test/render/flex/percentage-heights-004.htm.png b/test/render/flex/percentage-heights-004.htm.png index 49b741d0c8495319a63141a1a4362504c4aa4087..4eca9e2330752003273608791cf76eaac4f33bce 100644 GIT binary patch delta 51 zcmdnZv6EwhIM)j%W(Ed^EZ>a%6BQ*GUvIQ}&MaZIrk?SxOLKj3hDR_^lEKr}&t;uc GLK6V3j1ZLo delta 53 zcmdnVv72LpIM*8{W(Ed^k9V|IPE?d&e7n)=IkS`#hpoqdrVqi*_1>$ag@Muxp00i_ I>zopr0O~3c*#H0l From 6ad0c533c4663b0ebef0fd8789a88e1ac42552b3 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Tue, 9 Jan 2024 23:50:17 +0300 Subject: [PATCH 68/73] fixed rendering of
tag with the 'clear' property --- src/line_box.cpp | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/src/line_box.cpp b/src/line_box.cpp index 2cf5f8502..e739e63c8 100644 --- a/src/line_box.cpp +++ b/src/line_box.cpp @@ -555,6 +555,12 @@ bool litehtml::line_box::can_hold(const std::unique_ptr& item, wh if(item->get_type() == line_box_item::type_text_part) { + // force new line on floats clearing + if (item->get_el()->src_el()->is_break() && item->get_el()->src_el()->css().get_clear() != clear_none) + { + return false; + } + auto last_el = get_last_text_part(); // the first word is always can be hold @@ -564,7 +570,8 @@ bool litehtml::line_box::can_hold(const std::unique_ptr& item, wh } // force new line if the last placed element was line break - if (last_el && last_el->src_el()->is_break()) + // Skip If there are the only break item - this is float clearing + if (last_el && last_el->src_el()->is_break() && m_items.size() > 1) { return false; } @@ -603,6 +610,12 @@ bool litehtml::line_box::have_last_space() const bool litehtml::line_box::is_empty() const { if(m_items.empty()) return true; + if(m_items.size() == 1 && + m_items.front()->get_el()->src_el()->is_break() && + m_items.front()->get_el()->src_el()->css().get_clear() != clear_none) + { + return true; + } for (const auto& el : m_items) { if(el->get_type() == line_box_item::type_text_part) From 7f7723624675e8106929c8647f238390b7b1d5d9 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Thu, 11 Jan 2024 03:08:38 +0300 Subject: [PATCH 69/73] flex: support for auto-margins in the cross direction --- include/litehtml/render_flex.h | 24 +- src/render_flex.cpp | 281 +++++++++++------- ...flexbox-align-self-baseline-horiz-002.htm} | 0 ...xbox-align-self-baseline-horiz-002.htm.png | Bin 0 -> 401 bytes ...flexbox-align-self-baseline-horiz-003.htm} | 0 ...xbox-align-self-baseline-horiz-003.htm.png | Bin 0 -> 398 bytes 6 files changed, 195 insertions(+), 110 deletions(-) rename test/render/flex/{--flexbox-align-self-baseline-horiz-002.htm => flexbox-align-self-baseline-horiz-002.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-baseline-horiz-002.htm.png rename test/render/flex/{--flexbox-align-self-baseline-horiz-003.htm => flexbox-align-self-baseline-horiz-003.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-baseline-horiz-003.htm.png diff --git a/include/litehtml/render_flex.h b/include/litehtml/render_flex.h index 41c3b6c04..b34c2e494 100644 --- a/include/litehtml/render_flex.h +++ b/include/litehtml/render_flex.h @@ -20,8 +20,10 @@ namespace litehtml bool frozen; int order; int src_order; - def_value auto_margin_start; - def_value auto_margin_end; + def_value auto_margin_main_start; + def_value auto_margin_main_end; + bool auto_margin_cross_start; + bool auto_margin_cross_end; flex_align_items align; explicit flex_item(std::shared_ptr &_el) : @@ -37,8 +39,10 @@ namespace litehtml order(0), src_order(0), scaled_flex_shrink_factor(0), - auto_margin_start(0), - auto_margin_end(0) + auto_margin_main_start(0), + auto_margin_main_end(0), + auto_margin_cross_start(false), + auto_margin_cross_end(false) {} bool operator<(const flex_item& b) const @@ -58,8 +62,10 @@ namespace litehtml int base_size; int total_grow; int total_shrink; - int num_auto_margin_start; // number of items with auto margin left/top - int num_auto_margin_end; // number of items with auto margin right/bottom + int num_auto_margin_main_start; // number of items with auto margin left/top + int num_auto_margin_main_end; // number of items with auto margin right/bottom + int num_auto_margin_cross_start; // number of items with auto margin left/top + int num_auto_margin_cross_end; // number of items with auto margin right/bottom int first_baseline; int last_baseline; @@ -70,8 +76,10 @@ namespace litehtml base_size(0), total_shrink(0), main_size(0), - num_auto_margin_start(0), - num_auto_margin_end(0), + num_auto_margin_main_start(0), + num_auto_margin_main_end(0), + num_auto_margin_cross_start(0), + num_auto_margin_cross_end(0), first_baseline(0), last_baseline(0) {} diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 84946900b..95a823fd4 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -367,6 +367,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, int free_cross_size = 0; int cross_end = 0; + bool is_wrap_reverse = css().get_flex_wrap() == flex_wrap_wrap_reverse; if(container_main_size == 0) { container_main_size = sum_main_size; @@ -381,7 +382,7 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, height -= box_sizing_height(); } free_cross_size = height - sum_cross_size; - cross_end = std::max(sum_cross_size, height); + cross_end = height; } else { cross_end = sum_cross_size; @@ -395,7 +396,6 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, // Find line cross size and align items el_x = el_y = 0; - bool is_wrap_reverse = css().get_flex_wrap() == flex_wrap_wrap_reverse; flex_align_content_spread lines_spread(css().get_flex_align_content(), css().get_flex_wrap(), (int) m_lines.size(), free_cross_size); @@ -424,21 +424,21 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { int free_main_size = container_main_size - ln.main_size; // distribute auto margins - if(free_main_size > 0 && (ln.num_auto_margin_start || ln.num_auto_margin_end)) + if(free_main_size > 0 && (ln.num_auto_margin_main_start || ln.num_auto_margin_main_end)) { int add = (int) (free_main_size / (ln.items.size() * 2)); for (auto &item: ln.items) { - if(!item.auto_margin_start.is_default()) + if(!item.auto_margin_main_start.is_default()) { - item.auto_margin_start = add; + item.auto_margin_main_start = add; item.main_size += add; ln.main_size += add; free_main_size -= add; } - if(!item.auto_margin_end.is_default()) + if(!item.auto_margin_main_end.is_default()) { - item.auto_margin_end = add; + item.auto_margin_main_end = add; item.main_size += add; ln.main_size += add; free_main_size -= add; @@ -448,15 +448,15 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, { for (auto &item: ln.items) { - if(!item.auto_margin_start.is_default()) + if(!item.auto_margin_main_start.is_default()) { - item.auto_margin_start = item.auto_margin_start + 1; + item.auto_margin_main_start = item.auto_margin_main_start + 1; free_main_size--; if(!free_main_size) break; } - if(!item.auto_margin_end.is_default()) + if(!item.auto_margin_main_end.is_default()) { - item.auto_margin_end = item.auto_margin_end + 1; + item.auto_margin_main_end = item.auto_margin_main_end + 1; free_main_size--; if(!free_main_size) break; } @@ -465,6 +465,11 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } ln.cross_size += lines_spread.add_line_size(); + if(is_wrap_reverse) + { + ln.first_baseline += lines_spread.add_line_size(); + ln.last_baseline += lines_spread.add_line_size(); + } flex_justify_content_spread content_spread(css().get_flex_justify_content(), (int) ln.items.size(), @@ -488,12 +493,12 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, for (auto &item: ln.items) { // apply auto margins to item - if(!item.auto_margin_start.is_default()) + if(!item.auto_margin_main_start.is_default()) { - item.el->get_margins().left = item.auto_margin_start; - item.el->pos().x += item.auto_margin_start; + item.el->get_margins().left = item.auto_margin_main_start; + item.el->pos().x += item.auto_margin_main_start; } - if(!item.auto_margin_end.is_default()) item.el->get_margins().right = item.auto_margin_end; + if(!item.auto_margin_main_end.is_default()) item.el->get_margins().right = item.auto_margin_main_end; if(!reverse) { // justify content [before_item] @@ -507,44 +512,72 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, el_x -= item.el->width(); item.el->pos().x = el_x + item.el->content_offset_left(); } - switch (item.align & 0xFF) + if(item.auto_margin_cross_end || item.auto_margin_cross_start) { - case flex_align_items_baseline: - if(item.align & flex_align_items_last) - { - item.el->pos().y = el_y + ln.last_baseline - item.el->get_last_baseline() + item.el->content_offset_top(); - m_last_baseline = el_y + ln.last_baseline + content_offset_top(); - } else - { - item.el->pos().y = el_y + ln.first_baseline - item.el->get_first_baseline() + item.el->content_offset_top(); - if(line_num == 0) + int margins_num = 0; + if(item.auto_margin_cross_end) + { + margins_num++; + } + if(item.auto_margin_cross_start) + { + margins_num++; + } + int margin = (ln.cross_size - item.el->height()) / margins_num; + if(item.auto_margin_cross_start) + { + item.el->get_margins().top = margin; + item.el->pos().y = el_y + item.el->content_offset_top(); + } + if(item.auto_margin_cross_end) + { + item.el->get_margins().bottom = margin; + } + } else + { + switch (item.align & 0xFF) + { + case flex_align_items_baseline: + if (item.align & flex_align_items_last) + { + item.el->pos().y = el_y + ln.last_baseline - item.el->get_last_baseline() + + item.el->content_offset_top(); + m_last_baseline = el_y + ln.last_baseline + content_offset_top(); + } else { - m_first_baseline = el_y + ln.first_baseline + content_offset_top(); + item.el->pos().y = el_y + ln.first_baseline - item.el->get_first_baseline() + + item.el->content_offset_top(); + if (line_num == 0) + { + m_first_baseline = el_y + ln.first_baseline + content_offset_top(); + } } - } - break; - case flex_align_items_flex_end: - case flex_align_items_end: - item.el->pos().y = el_y + ln.cross_size - item.el->height() + item.el->content_offset_top(); - break; - case flex_align_items_center: - item.el->pos().y = el_y + ln.cross_size / 2 - item.el->height() /2 + item.el->content_offset_top(); - break; - case flex_align_items_flex_start: - case flex_align_items_start: - item.el->pos().y = el_y + item.el->content_offset_top(); - break; - default: - item.el->pos().y = el_y + item.el->content_offset_top(); - if(item.el->css().get_height().is_predefined()) - { - // TODO: must be rendered into the specified height - item.el->pos().height = ln.cross_size - item.el->content_offset_height(); - } else if(is_wrap_reverse) - { + break; + case flex_align_items_flex_end: + case flex_align_items_end: item.el->pos().y = el_y + ln.cross_size - item.el->height() + item.el->content_offset_top(); - } - break; + break; + case flex_align_items_center: + item.el->pos().y = + el_y + ln.cross_size / 2 - item.el->height() / 2 + item.el->content_offset_top(); + break; + case flex_align_items_flex_start: + case flex_align_items_start: + item.el->pos().y = el_y + item.el->content_offset_top(); + break; + default: + item.el->pos().y = el_y + item.el->content_offset_top(); + if (item.el->css().get_height().is_predefined()) + { + // TODO: must be rendered into the specified height + item.el->pos().height = ln.cross_size - item.el->content_offset_height(); + } else if (is_wrap_reverse) + { + item.el->pos().y = + el_y + ln.cross_size - item.el->height() + item.el->content_offset_top(); + } + break; + } } m_pos.height = std::max(m_pos.height, item.el->bottom()); // justify content [after_item] @@ -591,12 +624,12 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, for (auto &item: ln.items) { // apply auto margins to item - if(!item.auto_margin_start.is_default()) + if(!item.auto_margin_main_start.is_default()) { - item.el->get_margins().top = item.auto_margin_start; - item.el->pos().y += item.auto_margin_start; + item.el->get_margins().top = item.auto_margin_main_start; + item.el->pos().y += item.auto_margin_main_start; } - if(!item.auto_margin_end.is_default()) item.el->get_margins().bottom = item.auto_margin_end; + if(!item.auto_margin_main_end.is_default()) item.el->get_margins().bottom = item.auto_margin_main_end; if(!reverse) { @@ -613,52 +646,80 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, el_y -= item.el->height(); item.el->pos().y = el_y + item.el->content_offset_top(); } - switch (item.align) + if(item.auto_margin_cross_end || item.auto_margin_cross_start) { - case flex_align_items_flex_end: - case flex_align_items_end: - item.el->pos().x = el_x + ln.cross_size - item.el->width() + item.el->content_offset_left(); - break; - case flex_align_items_center: - item.el->pos().x = el_x + ln.cross_size / 2 - item.el->width() /2 + item.el->content_offset_left(); - break; - case flex_align_items_start: - case flex_align_items_flex_start: - item.el->pos().x = el_x + item.el->content_offset_left(); - break; - default: + int margins_num = 0; + if(item.auto_margin_cross_end) + { + margins_num++; + } + if(item.auto_margin_cross_start) + { + margins_num++; + } + int margin = (ln.cross_size - item.el->height()) / margins_num; + if(item.auto_margin_cross_start) + { + item.el->get_margins().left = margin; item.el->pos().x = el_x + item.el->content_offset_left(); - if(!item.el->css().get_width().is_predefined()) - { - item.el->render(el_x, - item.el->pos().y - item.el->content_offset_top(), - self_size.new_width_height(ln.cross_size, - item.main_size - item.el->content_offset_height(), - containing_block_context::size_mode_exact_height), - fmt_ctx, false); - } else - { - item.el->render(el_x, - item.el->pos().y - item.el->content_offset_top(), - self_size.new_width_height(ln.cross_size - item.el->content_offset_width(), - item.main_size - item.el->content_offset_height(), - containing_block_context::size_mode_exact_width | - containing_block_context::size_mode_exact_height), - fmt_ctx, false); - } - // apply auto margins to item after rendering - if(!item.auto_margin_start.is_default()) - { - item.el->get_margins().top = item.auto_margin_start; - item.el->pos().y += item.auto_margin_start; - } - if(!item.auto_margin_end.is_default()) item.el->get_margins().bottom = item.auto_margin_end; - - if(!item.el->css().get_width().is_predefined() && is_wrap_reverse) - { + } + if(item.auto_margin_cross_end) + { + item.el->get_margins().right = margin; + } + } else + { + switch (item.align) + { + case flex_align_items_flex_end: + case flex_align_items_end: item.el->pos().x = el_x + ln.cross_size - item.el->width() + item.el->content_offset_left(); - } - break; + break; + case flex_align_items_center: + item.el->pos().x = + el_x + ln.cross_size / 2 - item.el->width() / 2 + item.el->content_offset_left(); + break; + case flex_align_items_start: + case flex_align_items_flex_start: + item.el->pos().x = el_x + item.el->content_offset_left(); + break; + default: + item.el->pos().x = el_x + item.el->content_offset_left(); + if (!item.el->css().get_width().is_predefined()) + { + item.el->render(el_x, + item.el->pos().y - item.el->content_offset_top(), + self_size.new_width_height(ln.cross_size, + item.main_size - + item.el->content_offset_height(), + containing_block_context::size_mode_exact_height), + fmt_ctx, false); + } else + { + item.el->render(el_x, + item.el->pos().y - item.el->content_offset_top(), + self_size.new_width_height( + ln.cross_size - item.el->content_offset_width(), + item.main_size - item.el->content_offset_height(), + containing_block_context::size_mode_exact_width | + containing_block_context::size_mode_exact_height), + fmt_ctx, false); + } + // apply auto margins to item after rendering + if (!item.auto_margin_main_start.is_default()) + { + item.el->get_margins().top = item.auto_margin_main_start; + item.el->pos().y += item.auto_margin_main_start; + } + if (!item.auto_margin_main_end.is_default()) item.el->get_margins().bottom = item.auto_margin_main_end; + + if (!item.el->css().get_width().is_predefined() && is_wrap_reverse) + { + item.el->pos().x = + el_x + ln.cross_size - item.el->width() + item.el->content_offset_left(); + } + break; + } } m_pos.height = std::max(m_pos.height, item.el->bottom()); // justify content [after_item] @@ -899,11 +960,19 @@ std::list litehtml::render_item_flex::get { if(item.el->css().get_margins().left.is_predefined()) { - item.auto_margin_start = 0; + item.auto_margin_main_start = 0; } if(item.el->css().get_margins().right.is_predefined()) { - item.auto_margin_end = 0; + item.auto_margin_main_end = 0; + } + if(item.el->css().get_margins().top.is_predefined()) + { + item.auto_margin_cross_start = true; + } + if(item.el->css().get_margins().bottom.is_predefined()) + { + item.auto_margin_cross_end = true; } if (item.el->css().get_min_width().is_predefined()) { @@ -965,11 +1034,19 @@ std::list litehtml::render_item_flex::get { if(item.el->css().get_margins().top.is_predefined()) { - item.auto_margin_start = 0; + item.auto_margin_main_start = 0; } if(item.el->css().get_margins().bottom.is_predefined()) { - item.auto_margin_end = 0; + item.auto_margin_main_end = 0; + } + if(item.el->css().get_margins().left.is_predefined()) + { + item.auto_margin_cross_start = true; + } + if(item.el->css().get_margins().right.is_predefined()) + { + item.auto_margin_cross_end = true; } if (item.el->css().get_min_height().is_predefined()) { @@ -1058,8 +1135,8 @@ std::list litehtml::render_item_flex::get line.base_size += item.base_size; line.total_grow += item.grow; line.total_shrink += item.shrink; - if(!item.auto_margin_start.is_default()) line.num_auto_margin_start++; - if(!item.auto_margin_end.is_default()) line.num_auto_margin_end++; + if(!item.auto_margin_main_start.is_default()) line.num_auto_margin_main_start++; + if(!item.auto_margin_main_end.is_default()) line.num_auto_margin_main_end++; line.items.push_back(item); } // Add the last line to the lines list diff --git a/test/render/flex/--flexbox-align-self-baseline-horiz-002.htm b/test/render/flex/flexbox-align-self-baseline-horiz-002.htm similarity index 100% rename from test/render/flex/--flexbox-align-self-baseline-horiz-002.htm rename to test/render/flex/flexbox-align-self-baseline-horiz-002.htm diff --git a/test/render/flex/flexbox-align-self-baseline-horiz-002.htm.png b/test/render/flex/flexbox-align-self-baseline-horiz-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..da39c4295a7e4272512a190d653ab54fcb4e6a27 GIT binary patch literal 401 zcmV;C0dD?@P)b>!3`IS3N|r8K+-phq%h1V-kD#k$=sjAX ztpxq5j3}Z-tmwZfg!4eqq{)Sl8E_%t`^0riy!MGN?};~xmAFM~#@(9HD6VlB(Olz5 zlS5I)ysVz{uP2HWDNZN4knjt65Kj3XT>8XwzChRi6Jg}w=E0MCGGWL;geUd4@JHen ztr>S~#zKT6-w@YWh;qS45TV8{vHY)H6r0-2xLY$CMR>)>7JF)hxo-4P{stPN{Fvg6 zZ=jh`YBMwng71u~jR@(#1|SY2nrl=ZDCk<3Saz*1qfvx+cx=&J<1dpVE~|#*XR0ekv%{7iR vITU5lysYHwEe8}SQhXHAg@jiJgb(VT3`Ms{WjASPoNK}TT%@AeBXAWLxkoay zSr`;ni_l~eF#lDSnP)5{&;q~=7#Fc^;%oZ!0uds_>BO6lytj#OpOFuUh3JEJ$5p$d zQoMy>M0JiMbq+)x^ z>0W+%AB=$fzMP0&DIPq?y^04p=I4BNs^w#~Dn+jpN!ERf>KvtYY!E9WfEW1{h$r`^ z@>ucrW`i#s-&3VX{x{#n-HGZPD|O^c*CghpYuiyNl7sA9ROd)LhrKryk$)>k6OD`5 sA0k;HLCH0VkEIE Date: Wed, 17 Jan 2024 22:00:00 +0800 Subject: [PATCH 70/73] media_query: Treat unknown media type as none According to https://www.w3.org/TR/mediaqueries-5/ section 3.2, Error Handling, an unknown media-type must be treated as not matching. --- src/media_query.cpp | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/media_query.cpp b/src/media_query.cpp index 7cddb15a2..8c2afff27 100644 --- a/src/media_query.cpp +++ b/src/media_query.cpp @@ -88,8 +88,7 @@ litehtml::media_query::ptr litehtml::media_query::create_from_string(const strin } } else { - query->m_media_type = (media_type) value_index(token, media_type_strings, media_type_all); - + query->m_media_type = (media_type) value_index(token, media_type_strings, media_type_none); } } From f195ffbd084e41bab9a3482e9ebfe95dcc65ebb6 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Mon, 15 Jan 2024 04:16:50 +0300 Subject: [PATCH 71/73] flex: refactoring flexbox redering --- CMakeLists.txt | 5 +- include/litehtml/flex_item.h | 137 +++ include/litehtml/flex_line.h | 56 ++ include/litehtml/render_flex.h | 87 +- include/litehtml/types.h | 64 +- src/flex_item.cpp | 435 ++++++++ src/flex_line.cpp | 454 +++++++++ src/render_flex.cpp | 949 ++++-------------- ...xbox-align-self-baseline-horiz-007.htm.png | Bin 905 -> 913 bytes ...5.htm => flexbox-align-self-horiz-005.htm} | 0 .../flex/flexbox-align-self-horiz-005.htm.png | Bin 0 -> 2876 bytes ...xbox-baseline-multi-line-horiz-002.htm.png | Bin 244 -> 256 bytes ...exbox-baseline-multi-line-vert-002.htm.png | Bin 252 -> 255 bytes ...flexbox-justify-content-horiz-001a.htm.png | Bin 334 -> 324 bytes ...flexbox-justify-content-horiz-001b.htm.png | Bin 334 -> 324 bytes .../flexbox-justify-content-horiz-002.htm.png | Bin 1288 -> 1268 bytes .../flexbox-justify-content-horiz-005.htm.png | Bin 865 -> 866 bytes .../flexbox-justify-content-horiz-006.htm.png | Bin 391 -> 401 bytes .../flexbox-justify-content-vert-001a.htm.png | Bin 439 -> 450 bytes .../flexbox-justify-content-vert-001b.htm.png | Bin 439 -> 450 bytes .../flexbox-justify-content-vert-002.htm.png | Bin 919 -> 901 bytes .../flexbox-justify-content-vert-006.htm.png | Bin 461 -> 464 bytes ....htm => flexbox-margin-auto-horiz-002.htm} | 0 .../flexbox-margin-auto-horiz-002.htm.png | Bin 0 -> 293 bytes .../flex/flexbox-overflow-horiz-003.htm.png | Bin 190 -> 184 bytes ...004.htm => flexbox-overflow-horiz-004.htm} | 0 .../flex/flexbox-overflow-horiz-004.htm.png | Bin 0 -> 180 bytes .../flex/flexbox-overflow-vert-003.htm.png | Bin 177 -> 173 bytes ...-004.htm => flexbox-overflow-vert-004.htm} | 0 .../flex/flexbox-overflow-vert-004.htm.png | Bin 0 -> 162 bytes ...-1.htm => flexbox-single-line-clamp-1.htm} | 0 .../flex/flexbox-single-line-clamp-1.htm.png | Bin 0 -> 404 bytes .../flexbox-whitespace-handling-002.htm.png | Bin 910 -> 902 bytes .../flexbox-with-pseudo-elements-001.htm.png | Bin 535 -> 524 bytes .../flex/flexbox_absolute-atomic.htm.png | Bin 237 -> 257 bytes .../flex/justify-content_space-around.htm.png | Bin 3050 -> 3057 bytes ...i-line-wrap-reverse-column-reverse.htm.png | Bin 1446 -> 1622 bytes ...ulti-line-wrap-with-column-reverse.htm.png | Bin 627 -> 636 bytes ...tm => multiline-reverse-wrap-baseline.htm} | 0 .../multiline-reverse-wrap-baseline.htm.png | Bin 0 -> 1312 bytes 40 files changed, 1323 insertions(+), 864 deletions(-) create mode 100644 include/litehtml/flex_item.h create mode 100644 include/litehtml/flex_line.h create mode 100644 src/flex_item.cpp create mode 100644 src/flex_line.cpp rename test/render/flex/{--flexbox-align-self-horiz-005.htm => flexbox-align-self-horiz-005.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-horiz-005.htm.png rename test/render/flex/{--flexbox-margin-auto-horiz-002.htm => flexbox-margin-auto-horiz-002.htm} (100%) create mode 100644 test/render/flex/flexbox-margin-auto-horiz-002.htm.png rename test/render/flex/{--flexbox-overflow-horiz-004.htm => flexbox-overflow-horiz-004.htm} (100%) create mode 100644 test/render/flex/flexbox-overflow-horiz-004.htm.png rename test/render/flex/{--flexbox-overflow-vert-004.htm => flexbox-overflow-vert-004.htm} (100%) create mode 100644 test/render/flex/flexbox-overflow-vert-004.htm.png rename test/render/flex/{--flexbox-single-line-clamp-1.htm => flexbox-single-line-clamp-1.htm} (100%) create mode 100644 test/render/flex/flexbox-single-line-clamp-1.htm.png rename test/render/flex/{--multiline-reverse-wrap-baseline.htm => multiline-reverse-wrap-baseline.htm} (100%) create mode 100644 test/render/flex/multiline-reverse-wrap-baseline.htm.png diff --git a/CMakeLists.txt b/CMakeLists.txt index 58a598881..057117000 100644 --- a/CMakeLists.txt +++ b/CMakeLists.txt @@ -69,7 +69,8 @@ set(SOURCE_LITEHTML src/render_flex.cpp src/render_image.cpp src/formatting_context.cpp -) + src/flex_item.cpp + src/flex_line.cpp) set(HEADER_LITEHTML include/litehtml.h @@ -132,6 +133,8 @@ set(HEADER_LITEHTML include/litehtml/master_css.h include/litehtml/string_id.h include/litehtml/formatting_context.h + include/litehtml/flex_item.h + include/litehtml/flex_line.h ) set(TEST_LITEHTML diff --git a/include/litehtml/flex_item.h b/include/litehtml/flex_item.h new file mode 100644 index 000000000..a2b3426f1 --- /dev/null +++ b/include/litehtml/flex_item.h @@ -0,0 +1,137 @@ +#ifndef LITEHTML_FLEX_ITEM_H +#define LITEHTML_FLEX_ITEM_H + +#include +#include "formatting_context.h" + +namespace litehtml +{ + class flex_line; + + /** + * Base class for flex item + */ + class flex_item + { + public: + std::shared_ptr el; + int base_size; + int min_size; + def_value max_size; + int main_size; + int grow; + int shrink; + int scaled_flex_shrink_factor; + bool frozen; + int order; + int src_order; + def_value auto_margin_main_start; + def_value auto_margin_main_end; + bool auto_margin_cross_start; + bool auto_margin_cross_end; + flex_align_items align; + + explicit flex_item(std::shared_ptr &_el) : + el(_el), + align(flex_align_items_auto), + grow(0), + base_size(0), + shrink(0), + min_size(0), + frozen(false), + main_size(0), + max_size(0), + order(0), + src_order(0), + scaled_flex_shrink_factor(0), + auto_margin_main_start(0), + auto_margin_main_end(0), + auto_margin_cross_start(false), + auto_margin_cross_end(false) + {} + + virtual ~flex_item() = default; + + bool operator<(const flex_item& b) const + { + if(order < b.order) return true; + if(order == b.order) return src_order < b.src_order; + return false; + } + void init(const litehtml::containing_block_context &self_size, + litehtml::formatting_context *fmt_ctx, flex_align_items align_items); + virtual void apply_main_auto_margins() = 0; + virtual bool apply_cross_auto_margins(int cross_size) = 0; + virtual void set_main_position(int pos) = 0; + virtual void set_cross_position(int pos) = 0; + virtual int get_el_main_size() = 0; + virtual int get_el_cross_size() = 0; + + void place(flex_line &ln, int main_pos, + const containing_block_context &self_size, + formatting_context *fmt_ctx); + int get_last_baseline(baseline::_baseline_type type) const; + int get_first_baseline(baseline::_baseline_type type) const; + + protected: + virtual void direction_specific_init(const litehtml::containing_block_context &self_size, + litehtml::formatting_context *fmt_ctx) = 0; + virtual void align_stretch(flex_line &ln, const containing_block_context &self_size, + formatting_context *fmt_ctx) = 0; + virtual void align_baseline(flex_line &ln, + const containing_block_context &self_size, + formatting_context *fmt_ctx) = 0; + }; + + /** + * Flex item with "flex-direction: row" or " flex-direction: row-reverse" + */ + class flex_item_row_direction : public flex_item + { + public: + explicit flex_item_row_direction(std::shared_ptr &_el) : flex_item(_el) {} + + void apply_main_auto_margins() override; + bool apply_cross_auto_margins(int cross_size) override; + void set_main_position(int pos) override; + void set_cross_position(int pos) override; + int get_el_main_size() override; + int get_el_cross_size() override; + + protected: + void direction_specific_init(const litehtml::containing_block_context &self_size, + litehtml::formatting_context *fmt_ctx) override; + void align_stretch(flex_line &ln, const containing_block_context &self_size, + formatting_context *fmt_ctx) override; + void align_baseline(flex_line &ln, + const containing_block_context &self_size, + formatting_context *fmt_ctx) override; + }; + + /** + * Flex item with "flex-direction: column" or " flex-direction: column-reverse" + */ + class flex_item_column_direction : public flex_item + { + public: + explicit flex_item_column_direction(std::shared_ptr &_el) : flex_item(_el) {} + + void apply_main_auto_margins() override; + bool apply_cross_auto_margins(int cross_size) override; + void set_main_position(int pos) override; + void set_cross_position(int pos) override; + int get_el_main_size() override; + int get_el_cross_size() override; + + protected: + void direction_specific_init(const litehtml::containing_block_context &self_size, + litehtml::formatting_context *fmt_ctx) override; + void align_stretch(flex_line &ln, const containing_block_context &self_size, + formatting_context *fmt_ctx) override; + void align_baseline(flex_line &ln, + const containing_block_context &self_size, + formatting_context *fmt_ctx) override; + }; +} + +#endif //LITEHTML_FLEX_ITEM_H diff --git a/include/litehtml/flex_line.h b/include/litehtml/flex_line.h new file mode 100644 index 000000000..4803d2386 --- /dev/null +++ b/include/litehtml/flex_line.h @@ -0,0 +1,56 @@ +#ifndef LITEHTML_FLEX_LINE_H +#define LITEHTML_FLEX_LINE_H + +#include "formatting_context.h" + +namespace litehtml +{ + class flex_item; + + class flex_line + { + public: + std::list> items; + int cross_start; // for row direction: top. for column direction: left + int main_size; // sum of all items main size + int cross_size; // sum of all items cross size + int base_size; + int total_grow; + int total_shrink; + int num_auto_margin_main_start; // number of items with auto margin left/top + int num_auto_margin_main_end; // number of items with auto margin right/bottom + baseline first_baseline; + baseline last_baseline; + bool reverse_main; + bool reverse_cross; + + flex_line(bool _reverse_main, bool _reverse_cross) : + cross_size(0), + cross_start(0), + total_grow(0), + base_size(0), + total_shrink(0), + main_size(0), + num_auto_margin_main_start(0), + num_auto_margin_main_end(0), + first_baseline(), + last_baseline(), + reverse_main(_reverse_main), + reverse_cross(_reverse_cross) + {} + + void init(int container_main_size, bool fit_container, bool is_row_direction, + const litehtml::containing_block_context &self_size, + litehtml::formatting_context *fmt_ctx); + bool distribute_main_auto_margins(int free_main_size); + int calculate_items_position(int container_main_size, + flex_justify_content justify_content, + bool is_row_direction, + const containing_block_context &self_size, + formatting_context *fmt_ctx); + protected: + void distribute_free_space(int container_main_size); + }; +} + +#endif //LITEHTML_FLEX_LINE_H diff --git a/include/litehtml/render_flex.h b/include/litehtml/render_flex.h index b34c2e494..6a03b98ec 100644 --- a/include/litehtml/render_flex.h +++ b/include/litehtml/render_flex.h @@ -2,102 +2,21 @@ #define LITEHTML_RENDER_FLEX_H #include "render_block.h" +#include "flex_item.h" +#include "flex_line.h" namespace litehtml { class render_item_flex : public render_item_block { - struct flex_item - { - std::shared_ptr el; - int base_size; - int min_size; - def_value max_size; - int main_size; - int grow; - int shrink; - int scaled_flex_shrink_factor; - bool frozen; - int order; - int src_order; - def_value auto_margin_main_start; - def_value auto_margin_main_end; - bool auto_margin_cross_start; - bool auto_margin_cross_end; - flex_align_items align; - - explicit flex_item(std::shared_ptr &_el) : - el(_el), - align(flex_align_items_auto), - grow(0), - base_size(0), - shrink(0), - min_size(0), - frozen(false), - main_size(0), - max_size(0), - order(0), - src_order(0), - scaled_flex_shrink_factor(0), - auto_margin_main_start(0), - auto_margin_main_end(0), - auto_margin_cross_start(false), - auto_margin_cross_end(false) - {} - - bool operator<(const flex_item& b) const - { - if(order < b.order) return true; - if(order == b.order) return src_order < b.src_order; - return false; - } - }; - - struct flex_line - { - std::list items; - int top; - int main_size; // sum of all items main size - int cross_size; // sum of all items cross size - int base_size; - int total_grow; - int total_shrink; - int num_auto_margin_main_start; // number of items with auto margin left/top - int num_auto_margin_main_end; // number of items with auto margin right/bottom - int num_auto_margin_cross_start; // number of items with auto margin left/top - int num_auto_margin_cross_end; // number of items with auto margin right/bottom - int first_baseline; - int last_baseline; - - flex_line() : - cross_size(0), - top(0), - total_grow(0), - base_size(0), - total_shrink(0), - main_size(0), - num_auto_margin_main_start(0), - num_auto_margin_main_end(0), - num_auto_margin_cross_start(0), - num_auto_margin_cross_end(0), - first_baseline(0), - last_baseline(0) - {} - - void distribute_free_space(int container_main_size); - }; - std::list m_lines; - def_value m_first_baseline; - def_value m_last_baseline; std::list get_lines(const containing_block_context &self_size, formatting_context *fmt_ctx, bool is_row_direction, int container_main_size, bool single_line); int _render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) override; public: - explicit render_item_flex(std::shared_ptr src_el) : render_item_block(std::move(src_el)), - m_first_baseline(0), m_last_baseline(0) + explicit render_item_flex(std::shared_ptr src_el) : render_item_block(std::move(src_el)) {} std::shared_ptr clone() override diff --git a/include/litehtml/types.h b/include/litehtml/types.h index 88da49428..bfcaa6c3a 100644 --- a/include/litehtml/types.h +++ b/include/litehtml/types.h @@ -711,7 +711,7 @@ namespace litehtml m_is_default = true; m_val = def_val; } - bool is_default() + bool is_default() const { return m_is_default; } @@ -721,12 +721,72 @@ namespace litehtml m_is_default = false; return m_val; } - operator T() + operator T() const { return m_val; } }; + class baseline + { + public: + enum _baseline_type + { + baseline_type_none, + baseline_type_top, + baseline_type_bottom, + }; + + public: + baseline() : m_value(0), m_type(baseline_type_none) {} + baseline(int _value, _baseline_type _type) : m_value(_value), m_type(_type) {} + + int value() const { return m_value; } + void value(int _value) { m_value = _value; } + _baseline_type type() const { return m_type; } + void type(_baseline_type _type) { m_type = _type; } + + operator int() const { return m_value; } + baseline& operator=(int _value) { m_value = _value; return *this; } + + void set(int _value, _baseline_type _type) { m_value = _value; m_type =_type; } + /** + * Get baseline offset from top of element with specified height + * @param height - element height + * @return baseline offset + */ + int get_offset_from_top(int height) const + { + if(m_type == baseline_type_top) return m_value; + return height - m_value; + } + /** + * Get baseline offset from bottom of element with specified height + * @param height - element height + * @return baseline offset + */ + int get_offset_from_bottom(int height) const + { + if(m_type == baseline_type_bottom) return m_value; + return height - m_value; + } + /** + * Calculate baseline by top and bottom positions of element aligned by baseline == 0 + * @param top - top of the aligned element + * @param bottom - bottom of the aligned element + */ + void calc(int top, int bottom) + { + if(m_type == baseline_type_top) + m_value = -top; + else if(m_type == baseline_type_bottom) + m_value = bottom; + } + private: + int m_value; + _baseline_type m_type; + }; + #define media_orientation_strings "portrait;landscape" diff --git a/src/flex_item.cpp b/src/flex_item.cpp new file mode 100644 index 000000000..36176368a --- /dev/null +++ b/src/flex_item.cpp @@ -0,0 +1,435 @@ +#include "html.h" +#include "flex_item.h" +#include "render_item.h" +#include "flex_line.h" +#include + +void litehtml::flex_item::init(const litehtml::containing_block_context &self_size, + litehtml::formatting_context *fmt_ctx, flex_align_items align_items) +{ + grow = (int) std::nearbyint(el->css().get_flex_grow() * 1000.0); + // Negative numbers are invalid. + // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-grow-number + if(grow < 0) grow = 0; + + shrink = (int) std::nearbyint(el->css().get_flex_shrink() * 1000.0); + // Negative numbers are invalid. + // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-shrink-number + if(shrink < 0) shrink = 1000; + + el->calc_outlines(self_size.render_width); + order = el->css().get_order(); + + direction_specific_init(self_size, fmt_ctx); + + if (el->css().get_flex_align_self() == flex_align_items_auto) + { + align = align_items; + } else + { + align = el->css().get_flex_align_self(); + } + main_size = base_size; + scaled_flex_shrink_factor = base_size * shrink; + frozen = false; +} + +void litehtml::flex_item::place(flex_line &ln, int main_pos, + const containing_block_context &self_size, + formatting_context *fmt_ctx) +{ + apply_main_auto_margins(); + set_main_position(main_pos); + if(!apply_cross_auto_margins(ln.cross_size)) + { + switch (align & 0xFF) + { + case flex_align_items_baseline: + align_baseline(ln, self_size, fmt_ctx); + break; + case flex_align_items_flex_end: + if(ln.reverse_cross) + { + set_cross_position(ln.cross_start); + break; /// If cross axis is reversed position item from start + } + case flex_align_items_end: + set_cross_position(ln.cross_start + ln.cross_size - get_el_cross_size()); + break; + case flex_align_items_center: + set_cross_position(ln.cross_start + ln.cross_size / 2 - get_el_cross_size() / 2); + break; + case flex_align_items_flex_start: + if(ln.reverse_cross) /// If cross axis is reversed position item from end + { + set_cross_position(ln.cross_start + ln.cross_size - get_el_cross_size()); + break; + } + case flex_align_items_start: + set_cross_position(ln.cross_start); + break; + default: + align_stretch(ln, self_size, fmt_ctx); + break; + } + } +} + +int litehtml::flex_item::get_last_baseline(baseline::_baseline_type type) const +{ + if(type == baseline::baseline_type_top) + { + return el->get_last_baseline(); + } else if(type == baseline::baseline_type_bottom) + { + return el->height() - el->get_last_baseline(); + } + return 0; +} + +int litehtml::flex_item::get_first_baseline(litehtml::baseline::_baseline_type type) const +{ + if(type == baseline::baseline_type_top) + { + return el->get_first_baseline(); + } else if(type == baseline::baseline_type_bottom) + { + return el->height() - el->get_first_baseline(); + } + return 0; +} + + +//////////////////////////////////////////////////////////////////////////////////// + +void litehtml::flex_item_row_direction::direction_specific_init(const litehtml::containing_block_context &self_size, + litehtml::formatting_context *fmt_ctx) +{ + if(el->css().get_margins().left.is_predefined()) + { + auto_margin_main_start = 0; + } + if(el->css().get_margins().right.is_predefined()) + { + auto_margin_main_end = 0; + } + if(el->css().get_margins().top.is_predefined()) + { + auto_margin_cross_start = true; + } + if(el->css().get_margins().bottom.is_predefined()) + { + auto_margin_cross_end = true; + } + if (el->css().get_min_width().is_predefined()) + { + min_size = el->render(0, 0, + self_size.new_width(el->content_offset_width(), + containing_block_context::size_mode_content), fmt_ctx); + } else + { + min_size = el->css().get_min_width().calc_percent(self_size.render_width) + + el->content_offset_width(); + } + if (!el->css().get_max_width().is_predefined()) + { + max_size = el->css().get_max_width().calc_percent(self_size.render_width) + + el->content_offset_width(); + } + bool flex_basis_predefined = el->css().get_flex_basis().is_predefined(); + int predef = flex_basis_auto; + if(flex_basis_predefined) + { + predef = el->css().get_flex_basis().predef(); + } else + { + if(el->css().get_flex_basis().val() < 0) + { + flex_basis_predefined = true; + } + } + + if (flex_basis_predefined) + { + switch (predef) + { + case flex_basis_auto: + if (!el->css().get_width().is_predefined()) + { + base_size = el->css().get_width().calc_percent(self_size.render_width) + + el->content_offset_width(); + break; + } + case flex_basis_max_content: + case flex_basis_fit_content: + base_size = el->render(0, 0, self_size, fmt_ctx); + break; + case flex_basis_min_content: + base_size = min_size; + break; + default: + base_size = 0; + break; + } + } else + { + base_size = el->css().get_flex_basis().calc_percent(self_size.render_width) + + el->content_offset_width(); + base_size = std::max(base_size, min_size); + } +} + +void litehtml::flex_item_row_direction::apply_main_auto_margins() +{ + // apply auto margins to item + if(!auto_margin_main_start.is_default()) + { + el->get_margins().left = auto_margin_main_start; + el->pos().x += auto_margin_main_start; + } + if(!auto_margin_main_end.is_default()) el->get_margins().right = auto_margin_main_end; +} + +bool litehtml::flex_item_row_direction::apply_cross_auto_margins(int cross_size) +{ + if(auto_margin_cross_end || auto_margin_cross_start) + { + int margins_num = 0; + if(auto_margin_cross_end) + { + margins_num++; + } + if(auto_margin_cross_start) + { + margins_num++; + } + int margin = (cross_size - el->height()) / margins_num; + if(auto_margin_cross_start) + { + el->get_margins().top = margin; + el->pos().y = el->content_offset_top(); + } + if(auto_margin_cross_end) + { + el->get_margins().bottom = margin; + } + return true; + } + return false; +} + +void litehtml::flex_item_row_direction::set_main_position(int pos) +{ + el->pos().x = pos + el->content_offset_left(); +} + +void litehtml::flex_item_row_direction::set_cross_position(int pos) +{ + el->pos().y = pos + el->content_offset_top(); +} + +void litehtml::flex_item_row_direction::align_stretch(flex_line &ln, const containing_block_context &self_size, + formatting_context *fmt_ctx) +{ + set_cross_position(ln.cross_start); + if (el->css().get_height().is_predefined()) + { + // TODO: must be rendered into the specified height + el->pos().height = ln.cross_size - el->content_offset_height(); + } +} + +void litehtml::flex_item_row_direction::align_baseline(litehtml::flex_line &ln, + const containing_block_context &self_size, + formatting_context *fmt_ctx) +{ + if (align & flex_align_items_last) + { + set_cross_position(ln.cross_start + ln.last_baseline.get_offset_from_top(ln.cross_size) - el->get_last_baseline()); + } else + { + set_cross_position(ln.cross_start + ln.first_baseline.get_offset_from_top(ln.cross_size) - el->get_first_baseline()); + } +} + +int litehtml::flex_item_row_direction::get_el_main_size() +{ + return el->width(); +} + +int litehtml::flex_item_row_direction::get_el_cross_size() +{ + return el->height(); +} + +//////////////////////////////////////////////////////////////////////////////////// + +void litehtml::flex_item_column_direction::direction_specific_init(const litehtml::containing_block_context &self_size, + litehtml::formatting_context *fmt_ctx) +{ + if(el->css().get_margins().top.is_predefined()) + { + auto_margin_main_start = 0; + } + if(el->css().get_margins().bottom.is_predefined()) + { + auto_margin_main_end = 0; + } + if(el->css().get_margins().left.is_predefined()) + { + auto_margin_cross_start = true; + } + if(el->css().get_margins().right.is_predefined()) + { + auto_margin_cross_end = true; + } + if (el->css().get_min_height().is_predefined()) + { + el->render(0, 0, self_size.new_width(self_size.render_width, containing_block_context::size_mode_content), fmt_ctx); + min_size = el->height(); + } else + { + min_size = el->css().get_min_height().calc_percent(self_size.height) + + el->content_offset_height(); + } + if (!el->css().get_max_height().is_predefined()) + { + max_size = el->css().get_max_height().calc_percent(self_size.height) + + el->content_offset_width(); + } + + bool flex_basis_predefined = el->css().get_flex_basis().is_predefined(); + int predef = flex_basis_auto; + if(flex_basis_predefined) + { + predef = el->css().get_flex_basis().predef(); + } else + { + if(el->css().get_flex_basis().val() < 0) + { + flex_basis_predefined = true; + } + } + + if (flex_basis_predefined) + { + switch (predef) + { + case flex_basis_auto: + if (!el->css().get_height().is_predefined()) + { + base_size = el->css().get_height().calc_percent(self_size.height) + + el->content_offset_height(); + break; + } + case flex_basis_max_content: + case flex_basis_fit_content: + el->render(0, 0, self_size, fmt_ctx); + base_size = el->height(); + break; + case flex_basis_min_content: + base_size = min_size; + break; + default: + base_size = 0; + } + } else + { + base_size = el->css().get_flex_basis().calc_percent(self_size.height) + + el->content_offset_height(); + } +} + +void litehtml::flex_item_column_direction::apply_main_auto_margins() +{ + // apply auto margins to item + if(!auto_margin_main_start.is_default()) + { + el->get_margins().top = auto_margin_main_start; + el->pos().y += auto_margin_main_start; + } + if(!auto_margin_main_end.is_default()) el->get_margins().bottom = auto_margin_main_end; +} + +bool litehtml::flex_item_column_direction::apply_cross_auto_margins(int cross_size) +{ + if(auto_margin_cross_end || auto_margin_cross_start) + { + int margins_num = 0; + if(auto_margin_cross_end) + { + margins_num++; + } + if(auto_margin_cross_start) + { + margins_num++; + } + int margin = (cross_size - el->width()) / margins_num; + if(auto_margin_cross_start) + { + el->get_margins().left = margin; + el->pos().x += el->content_offset_left(); + } + if(auto_margin_cross_end) + { + el->get_margins().right = margin; + } + } + return false; +} + +void litehtml::flex_item_column_direction::set_main_position(int pos) +{ + el->pos().y = pos + el->content_offset_top(); +} + +void litehtml::flex_item_column_direction::set_cross_position(int pos) +{ + el->pos().x = pos + el->content_offset_left(); +} + +void litehtml::flex_item_column_direction::align_stretch(flex_line &ln, const containing_block_context &self_size, + formatting_context *fmt_ctx) +{ + /// MAIN: Y + /// CROSS: X + if (!el->css().get_width().is_predefined()) + { + el->render(ln.cross_start, + el->pos().y - el->content_offset_top(), + self_size.new_width_height(ln.cross_size, + main_size - + el->content_offset_height(), + containing_block_context::size_mode_exact_height), + fmt_ctx, false); + } else + { + el->render(ln.cross_start, + el->pos().y - el->content_offset_top(), + self_size.new_width_height( + ln.cross_size - el->content_offset_width(), + main_size - el->content_offset_height(), + containing_block_context::size_mode_exact_width | + containing_block_context::size_mode_exact_height), + fmt_ctx, false); + } + /// Apply auto margins after rendering + apply_main_auto_margins(); +} + +void litehtml::flex_item_column_direction::align_baseline(litehtml::flex_line &ln, + const containing_block_context &self_size, + formatting_context *fmt_ctx) +{ + align_stretch(ln, self_size, fmt_ctx); +} + +int litehtml::flex_item_column_direction::get_el_main_size() +{ + return el->height(); +} + +int litehtml::flex_item_column_direction::get_el_cross_size() +{ + return el->width(); +} diff --git a/src/flex_line.cpp b/src/flex_line.cpp new file mode 100644 index 000000000..5f966b3b1 --- /dev/null +++ b/src/flex_line.cpp @@ -0,0 +1,454 @@ +#include "html.h" +#include "flex_line.h" +#include "flex_item.h" +#include "render_item.h" + +void litehtml::flex_line::distribute_free_space(int container_main_size) +{ + // Determine the used flex factor. Sum the outer hypothetical main sizes of all items on the line. + // If the sum is less than the flex container’s inner main size, use the flex grow factor for the + // rest of this algorithm; otherwise, use the flex shrink factor. + int initial_free_space = container_main_size - base_size; + bool grow; + int total_flex_factor; + if(initial_free_space < 0) + { + grow = false; + total_flex_factor = total_shrink; + // Flex values between 0 and 1 have a somewhat special behavior: when the sum of the flex values on the line + // is less than 1, they will take up less than 100% of the free space. + // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-flex-grow + if(total_flex_factor < 1000) + { + for(auto &item : items) + { + item->main_size += initial_free_space * item->shrink / 1000; + } + return; + } + } else + { + grow = true; + total_flex_factor = total_grow; + // Flex values between 0 and 1 have a somewhat special behavior: when the sum of the flex values on the line + // is less than 1, they will take up less than 100% of the free space. + // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-flex-grow + if(total_flex_factor < 1000) + { + for(auto &item : items) + { + item->main_size += initial_free_space * item->grow / 1000; + } + return; + } + } + + if(total_flex_factor > 0) + { + bool processed = true; + while (processed) + { + int sum_scaled_flex_shrink_factor = 0; + int sum_flex_factors = 0; + int remaining_free_space = container_main_size; + int total_not_frozen = 0; + for (auto &item: items) + { + if (!item->frozen) + { + sum_scaled_flex_shrink_factor += item->scaled_flex_shrink_factor; + if(grow) + { + sum_flex_factors += item->grow; + } else + { + sum_flex_factors += item->shrink; + } + remaining_free_space -= item->base_size; + total_not_frozen++; + } else + { + remaining_free_space -= item->main_size; + } + } + // Check for flexible items. If all the flex items on the line are frozen, free space has + // been distributed; exit this loop. + if (!total_not_frozen) break; + + remaining_free_space = abs(remaining_free_space); + // c. Distribute free space proportional to the flex factors. + // If the remaining free space is zero + // Do nothing. + if (!remaining_free_space) + { + processed = false; + } else + { + int total_clamped = 0; + for (auto &item: items) + { + if (!item->frozen) + { + if(!grow) + { + // If using the flex shrink factor + // For every unfrozen item on the line, multiply its flex shrink factor by its + // inner flex base size, and note this as its scaled flex shrink factor. Find + // the ratio of the item’s scaled flex shrink factor to the sum of the scaled + // flex shrink factors of all unfrozen items on the line. Set the item’s target + // main size to its flex base size minus a fraction of the absolute value of the + // remaining free space proportional to the ratio. + int scaled_flex_shrink_factor = item->base_size * item->shrink; + item->main_size = (int) ((float) item->base_size - (float) remaining_free_space * + (float) scaled_flex_shrink_factor / + (float) sum_scaled_flex_shrink_factor); + + // d. Fix min/max violations. Clamp each non-frozen item’s target main size by its used + // min and max main sizes and floor its content-box size at zero. If the item’s target + // main size was made smaller by this, it’s a max violation. If the item’s target main + // size was made larger by this, it’s a min violation. + if (item->main_size <= item->min_size) + { + total_clamped++; + item->main_size = item->min_size; + item->frozen = true; + } + if(!item->max_size.is_default() && item->main_size >= item->max_size) + { + total_clamped++; + item->main_size = item->max_size; + item->frozen = true; + } + } else + { + // If using the flex grow factor + // Find the ratio of the item’s flex grow factor to the sum of the flex grow + // factors of all unfrozen items on the line. Set the item’s target main size to + // its flex base size plus a fraction of the remaining free space proportional + // to the ratio. + item->main_size = (int) ((float) item->base_size + + (float) remaining_free_space * (float) item->grow / + (float) total_flex_factor); + // d. Fix min/max violations. Clamp each non-frozen item’s target main size by its used + // min and max main sizes and floor its content-box size at zero. If the item’s target + // main size was made smaller by this, it’s a max violation. If the item’s target main + // size was made larger by this, it’s a min violation. + if (item->main_size >= container_main_size) + { + total_clamped++; + item->main_size = container_main_size; + item->frozen = true; + } + if(!item->max_size.is_default() && item->main_size >= item->max_size) + { + total_clamped++; + item->main_size = item->max_size; + item->frozen = true; + } + } + } + } + if (total_clamped == 0) processed = false; + } + } + // Distribute remaining after algorithm space + int sum_main_size = 0; + for(auto &item : items) + { + sum_main_size += item->main_size; + } + int free_space = container_main_size - sum_main_size; + if(free_space > 0) + { + for(auto &item : items) + { + if(free_space == 0) break; + item->main_size++; + free_space--; + } + } + } +} + +bool litehtml::flex_line::distribute_main_auto_margins(int free_main_size) +{ + if(free_main_size > 0 && (num_auto_margin_main_start || num_auto_margin_main_end)) + { + int add = (int) (free_main_size / (items.size() * 2)); + for (auto &item: items) + { + if(!item->auto_margin_main_start.is_default()) + { + item->auto_margin_main_start = add; + item->main_size += add; + main_size += add; + free_main_size -= add; + } + if(!item->auto_margin_main_end.is_default()) + { + item->auto_margin_main_end = add; + item->main_size += add; + main_size += add; + free_main_size -= add; + } + } + while (free_main_size > 0) + { + for (auto &item: items) + { + if(!item->auto_margin_main_start.is_default()) + { + item->auto_margin_main_start = item->auto_margin_main_start + 1; + free_main_size--; + if(!free_main_size) break; + } + if(!item->auto_margin_main_end.is_default()) + { + item->auto_margin_main_end = item->auto_margin_main_end + 1; + free_main_size--; + if(!free_main_size) break; + } + } + } + return true; + } + return false; +} + +void litehtml::flex_line::init(int container_main_size, bool fit_container, bool is_row_direction, + const litehtml::containing_block_context &self_size, + litehtml::formatting_context *fmt_ctx) +{ + cross_size = 0; + main_size = 0; + first_baseline.set(0, baseline::baseline_type_none); + last_baseline.set(0, baseline::baseline_type_none); + + if(!fit_container) + { + distribute_free_space(container_main_size); + } + + if(is_row_direction) + { + def_value first_baseline_top = 0; + def_value first_baseline_bottom = 0; + def_value last_baseline_top = 0; + def_value last_baseline_bottom = 0; + int non_baseline_height = 0; + + // Calculate maximum cross size + def_value max_cross_size(0); + if(self_size.height.type != containing_block_context::cbc_value_type_auto) + { + max_cross_size = self_size.height; + } + if(self_size.max_height.type != containing_block_context::cbc_value_type_none) + { + if(max_cross_size.is_default()) + { + max_cross_size = self_size.max_height; + } else + { + max_cross_size = std::max((int) max_cross_size, (int) self_size.max_height); + } + } + + /// Render items into new size + /// Find line cross_size + /// Find line first/last baseline + for (auto &item: items) + { + item->el->render(0, + 0, + self_size.new_width(item->main_size - item->el->content_offset_width(), containing_block_context::size_mode_exact_width), fmt_ctx, false); + + if((item->align & 0xFF) == flex_align_items_baseline) + { + if(item->align & flex_align_items_last) + { + last_baseline.type(reverse_cross ? baseline::baseline_type_top : baseline::baseline_type_bottom); + + int top = -item->el->get_last_baseline(); + int bottom = top + item->el->height(); + + if(last_baseline_top.is_default()) last_baseline_top = top; + else last_baseline_top = std::min((int) last_baseline_top, top); + + if(last_baseline_bottom.is_default()) last_baseline_bottom = bottom; + else last_baseline_bottom = std::max((int)last_baseline_bottom, bottom); + } else + { + first_baseline.type(reverse_cross ? baseline::baseline_type_bottom : baseline::baseline_type_top); + int top = -item->el->get_first_baseline(); + int bottom = top + item->el->height(); + + if(first_baseline_top.is_default()) first_baseline_top = top; + else first_baseline_top = std::min((int) first_baseline_top, top); + + if(first_baseline_bottom.is_default()) first_baseline_bottom = bottom; + else first_baseline_bottom = std::max((int) first_baseline_bottom, bottom); + } + } else + { + non_baseline_height = std::max(non_baseline_height, item->el->height()); + } + main_size += item->el->width(); + } + + cross_size = std::max(first_baseline_bottom - first_baseline_top,last_baseline_bottom - last_baseline_top); + cross_size = std::max(cross_size, non_baseline_height); + if(!max_cross_size.is_default() && cross_size > max_cross_size) + { + cross_size = max_cross_size; + } + + first_baseline.calc(first_baseline_top, first_baseline_bottom); + last_baseline.calc(last_baseline_top, last_baseline_bottom); + } else + { + // Calculate maximum cross size + def_value max_cross_size(0); + if(self_size.width.type != containing_block_context::cbc_value_type_auto) + { + max_cross_size = self_size.width; + } + if(self_size.max_width.type != containing_block_context::cbc_value_type_none) + { + if(max_cross_size.is_default()) + { + max_cross_size = self_size.max_width; + } else + { + max_cross_size = std::max((int) max_cross_size, (int) self_size.max_width); + } + } + + for (auto &item: items) + { + int el_ret_width = item->el->render(0, + 0, + self_size, fmt_ctx, false); + item->el->render(0, + 0, + self_size.new_width_height(el_ret_width - item->el->content_offset_width(), + item->main_size - item->el->content_offset_height(), + containing_block_context::size_mode_exact_width | + containing_block_context::size_mode_exact_height), + fmt_ctx, false); + main_size += item->el->height(); + cross_size = std::max(cross_size, item->el->width()); + } + if(!max_cross_size.is_default() && cross_size > max_cross_size) + { + cross_size = max_cross_size; + } + } +} + +int litehtml::flex_line::calculate_items_position(int container_main_size, + flex_justify_content justify_content, + bool is_row_direction, + const containing_block_context &self_size, + formatting_context *fmt_ctx) +{ + /// Distribute main axis free space for auto-margins + int free_main_size = container_main_size - main_size; + distribute_main_auto_margins(free_main_size); + free_main_size = container_main_size - main_size; + + /// Fix justify-content property + switch (justify_content) + { + case flex_justify_content_left: + case flex_justify_content_right: + if(!is_row_direction) + { + justify_content = flex_justify_content_start; + } + break; + case flex_justify_content_space_between: + // If the leftover free-space is negative or there is only a single flex item on the line, this + // value is identical to flex-start. + if(items.size() == 1 || free_main_size < 0) justify_content = flex_justify_content_flex_start; + break; + case flex_justify_content_space_around: + case flex_justify_content_space_evenly: + // If the leftover free-space is negative or there is only a single flex item on the line, this + // value is identical to center + if(items.size() == 1 || free_main_size < 0) justify_content = flex_justify_content_center; + break; + default: + break; + } + + /// Distribute free main size using justify-content property + int main_pos = 0; + int add_before_item = 0; + int add_after_item = 0; + int item_remainder = 0; + + /// find initial main position and spaces between items + switch (justify_content) + { + + case flex_justify_content_right: + main_pos = free_main_size; + break; + case flex_justify_content_left: + case flex_justify_content_start: + main_pos = 0; + break; + case flex_justify_content_end: + main_pos = free_main_size; + break; + case flex_justify_content_flex_end: + if(!reverse_main) + { + main_pos = free_main_size; + } + break; + case flex_justify_content_center: + main_pos = free_main_size / 2; + break; + case flex_justify_content_space_between: + add_after_item = free_main_size / ((int) items.size() - 1); + item_remainder = free_main_size - (add_after_item * ((int) items.size() - 1)); + break; + case flex_justify_content_space_around: + add_after_item = add_before_item = free_main_size / ((int) items.size() * 2); + item_remainder = free_main_size - (add_after_item * (int) items.size() * 2); + break; + case flex_justify_content_space_evenly: + add_before_item = free_main_size / ((int) items.size() + 1); + item_remainder = free_main_size - add_before_item * ((int) items.size() + 1); + break; + default: + if(reverse_main) + { + main_pos = free_main_size; + } + break; + } + + /// Place all items in main and cross positions + int height = 0; + for(auto &item : items) + { + main_pos += add_before_item; + if(add_before_item > 0 && item_remainder > 0) + { + main_pos++; + item_remainder--; + } + item->place(*this, main_pos, self_size, fmt_ctx); + main_pos += item->get_el_main_size() + add_after_item; + if(add_after_item > 0 && item_remainder > 0) + { + main_pos++; + item_remainder--; + } + height = std::max(height, item->el->bottom()); + } + return height; +} diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 95a823fd4..0948f6a34 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -215,9 +215,6 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, bool reverse = false; int container_main_size = self_size.render_width; - m_first_baseline.reset(0); - m_last_baseline.reset(0); - switch (css().get_flex_direction()) { case flex_direction_column: @@ -268,112 +265,50 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, } } - // Split flex items to lines + ///////////////////////////////////////////////////////////////// + /// Split flex items to lines + ///////////////////////////////////////////////////////////////// m_lines = get_lines(self_size, fmt_ctx, is_row_direction, container_main_size, single_line); - // Resolving Flexible Lengths - // REF: https://www.w3.org/TR/css-flexbox-1/#resolve-flexible-lengths - int el_y = 0; int el_x = 0; int sum_cross_size = 0; int sum_main_size = 0; int ret_width = 0; + + ///////////////////////////////////////////////////////////////// + /// Resolving Flexible Lengths + /// REF: https://www.w3.org/TR/css-flexbox-1/#resolve-flexible-lengths + ///////////////////////////////////////////////////////////////// for(auto& ln : m_lines) { - ln.cross_size = 0; - ln.main_size = 0; - ln.first_baseline = 0; - ln.last_baseline = 0; - if(is_row_direction) { ret_width += ln.base_size; } - - if(!fit_container) - { - ln.distribute_free_space(container_main_size); - } - - if(is_row_direction) - { - // render items into new size and find line cross_size - bool has_baseline_alignment = false; - for (auto &item: ln.items) - { - item.el->render(0, - 0, - self_size.new_width(item.main_size - item.el->content_offset_width(), containing_block_context::size_mode_exact_width), fmt_ctx, false); - if((item.align & 0xFF) == flex_align_items_baseline) - { - has_baseline_alignment = true; - if(item.align & flex_align_items_last) - { - ln.last_baseline = std::max(ln.last_baseline, item.el->get_last_baseline()); - } else - { - ln.first_baseline = std::max(ln.first_baseline, item.el->get_first_baseline()); - } - } - ln.main_size += item.el->width(); - ln.cross_size = std::max(ln.cross_size, item.el->height()); - } - if(has_baseline_alignment) - { - int top = 0; - int bottom = 0; - for (auto &item: ln.items) - { - if((item.align & 0xFF) == flex_align_items_baseline) - { - if(item.align & flex_align_items_last) - { - item.el->pos().y = ln.last_baseline - item.el->get_last_baseline() + item.el->content_offset_top(); - } else - { - item.el->pos().y = ln.first_baseline - item.el->get_first_baseline() + item.el->content_offset_top(); - } - } - top = std::min(top, item.el->top()); - bottom = std::max(bottom, item.el->bottom()); - } - ln.cross_size = bottom - top; - } - sum_cross_size += ln.cross_size; - } else + ln.init(container_main_size, fit_container, is_row_direction, self_size, fmt_ctx); + sum_cross_size += ln.cross_size; + sum_main_size = std::max(sum_main_size, ln.main_size); + if(reverse) { - for (auto &item: ln.items) - { - int el_ret_width = item.el->render(el_x, - el_y, - self_size, fmt_ctx, false); - item.el->render(el_x, - el_y, - self_size.new_width_height(el_ret_width - item.el->content_offset_width(), - item.main_size - item.el->content_offset_height(), - containing_block_context::size_mode_exact_width | - containing_block_context::size_mode_exact_height), - fmt_ctx, false); - ln.main_size += item.el->height(); - ln.cross_size = std::max(ln.cross_size, item.el->width()); - el_y += item.el->height(); - } - sum_cross_size += ln.cross_size; - el_y = 0; + ln.items.reverse(); } - sum_main_size = std::max(sum_main_size, ln.main_size); } int free_cross_size = 0; - int cross_end = 0; + int cross_start = 0; bool is_wrap_reverse = css().get_flex_wrap() == flex_wrap_wrap_reverse; if(container_main_size == 0) { container_main_size = sum_main_size; } + + ///////////////////////////////////////////////////////////////// + /// Calculate free cross size + ///////////////////////////////////////////////////////////////// if (is_row_direction) { + cross_start = content_offset_top(); if (self_size.height.type != containing_block_context::cbc_value_type_auto) { int height = self_size.height; @@ -382,364 +317,130 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, height -= box_sizing_height(); } free_cross_size = height - sum_cross_size; - cross_end = height; - } else - { - cross_end = sum_cross_size; } } else { + cross_start = content_offset_left(); free_cross_size = self_size.render_width - sum_cross_size; ret_width = sum_cross_size; - cross_end = std::max(sum_cross_size, (int) self_size.render_width); } - // Find line cross size and align items - el_x = el_y = 0; - - flex_align_content_spread lines_spread(css().get_flex_align_content(), css().get_flex_wrap(), (int) m_lines.size(), free_cross_size); - - if(is_wrap_reverse) + ///////////////////////////////////////////////////////////////// + /// Fix align-content property + ///////////////////////////////////////////////////////////////// + flex_align_content align_content = css().get_flex_align_content(); + if(align_content == flex_align_content_space_between) { - if(is_row_direction) - { - el_y = cross_end - lines_spread.start(); - } else - { - el_x = cross_end - lines_spread.start(); - } - } else + // If the leftover free-space is negative or there is only a single flex line in the flex + // container, this value is identical to flex-start. + if (m_lines.size() == 1 || free_cross_size < 0) align_content = flex_align_content_flex_start; + } + if(align_content == flex_align_content_space_around) { - if(is_row_direction) - { - el_y = lines_spread.start(); - } else - { - el_x = lines_spread.start(); - } + // If the leftover free-space is negative or there is only a single flex line in the flex + // container, this value is identical to flex-start. + if (m_lines.size() == 1 || free_cross_size < 0) align_content = flex_align_content_center; } - int line_num = 0; - for(auto& ln : m_lines) + ///////////////////////////////////////////////////////////////// + /// Distribute free cross size for align-content: stretch + ///////////////////////////////////////////////////////////////// + if(css().get_flex_align_content() == flex_align_content_stretch && free_cross_size > 0) { - int free_main_size = container_main_size - ln.main_size; - // distribute auto margins - if(free_main_size > 0 && (ln.num_auto_margin_main_start || ln.num_auto_margin_main_end)) + int add = (int)((double) free_cross_size / (double) m_lines.size()); + if(add > 0) { - int add = (int) (free_main_size / (ln.items.size() * 2)); - for (auto &item: ln.items) + for (auto &ln: m_lines) { - if(!item.auto_margin_main_start.is_default()) - { - item.auto_margin_main_start = add; - item.main_size += add; - ln.main_size += add; - free_main_size -= add; - } - if(!item.auto_margin_main_end.is_default()) - { - item.auto_margin_main_end = add; - item.main_size += add; - ln.main_size += add; - free_main_size -= add; - } + ln.cross_size += add; + free_cross_size -= add; } - while (free_main_size > 0) + } + if(!m_lines.empty()) + { + while (free_cross_size > 0) { - for (auto &item: ln.items) + for (auto &ln: m_lines) { - if(!item.auto_margin_main_start.is_default()) - { - item.auto_margin_main_start = item.auto_margin_main_start + 1; - free_main_size--; - if(!free_main_size) break; - } - if(!item.auto_margin_main_end.is_default()) - { - item.auto_margin_main_end = item.auto_margin_main_end + 1; - free_main_size--; - if(!free_main_size) break; - } + ln.cross_size++; + free_cross_size--; } } } + } - ln.cross_size += lines_spread.add_line_size(); - if(is_wrap_reverse) - { - ln.first_baseline += lines_spread.add_line_size(); - ln.last_baseline += lines_spread.add_line_size(); - } + /// Reverse lines for flex-wrap: wrap-reverse + if(css().get_flex_wrap() == flex_wrap_wrap_reverse) + { + m_lines.reverse(); + } - flex_justify_content_spread content_spread(css().get_flex_justify_content(), - (int) ln.items.size(), - free_main_size, is_row_direction, reverse); - if(is_row_direction) - { + ///////////////////////////////////////////////////////////////// + /// Align flex lines + ///////////////////////////////////////////////////////////////// + int line_pos = 0; + int add_before_line = 0; + int add_after_line = 0; + switch (align_content) + { + case flex_align_content_flex_start: if(is_wrap_reverse) { - el_y -= ln.cross_size - lines_spread.before_line(); - } else - { - el_y += lines_spread.before_line(); - } - if(reverse) - { - el_x = container_main_size - content_spread.start(); - } else - { - el_x = content_spread.start(); - } - for (auto &item: ln.items) - { - // apply auto margins to item - if(!item.auto_margin_main_start.is_default()) - { - item.el->get_margins().left = item.auto_margin_main_start; - item.el->pos().x += item.auto_margin_main_start; - } - if(!item.auto_margin_main_end.is_default()) item.el->get_margins().right = item.auto_margin_main_end; - if(!reverse) - { - // justify content [before_item] - el_x += content_spread.before_item(); - item.el->pos().x = el_x + item.el->content_offset_left(); - el_x += item.el->width(); - } else - { - // justify content [before_item] - el_x -= content_spread.before_item(); - el_x -= item.el->width(); - item.el->pos().x = el_x + item.el->content_offset_left(); - } - if(item.auto_margin_cross_end || item.auto_margin_cross_start) - { - int margins_num = 0; - if(item.auto_margin_cross_end) - { - margins_num++; - } - if(item.auto_margin_cross_start) - { - margins_num++; - } - int margin = (ln.cross_size - item.el->height()) / margins_num; - if(item.auto_margin_cross_start) - { - item.el->get_margins().top = margin; - item.el->pos().y = el_y + item.el->content_offset_top(); - } - if(item.auto_margin_cross_end) - { - item.el->get_margins().bottom = margin; - } - } else - { - switch (item.align & 0xFF) - { - case flex_align_items_baseline: - if (item.align & flex_align_items_last) - { - item.el->pos().y = el_y + ln.last_baseline - item.el->get_last_baseline() + - item.el->content_offset_top(); - m_last_baseline = el_y + ln.last_baseline + content_offset_top(); - } else - { - item.el->pos().y = el_y + ln.first_baseline - item.el->get_first_baseline() + - item.el->content_offset_top(); - if (line_num == 0) - { - m_first_baseline = el_y + ln.first_baseline + content_offset_top(); - } - } - break; - case flex_align_items_flex_end: - case flex_align_items_end: - item.el->pos().y = el_y + ln.cross_size - item.el->height() + item.el->content_offset_top(); - break; - case flex_align_items_center: - item.el->pos().y = - el_y + ln.cross_size / 2 - item.el->height() / 2 + item.el->content_offset_top(); - break; - case flex_align_items_flex_start: - case flex_align_items_start: - item.el->pos().y = el_y + item.el->content_offset_top(); - break; - default: - item.el->pos().y = el_y + item.el->content_offset_top(); - if (item.el->css().get_height().is_predefined()) - { - // TODO: must be rendered into the specified height - item.el->pos().height = ln.cross_size - item.el->content_offset_height(); - } else if (is_wrap_reverse) - { - item.el->pos().y = - el_y + ln.cross_size - item.el->height() + item.el->content_offset_top(); - } - break; - } - } - m_pos.height = std::max(m_pos.height, item.el->bottom()); - // justify content [after_item] - if(!reverse) - { - el_x += content_spread.after_item(); - } else - { - el_x -= content_spread.after_item(); - } + line_pos = free_cross_size; } + break; + case flex_align_content_flex_end: if(!is_wrap_reverse) { - el_y += ln.cross_size + lines_spread.after_line(); - } else - { - el_y -= lines_spread.after_line(); - } - } else // if(is_row_direction) - { - if(!reverse) - { - el_y = content_spread.start(); - } else - { - if(self_size.height.type == containing_block_context::cbc_value_type_auto) - { - content_spread.set_free_space(0); - el_y = ln.main_size; - } else - { - content_spread.set_free_space(self_size.height - ln.main_size); - el_y = self_size.height; - } - el_y -= content_spread.start(); + line_pos = free_cross_size; } + break; + case flex_align_content_end: + line_pos = free_cross_size; + break; + case flex_align_content_center: + line_pos = free_cross_size / 2; + break; + case flex_align_content_space_between: + add_after_line = free_cross_size / ((int) m_lines.size() - 1); + break; + case flex_align_content_space_around: + add_before_line = add_after_line = free_cross_size / ((int) m_lines.size() * 2); + break; + default: if(is_wrap_reverse) { - el_x -= ln.cross_size - lines_spread.before_line(); - } else - { - el_x += lines_spread.before_line(); + line_pos = free_cross_size; } - for (auto &item: ln.items) - { - // apply auto margins to item - if(!item.auto_margin_main_start.is_default()) - { - item.el->get_margins().top = item.auto_margin_main_start; - item.el->pos().y += item.auto_margin_main_start; - } - if(!item.auto_margin_main_end.is_default()) item.el->get_margins().bottom = item.auto_margin_main_end; - - if(!reverse) - { - // justify content [before_item] - el_y += content_spread.before_item(); - - item.el->pos().y = el_y + item.el->content_offset_top(); - el_y += item.el->height(); - } else - { - // justify content [before_item] - el_y -= content_spread.before_item(); + break; + } + for(auto &ln : m_lines) + { + line_pos += add_before_line; + ln.cross_start = line_pos; + line_pos += ln.cross_size + add_after_line; + } - el_y -= item.el->height(); - item.el->pos().y = el_y + item.el->content_offset_top(); - } - if(item.auto_margin_cross_end || item.auto_margin_cross_start) - { - int margins_num = 0; - if(item.auto_margin_cross_end) - { - margins_num++; - } - if(item.auto_margin_cross_start) - { - margins_num++; - } - int margin = (ln.cross_size - item.el->height()) / margins_num; - if(item.auto_margin_cross_start) - { - item.el->get_margins().left = margin; - item.el->pos().x = el_x + item.el->content_offset_left(); - } - if(item.auto_margin_cross_end) - { - item.el->get_margins().right = margin; - } - } else - { - switch (item.align) - { - case flex_align_items_flex_end: - case flex_align_items_end: - item.el->pos().x = el_x + ln.cross_size - item.el->width() + item.el->content_offset_left(); - break; - case flex_align_items_center: - item.el->pos().x = - el_x + ln.cross_size / 2 - item.el->width() / 2 + item.el->content_offset_left(); - break; - case flex_align_items_start: - case flex_align_items_flex_start: - item.el->pos().x = el_x + item.el->content_offset_left(); - break; - default: - item.el->pos().x = el_x + item.el->content_offset_left(); - if (!item.el->css().get_width().is_predefined()) - { - item.el->render(el_x, - item.el->pos().y - item.el->content_offset_top(), - self_size.new_width_height(ln.cross_size, - item.main_size - - item.el->content_offset_height(), - containing_block_context::size_mode_exact_height), - fmt_ctx, false); - } else - { - item.el->render(el_x, - item.el->pos().y - item.el->content_offset_top(), - self_size.new_width_height( - ln.cross_size - item.el->content_offset_width(), - item.main_size - item.el->content_offset_height(), - containing_block_context::size_mode_exact_width | - containing_block_context::size_mode_exact_height), - fmt_ctx, false); - } - // apply auto margins to item after rendering - if (!item.auto_margin_main_start.is_default()) - { - item.el->get_margins().top = item.auto_margin_main_start; - item.el->pos().y += item.auto_margin_main_start; - } - if (!item.auto_margin_main_end.is_default()) item.el->get_margins().bottom = item.auto_margin_main_end; + /// Fix justify-content property + flex_justify_content justify_content = css().get_flex_justify_content(); + if((justify_content == flex_justify_content_right || justify_content == flex_justify_content_left) && !is_row_direction) + { + justify_content = flex_justify_content_start; + } - if (!item.el->css().get_width().is_predefined() && is_wrap_reverse) - { - item.el->pos().x = - el_x + ln.cross_size - item.el->width() + item.el->content_offset_left(); - } - break; - } - } - m_pos.height = std::max(m_pos.height, item.el->bottom()); - // justify content [after_item] - if(!reverse) - { - el_y += content_spread.after_item(); - } else - { - el_y -= content_spread.after_item(); - } - } - if(!is_wrap_reverse) - { - el_x += ln.cross_size + lines_spread.after_line(); - } else - { - el_x -= lines_spread.after_line(); - } - } // if(is_row_direction) + ///////////////////////////////////////////////////////////////// + /// Align flex items in flex lines + ///////////////////////////////////////////////////////////////// + int line_num = 0; + for(auto &ln : m_lines) + { + int height = ln.calculate_items_position(container_main_size, + justify_content, + is_row_direction, + self_size, + fmt_ctx); line_num++; + m_pos.height = std::max(m_pos.height, height); } // calculate the final position @@ -750,399 +451,85 @@ int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, return ret_width; } -void -litehtml::render_item_flex::flex_line::distribute_free_space(int container_main_size) +std::list litehtml::render_item_flex::get_lines(const litehtml::containing_block_context &self_size, + litehtml::formatting_context *fmt_ctx, + bool is_row_direction, int container_main_size, + bool single_line) { - // Determine the used flex factor. Sum the outer hypothetical main sizes of all items on the line. - // If the sum is less than the flex container’s inner main size, use the flex grow factor for the - // rest of this algorithm; otherwise, use the flex shrink factor. - int initial_free_space = container_main_size - base_size; - bool grow; - int total_flex_factor; - if(initial_free_space < 0) + bool reverse_main; + bool reverse_cross = css().get_flex_wrap() == flex_wrap_wrap_reverse; + + if(is_row_direction) { - grow = false; - total_flex_factor = total_shrink; - // Flex values between 0 and 1 have a somewhat special behavior: when the sum of the flex values on the line - // is less than 1, they will take up less than 100% of the free space. - // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-flex-grow - if(total_flex_factor < 1000) - { - for(auto &item : items) - { - item.main_size += initial_free_space * item.shrink / 1000; - } - return; - } + reverse_main = css().get_flex_direction() == flex_direction_row_reverse; } else { - grow = true; - total_flex_factor = total_grow; - // Flex values between 0 and 1 have a somewhat special behavior: when the sum of the flex values on the line - // is less than 1, they will take up less than 100% of the free space. - // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-flex-grow - if(total_flex_factor < 1000) - { - for(auto &item : items) - { - item.main_size += initial_free_space * item.grow / 1000; - } - return; - } - } - - if(total_flex_factor > 0) - { - bool processed = true; - while (processed) - { - int sum_scaled_flex_shrink_factor = 0; - int sum_flex_factors = 0; - int remaining_free_space = container_main_size; - int total_not_frozen = 0; - for (auto &item: items) - { - if (!item.frozen) - { - sum_scaled_flex_shrink_factor += item.scaled_flex_shrink_factor; - if(grow) - { - sum_flex_factors += item.grow; - } else - { - sum_flex_factors += item.shrink; - } - remaining_free_space -= item.base_size; - total_not_frozen++; - } else - { - remaining_free_space -= item.main_size; - } - } - // Check for flexible items. If all the flex items on the line are frozen, free space has - // been distributed; exit this loop. - if (!total_not_frozen) break; - - remaining_free_space = abs(remaining_free_space); - // c. Distribute free space proportional to the flex factors. - // If the remaining free space is zero - // Do nothing. - if (!remaining_free_space) - { - processed = false; - } else - { - int total_clamped = 0; - for (auto &item: items) - { - if (!item.frozen) - { - if(!grow) - { - // If using the flex shrink factor - // For every unfrozen item on the line, multiply its flex shrink factor by its - // inner flex base size, and note this as its scaled flex shrink factor. Find - // the ratio of the item’s scaled flex shrink factor to the sum of the scaled - // flex shrink factors of all unfrozen items on the line. Set the item’s target - // main size to its flex base size minus a fraction of the absolute value of the - // remaining free space proportional to the ratio. - int scaled_flex_shrink_factor = item.base_size * item.shrink; - item.main_size = (int) ((float) item.base_size - (float) remaining_free_space * - (float) scaled_flex_shrink_factor / - (float) sum_scaled_flex_shrink_factor); - - // d. Fix min/max violations. Clamp each non-frozen item’s target main size by its used - // min and max main sizes and floor its content-box size at zero. If the item’s target - // main size was made smaller by this, it’s a max violation. If the item’s target main - // size was made larger by this, it’s a min violation. - if (item.main_size <= item.min_size) - { - total_clamped++; - item.main_size = item.min_size; - item.frozen = true; - } - if(!item.max_size.is_default() && item.main_size >= item.max_size) - { - total_clamped++; - item.main_size = item.max_size; - item.frozen = true; - } - } else - { - // If using the flex grow factor - // Find the ratio of the item’s flex grow factor to the sum of the flex grow - // factors of all unfrozen items on the line. Set the item’s target main size to - // its flex base size plus a fraction of the remaining free space proportional - // to the ratio. - item.main_size = (int) ((float) item.base_size + - (float) remaining_free_space * (float) item.grow / - (float) total_flex_factor); - // d. Fix min/max violations. Clamp each non-frozen item’s target main size by its used - // min and max main sizes and floor its content-box size at zero. If the item’s target - // main size was made smaller by this, it’s a max violation. If the item’s target main - // size was made larger by this, it’s a min violation. - if (item.main_size >= container_main_size) - { - total_clamped++; - item.main_size = container_main_size; - item.frozen = true; - } - if(!item.max_size.is_default() && item.main_size >= item.max_size) - { - total_clamped++; - item.main_size = item.max_size; - item.frozen = true; - } - } - } - } - if (total_clamped == 0) processed = false; - } - } - // Distribute remaining after algorithm space - int sum_main_size = 0; - for(auto &item : items) - { - sum_main_size += item.main_size; - } - int free_space = container_main_size - sum_main_size; - if(free_space > 0) - { - for(auto &item : items) - { - if(free_space == 0) break; - item.main_size++; - free_space--; - } - } + reverse_main = css().get_flex_direction() == flex_direction_column_reverse; } -} -std::list litehtml::render_item_flex::get_lines(const litehtml::containing_block_context &self_size, - litehtml::formatting_context *fmt_ctx, - bool is_row_direction, int container_main_size, - bool single_line) -{ std::list lines; - flex_line line; - std::list items; + flex_line line(reverse_main, reverse_cross); + std::list> items; int src_order = 0; bool sort_required = false; def_value prev_order(0); for( auto& el : m_children) { - flex_item item(el); - - item.grow = (int) std::nearbyint(item.el->css().get_flex_grow() * 1000.0); - // Negative numbers are invalid. - // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-grow-number - if(item.grow < 0) item.grow = 0; - - item.shrink = (int) std::nearbyint(item.el->css().get_flex_shrink() * 1000.0); - // Negative numbers are invalid. - // https://www.w3.org/TR/css-flexbox-1/#valdef-flex-shrink-number - if(item.shrink < 0) item.shrink = 1000; - - item.el->calc_outlines(self_size.render_width); - item.order = item.el->css().get_order(); - item.src_order = src_order++; - - if(prev_order.is_default()) - { - prev_order = item.order; - } else if(!sort_required && item.order != prev_order) - { - sort_required = true; - } - - if (is_row_direction) + std::shared_ptr item = nullptr; + if(is_row_direction) { - if(item.el->css().get_margins().left.is_predefined()) - { - item.auto_margin_main_start = 0; - } - if(item.el->css().get_margins().right.is_predefined()) - { - item.auto_margin_main_end = 0; - } - if(item.el->css().get_margins().top.is_predefined()) - { - item.auto_margin_cross_start = true; - } - if(item.el->css().get_margins().bottom.is_predefined()) - { - item.auto_margin_cross_end = true; - } - if (item.el->css().get_min_width().is_predefined()) - { - item.min_size = el->render(0, 0, - self_size.new_width(el->content_offset_width(), - containing_block_context::size_mode_content), fmt_ctx); - } else - { - item.min_size = item.el->css().get_min_width().calc_percent(self_size.render_width) + - el->content_offset_width(); - } - if (!item.el->css().get_max_width().is_predefined()) - { - item.max_size = item.el->css().get_max_width().calc_percent(self_size.render_width) + - el->content_offset_width(); - } - bool flex_basis_predefined = item.el->css().get_flex_basis().is_predefined(); - int predef = flex_basis_auto; - if(flex_basis_predefined) - { - predef = item.el->css().get_flex_basis().predef(); - } else - { - if(item.el->css().get_flex_basis().val() < 0) - { - flex_basis_predefined = true; - } - } - - if (flex_basis_predefined) - { - switch (predef) - { - case flex_basis_auto: - if (!item.el->css().get_width().is_predefined()) - { - item.base_size = item.el->css().get_width().calc_percent(self_size.render_width) + - item.el->content_offset_width(); - break; - } - case flex_basis_max_content: - case flex_basis_fit_content: - item.base_size = el->render(0, 0, self_size, fmt_ctx); - break; - case flex_basis_min_content: - item.base_size = item.min_size; - break; - default: - item.base_size = 0; - break; - } - } else - { - item.base_size = item.el->css().get_flex_basis().calc_percent(self_size.render_width) + - item.el->content_offset_width(); - item.base_size = std::max(item.base_size, item.min_size); - } + item = std::make_shared(el); } else { - if(item.el->css().get_margins().top.is_predefined()) - { - item.auto_margin_main_start = 0; - } - if(item.el->css().get_margins().bottom.is_predefined()) - { - item.auto_margin_main_end = 0; - } - if(item.el->css().get_margins().left.is_predefined()) - { - item.auto_margin_cross_start = true; - } - if(item.el->css().get_margins().right.is_predefined()) - { - item.auto_margin_cross_end = true; - } - if (item.el->css().get_min_height().is_predefined()) - { - el->render(0, 0, self_size.new_width(self_size.render_width, containing_block_context::size_mode_content), fmt_ctx); - item.min_size = el->height(); - } else - { - item.min_size = item.el->css().get_min_height().calc_percent(self_size.height) + - el->content_offset_height(); - } - if (!item.el->css().get_max_height().is_predefined()) - { - item.max_size = item.el->css().get_max_height().calc_percent(self_size.height) + - el->content_offset_width(); - } - - bool flex_basis_predefined = item.el->css().get_flex_basis().is_predefined(); - int predef = flex_basis_auto; - if(flex_basis_predefined) - { - predef = item.el->css().get_flex_basis().predef(); - } else - { - if(item.el->css().get_flex_basis().val() < 0) - { - flex_basis_predefined = true; - } - } - - if (flex_basis_predefined) - { - switch (predef) - { - case flex_basis_auto: - if (!item.el->css().get_height().is_predefined()) - { - item.base_size = item.el->css().get_height().calc_percent(self_size.height) + - item.el->content_offset_height(); - break; - } - case flex_basis_max_content: - case flex_basis_fit_content: - el->render(0, 0, self_size, fmt_ctx); - item.base_size = el->height(); - break; - case flex_basis_min_content: - item.base_size = item.min_size; - break; - default: - item.base_size = 0; - } - } else - { - item.base_size = item.el->css().get_flex_basis().calc_percent(self_size.height) + - item.el->content_offset_height(); - } + item = std::make_shared(el); } + item->init(self_size, fmt_ctx, css().get_flex_align_items()); + item->src_order = src_order++; - if (el->css().get_flex_align_self() == flex_align_items_auto) + if(prev_order.is_default()) { - item.align = css().get_flex_align_items(); - } else + prev_order = item->order; + } else if(!sort_required && item->order != prev_order) { - item.align = el->css().get_flex_align_self(); + sort_required = true; } - item.main_size = item.base_size; - item.scaled_flex_shrink_factor = item.base_size * item.shrink; - item.frozen = false; - items.push_back(item); + items.emplace_back(item); } if(sort_required) { - items.sort(); + items.sort([](const std::shared_ptr& item1, const std::shared_ptr& item2) + { + if(item1->order < item2->order) return true; + if(item1->order == item2->order) + { + return item1->src_order < item2->src_order; + } + return false; + }); } // Add flex items to lines for(auto& item : items) { - if(!line.items.empty() && !single_line && line.base_size + item.base_size > container_main_size) + if(!line.items.empty() && !single_line && line.base_size + item->base_size > container_main_size) { - lines.push_back(line); - line = flex_line(); + lines.emplace_back(line); + line = flex_line(reverse_main, reverse_cross); } - line.base_size += item.base_size; - line.total_grow += item.grow; - line.total_shrink += item.shrink; - if(!item.auto_margin_main_start.is_default()) line.num_auto_margin_main_start++; - if(!item.auto_margin_main_end.is_default()) line.num_auto_margin_main_end++; + line.base_size += item->base_size; + line.total_grow += item->grow; + line.total_shrink += item->shrink; + if(!item->auto_margin_main_start.is_default()) line.num_auto_margin_main_start++; + if(!item->auto_margin_main_end.is_default()) line.num_auto_margin_main_end++; line.items.push_back(item); } // Add the last line to the lines list if(!line.items.empty()) { - lines.push_back(line); + lines.emplace_back(line); } return lines; } @@ -1224,20 +611,24 @@ int litehtml::render_item_flex::get_first_baseline() { if(css().get_flex_direction() == flex_direction_row || css().get_flex_direction() == flex_direction_row_reverse) { - if(!m_first_baseline.is_default()) + if(!m_lines.empty()) { - return m_first_baseline; - } - if(!m_last_baseline.is_default()) - { - return m_last_baseline; + const auto &first_line = m_lines.front(); + if(first_line.first_baseline.type() != baseline::baseline_type_none) + { + return first_line.cross_start + first_line.first_baseline.get_offset_from_top(first_line.cross_size) + content_offset_top(); + } + if(first_line.last_baseline.type() != baseline::baseline_type_none) + { + return first_line.cross_start + first_line.last_baseline.get_offset_from_top(first_line.cross_size) + content_offset_top(); + } } } if(!m_lines.empty()) { if(!m_lines.front().items.empty()) { - return m_lines.front().items.front().el->get_first_baseline() + content_offset_top(); + return m_lines.front().items.front()->el->get_first_baseline() + content_offset_top(); } } return height(); @@ -1247,20 +638,24 @@ int litehtml::render_item_flex::get_last_baseline() { if(css().get_flex_direction() == flex_direction_row || css().get_flex_direction() == flex_direction_row_reverse) { - if(!m_last_baseline.is_default()) - { - return m_last_baseline; - } - if(!m_first_baseline.is_default()) + if(!m_lines.empty()) { - return m_first_baseline; + const auto &first_line = m_lines.front(); + if(first_line.last_baseline.type() != baseline::baseline_type_none) + { + return first_line.cross_start + first_line.last_baseline.get_offset_from_top(first_line.cross_size) + content_offset_top(); + } + if(first_line.first_baseline.type() != baseline::baseline_type_none) + { + return first_line.cross_start + first_line.first_baseline.get_offset_from_top(first_line.cross_size) + content_offset_top(); + } } } if(!m_lines.empty()) { if(!m_lines.front().items.empty()) { - return m_lines.front().items.front().el->get_last_baseline() + content_offset_top(); + return m_lines.front().items.front()->el->get_last_baseline() + content_offset_top(); } } return height(); diff --git a/test/render/flex/flexbox-align-self-baseline-horiz-007.htm.png b/test/render/flex/flexbox-align-self-baseline-horiz-007.htm.png index 1de2c160925fd753017e1ad0755e914db7a8fd1a..f36a198e086b538ca2fd1bff43978e492b422d9f 100644 GIT binary patch delta 875 zcmV-x1C;!U2ayMmGk?I#00030r2zl`0BJAh0RR94H%UZ6RCodHm2Ga@Fbsw_tn2T# z*Z~Hk2N>X-Af@|z!0a0&x&IMHQj{#qZq|H3%=|v6BI#99w0c7N3jhEB00000)ZiJo zAPIS@{fz*^*R+BV7eI(JAjBCE;tU9J281{RLYx61&VUeSjDJF2n#=fE`(OEhZ|!;f zs`KYU$o&X;C4QkY+;T>fTp}L6g%E{dY~Hekp0$%R9{z+hOF}3JD24FewGg}Hxe&5- zA%yo%g)9_^3Mevuxl18sp3XLJ^@R{^UwLpx+K$yg%_QT?*S+LhZe2vAd(T3M-ZnP4 zJ5d|gcKN#A5PvWAjKY}%AwT%qUv1X*56hduvAurs1^jRToNPnwA+EJ0o?Q4~2&XeS%QZ5qG zcQ+IAC$=GZhR9k5zoZh;Gj3%%*%@!@3u!LHt&sLSAOu3DLZ0gU0m=hW$4+SA`PxE$ zSNy-uz=sg25D}tMAS6&xoy5~wTWc0kA(KuF?xLLLw2 zvxg7}aevAUh3tr5s0`mjK5k{~d*Z93WA~aJ5`|&(-MHwpw@Jp{&(ff|aK}Hn9?P-!lAt56@i$b{F z^hDhdMz~pC_Y3=!#dR*k&O*LoArE}TI~#d>ntx+l1 zXrV&F=ht2#Ckc`2_>2(wrk^S#d{vTPJWhpPz5e#a<;hSdsrEWU8(f8R|2qmNN`OwbRE97uK`{8y# z2!!|$0002ovPDHLkV1iDq BisS$Q delta 867 zcmV-p1DyPk2Z;xeGk>K3|G>)t009600BHjg3IG5DFG)l}RCodHmC(W<>} zEA9OXsrM^U?)QScK{GcAsy7$%#_dO+71D;Z z8l)X%ncTisiRL^>PAX-Qkdlc18XYV15!;YFLu4(3Us8$a8MiW>?2I?t3n`YdOvwHC zsBZ&8AY?4$W#KnHcem5tQONIYE*3%{Au z)!=QC^M8Pl#GH^U6Cu2B%PWM~MNfrf-=R4{$oTT71u_+KKDC!+d{2l880S^9Um--N zGmlP26vFLkltm#SBRz{kxZPAlO&LbGSzcE&`;^7?P>7v{e8)nb_=?XqhV5yT^%X)^ z9D@pBA$*lKQf0)(}kwwS4q^bo%&WYn56A+~^!uY?S;UI=xo z2pN1wFNDh73VG%hlv-A-HH4+wz}A40$?K!`IS#2FCc3 t84%)(UdStO!PdVB00000006)~`3u>?8+FvZriuUn002ovPDHLkV1jR`gp~jQ diff --git a/test/render/flex/--flexbox-align-self-horiz-005.htm b/test/render/flex/flexbox-align-self-horiz-005.htm similarity index 100% rename from test/render/flex/--flexbox-align-self-horiz-005.htm rename to test/render/flex/flexbox-align-self-horiz-005.htm diff --git a/test/render/flex/flexbox-align-self-horiz-005.htm.png b/test/render/flex/flexbox-align-self-horiz-005.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e547e5e60d4279e5baff04bfe334b7ddadaf156b GIT binary patch literal 2876 zcmb`JeK?c*AIG=6 zMMX(V2?m3yI69ErU@$lcou>*bp$h6rNIDeOyE;?JGMNkplPzDjU}Zfcu$UNGQycWq zcvd+E22&bzB-v5V!o}UT*RxyIRt3>yi486{d2eEb9q>bwXVcb*U_vCkfm zRXA{i1gyGQk9P)(;ho;-&43V|yc{fG8m3BJp%f+t+lTs@(h?figQ~<}L*q_BrC|n3 zRN|iS{i$dri(}!#6$PCV-r{7Ty%s>_pvVj@ zKnR5>EfyYR;#j%NU@3k7Xs_H7bDB;u_N(=gqwY)@Z`4LL%JF_z*@J!b*$Dsf>w{Uzm`pfb4%{Bh?{```9E8##&H?VW+J8X6lQZ&k4*TX|Te zHKij)wMPBI+4dK;al5KtYri%(SP_2Y(y_?Ssrxn|pea8KwDPkyY%R?i&<0Bbv&L;2 zv!*-Pyz0q^ji+mK0t0+&lalARGmXoviELzkOCE29D@)X&E;y2g{;rw>j721ddJHWt_TY zVjJLf{&(KOIAgvp1VHga?--W~!Ocbi5~RxT@iiYl3?}BIzfM~0|MhDazvCRZ)b{xX z?Ez2!PT^|=oV8G51iRI;C>^$WeHFET6@xkGEulZ0xoC8JV>OArwc$B#?$hGD{SDR! zgEPjZL#nT~D0SgW?d^vjy`l4s;vOgPT-}qp=5?87iyyk3lQsntqdy`!DgrmvW<6GV zFp@Ja^h$){W}qtdqM1G}`W@1``O_3#3|kT!U*3X>%69PzH$Rfd$v#G8NN!iSc;T|j z;{*8{wt<0S*!5#yW+i?-$OP@@IXsfyVz{WpiS+8@>AX5Md8tYlD-re+VxJ1GNcZUP z?G;pLA9m2+TVD9@Q_t$xk!bNx8rG5qA!?9pOef)g zZ>~yo0lg#YphN8zQcBPvCT_SANpAMFgA4#53Ebt*|Fdhb8l#W9$fVtuc zdabArMgEDrY6uIxWu2TVa$@9M39%Om={<`r@`dfENVdgrbi*|FbV0TdM5CY^V1JYU zvLW!eg%>Le-ChD^;$n|bp?g)$ASC&Zps&tba@+3K#Pq0C4P&W;(T_WqxBm^m2A22F zO9d^F_(~m?_%cpf&~pBtr?Xqadz^Bmv{t$1R<}L4CaXFqt1s(wMK?*8IxD;?6(#xG zW0dF}`FoD5dxU8CXJGOwXl^({AFrtV0;eD+M64ygm`+n=Or4CrIQD`fbCeZE7T~3> zsnPgWTl8BU*2gvE`ODyfJ+M@OmwjIzy_>+7JU@rdl^!Uc*4s7L;5~Zitb|h6dHcQS z$@!dUJWuD_@u^(5u4#<4q{lKmI<*|MhK7~{ai}9B>x0a*18v{+N%#@g^eE92Xiw)KpeiwBnvuB3y zd?K8-c}Iik+U$XhuakA;o3#t>BCj&*+z_&lX?WB&q@92bhg`x4ZvKKcD*hoKkmti`qSY@M*p zze;bbLutkVrrE@jBwp{A9K0GN$ZyX+iLQ}htdGVO4G&*pVsVMPzo*x)bi}o#8ChrW z3tY(U_H_^bgYLo_HuJX~RBkh4GTRrM3o_477TA$|BpHj~CkVn*u?4T9+?=M3#|&P-n@Bprg2WFg(t$b=v0m- zYF|o}H0RMqHLxVV^GXbzV*aob7S^Mt`Ecf?+RK9ugwiPcgp9{bBF+7ajn=Lr86KGC zgB^$Gj&k9mvgwFVC;E6%7X7?GeBMi2RO7~R%}mrV_(~vU_};15F~_r# zx=rEgxl%0CJAU-Mx9PURaAo_5q(s9eyJkmp=2pq3VLev6Uf9(jHL~9|YX_^7%-`CX zJ`}(8kkU1w-S2Y=TKoIWUzM`)JUB`OZG5blTZIT*eKG-=?(V5j6JI_~=ZcG|p;RO5 zfHce}bbnt2wC$^)ZSN0B{~09xTafghu|g-9U@!)tR_L;N86==lb=fNAe)%2xZ;z=@ x$AjV@N#}2h%8O86Ja0NbW=oJS(3MxbxAzp~0hx6-H>S0vGqF2S`R+s&`weG@?*~cYUKlyl`YWF+D zGuHjL9Lyf-R{zKu=Q9?@&re|Y!mlmouY891jax1{@1x=JmYtXFR1ZCGcW3oTg{MkL zE=G1WFj;=f#`@O}lTo~ol^gGjsM~XJQipoEo=n>2q{0x!6M4C{-k%#4iue1lkLplQ XB(JIZqKO4|00000NkvXXu0mjfo-J#g delta 209 zcmV;?051Q40`vip7YaH80{{R3ekFT{ks%m=rb$FWRCodH(lHLgFboAyj#F`;bYN#_ z@8jJ|5crg+IHI9;N-VXJhj^-zr!U9urI(iq-#Uutr1af{U$Kr8vLEU=4xIipakQnM z%Z%wG4qHCM%HuAluhm diff --git a/test/render/flex/flexbox-baseline-multi-line-vert-002.htm.png b/test/render/flex/flexbox-baseline-multi-line-vert-002.htm.png index cc01013a2ba029fe4aa7c51e729df8dfba6b7704..31fda30f40e68c27ac08fe7d255aab315be2b121 100644 GIT binary patch delta 206 zcmV;<05Sjk0sjGzIe)Q9L_t(|0qxbX4#FT124Ekj@qKV`ccAZcJIfj6DILK2*Zx^Y0;8hFP7NE!=h9oNEg{sz<>+<#{=6g_otuIdsH_ zc$X?3dG^}wo^vBR-puT%{`b90)ewwFoyddplAq>(c&{Dm1=p0R`k4tO?*IS*07*qo IM6N<$g3B;!3jhEB delta 203 zcmV;+05t#q0sH}wIe)H6L_t(|0qxY!3c@f925=u|_&(XeyNC6Ca_^<0eM-T$Gm@`= zgdsti%S!p}BWub|v#b>DbrhH6^;jS8wSHCci&zsw&O`j{0gpj76MgbaA(iwsrTZnN z-%C0-o5|dlbPIg%J+==rb2uiszH)b}V8WxECjS%e#O(}y&P0cE7b<*%Ja20rFt2>- zjk}x#kGS`bbn2&XcubYvo&GPjPR8sNv%&}VzvQ!iTu%bmsru$4J|F-9002ovPDHLk FV1l}@WYYiu diff --git a/test/render/flex/flexbox-justify-content-horiz-001a.htm.png b/test/render/flex/flexbox-justify-content-horiz-001a.htm.png index 4ec7ba5c9b653487be2ce4545374f956712e1624..fb552056b188e92583b4ce43bee59c99e0587c6b 100644 GIT binary patch delta 273 zcmV+s0q*|J0>lE4Jb&{^L_t(|0qxZ>5`r)gg<)_e4UJdg2sE$ZG#-W8(|H3dw1^-M zHpy=G|NC!do8)!mHEDvuOeM|tEEueMnD#fZS-u6QR6Fqn<9RQ^9R4AvqSs{xBL+kessgPH2kk$w4F!Q!#H zJ&t@nc3&l*-NdpYlv{zUClz-D73|6Tu-M-~Hb4tH^FZl%)l3B>bbimHN-D&-W z*81{ag28Hbzio5UfyW#ciq%XSVK7rk(>Jd+EEKET=E%KAe1Sz~rppox);t&M0z2cp hyBHA|D^AC{0u-D7XQ=q4#}5Di002ovPDHLkV1h9xh$;X8 diff --git a/test/render/flex/flexbox-justify-content-horiz-001b.htm.png b/test/render/flex/flexbox-justify-content-horiz-001b.htm.png index d3e3d1dac075d0a0e9f6a096f6e8aec08856c5ea..1ecc9135f4300a63d4a75c15cf3c73d25a4fe18c 100644 GIT binary patch delta 273 zcmV+s0q*|J0>lE4Jb&{^L_t(|0qxZ>5`r)gg<)_e4UJdg2sE$ZG#-W8(|H3dw1^-M zHpy=G|NC!do8)!mHEDvuOeM|tEEueMnD#fZS-u6QR6Fqn<9RQ^9R4AvqSs{xBL+kessgPH2kk$w4F!Q!#H zJ&t@nc3&l*-NdpYlv{zUClz-D73|6Tu-M-~Hb4tH^FZl%)l3B>bbimHN-D&-W z*81{ag28Hbzio5UfyW#ciq%XSVK7rk(>Jd+EEKET=E%KAe1Sz~rppox);t&M0z2cp hyBHA|D^3=>0u(6HXQ%-mD4YNQ002ovPDHLkV1oN`g-ZYc diff --git a/test/render/flex/flexbox-justify-content-horiz-002.htm.png b/test/render/flex/flexbox-justify-content-horiz-002.htm.png index e42aa749334e3f9b71216aaa57772a0506e8f7d7..76db4f6a2e8ae8af7c7b9a907e09bbe74b0e31ea 100644 GIT binary patch literal 1268 zcmeAS@N?(olHy`uVBq!ia0vp^w-^|h?yxWeS;b#B-vLsh0X`wF|Ns97G8-5gCcK;Q z|G;U6hKB!38IJ#O%wb?)ndRx?7*fIb=BjVrZ36-K!lNGF7x_=HGWXD%(8_nAx2pNo zKX;8=3TBa0el1A*CwBJxwYGWzgE=odJfZ_iuAZB|KJL!G7n+yi?*ISR1_IaSE!%6+ zznaxG@4n-#Ey0WG^2={ecD6GCfnKp#nJuzW_kXsht!H&@(pNgaC3sSf-f|;x_tmm5 zXZ5j$F7}=6?ChNF-mQ18DQ)9UzEzSjbM}4aKO4v0#S-r_FLSxd%^1H_Jw7QQh)SOI z?UBtoF_E3M?3tJRI)ClGo9oZ_^8yH%M3od?D9fmQE-4x7tiT^8K4jy|(mkycRn>zutwwXTLxjbP=nxkCHJ3wFIb@?Ple z>uC!?VC(Ws{d0S_E;#YF+hcN>SJ|G1+a3GQ{Qq#$?RS)KQSOO$koT8eT-4pX%{f{Y zVeiTL;uF>=v|su@Z4TdBv+Z$LZ$$){-r8bmVzQ-d%Zo=k8Dg_vFPL@k=tn+;H&ZTi zdxYKj#dSZrXcpK*QkS=gFW1u5c(vl)mSCg*OzVW}Z+>>ozJL4ar=2VBJ-zjL!dqru zAn;v$SC8+O+*vh*M<(sFj@^E_`?C1a_isxo|L)PsFVfv#$-dJJdm#LA-h91D>7e+; z^jn&i$E#1Tyv=QK{5u=S@U@1%)rE55++BC}HJfBEclmoS>kc$-xA4w7d(`o@_5TZR zwl47a;QC}{nb#V#>oMQNmwU{PURRZ?vqCEOmJBe~q@#)o#kTI9{rbSIbKRHA|1G?k z?Kts4_X*>-Q*x>pmzSJfyY|E0xtBh-fK$^HU}_4@bPRMaT|ReGeVoI?p7Yad^ILbH zjIEa2RJ#BaFOiwq`h2(cJQG3$x##}6a8dES+rOG0i@Uuc`|sBL$KUF%Ec!cV+c$2Y zHw1O}S^S&*dc&=E-ItNm;-;6ZOQQ2iTi@&M^~(T(+{|0u!BfRVN<+$TY5u&=ts(Oz z=kxou1&)@P=bg9lgA;Xi?!QM1)?QtM6l^c2Uz_51u{zpHe_mAGeLf`5Ye&@-PTTSq zi`_+jV$=P%ix>FuK@xW~*2Eq5|Lgm2uO3`;l;~Kb@jtx5+M~*odyB(=RhP&KH@FoZ zRO-9!EAK5y$(-Q`%ty|vFKy~>4qMpUY`3LC*V1TD$CS$DOK!w03e)Qg&we?}PkmR9 znLH>P$m{O5u#P(NEGvY2hsEOs{JL@8eLVU~srNK5{$>3Ces0C~jMKUx6P;iCe~z0I zpM7%T8`mc%tyM+q52PQ-zb*goXvXQRP1*fl!Ku|Is;uyW)|U0o-Pb26AMW;;S?(2A z@366nW$ORvLaRNuu2q$0U+&afe6}5AqWfvRbA4hPcS>Dl((AK=y0l}{y!*_JjcM77 R*8$5e22WQ%mvv4FO#t_@WLN+I literal 1288 zcmeAS@N?(olHy`uVBq!ia0vp^w-^|h?yxWeS;b#B-vLsh0X`wF|Ns97G8-5gCcK;Q z|G;U6hKB!38IJ#O%wb?)S?B5E7*fIb=IYtr#})$agi5`vr>@-983?rfFXzqq zezi$yd+`Ldx4MD*w@*KNGSA8c1bW4CWwyvh1^;YMThHp+Bs?+wR6K`FXcvgFt?P+)}YJdL!hr@2a<$R0Q&gSC< z0^h~1((JkI+pJ8gbv1YXA0&uP$U2KMq}c*L+IvHTCwkwy-|2 z+&QdglZs?RjBi-nTX-|uapD7)Co{iIQ`y^au_OBavF~P4z8N6Unt7{t@>DUA&?)7> zQ2Wo+CVl^%<;7dyuWjr1ES;P^|87b=Se?|{orM>^WtbtEWfE%ZvwZXA&PU(FwogAE zw)521mnUzZ-1@t1)5Tv;E?l^9>f)l_%?l!Z)-`9bNguaIa(S@L_BmDi8iM!a1C?F4 zz;$_x^z&L!2*`j!;L3a5jIAgrB6Q9-jm`SY~_lxZ~wUW>SL7? zIF7x5alB^Bf)$JQ00YuK?m)rO=)=Ok`?hbZ?OAqvera`O&T?%jAc(4*RrWY#DXXjK)4AWK{dvpE^L@`&%Zq=i zvu_`-*(K}rdKt*M&czp=ne*L>I*T0r%jAw-x%t}VV)g3Vr<3=_e2sc_p!DiH=~Hg6 zCj)h8yLOwOo3yRINH*;D-a?e%@LPQF>E+L?bKJPuK}l<^j_>Zmd*R$&cg{J^+Opl{ z@4YxP_1!PS>VKtImlnKM;Bg6@@?ZOatjgXctWgX83oX*|c*832VUM`-{oQU>n@r9u z0Hxy4%$r9YS6?{hC?B{RrfaWiAL|Iy!hAf|GVFw=q*pDflOTZb$O-!x%FG0czjd(^knX& zF8c?@kG8+%|DUua)%51p<5l2vDW|*JB181n^@T^XPfmR3y5x+t>U#SH5spo#{;#!= zjmyp6yKC!9m+2Ru9R``WI8{8|z57N?Zx*AtyDZeDE|LB-YZ@Dm`PH8WmS+r}u6{1- HoD!M|*hfd5kN!3yDR%Cg`^!(bq z`}Y}t&YbZ7@z>XV^QT3J3!s1rcaK@ve|WWH=4P8uw@dX=>;CoCjSa})PvVKY z+^^Bi%4)pw%XPx(O_|>&D=>=GMZH&e9k;o>38c}48OheFqISbHe+EWRb|i-YH8W|N z980}vQq9NVp$B#xNDQhk`TefzZ{{k1z*z@`c!!Fo{43rU<;SHTzj)um00f?{elF{r G5}E)&T#Ld0 delta 364 zcmaFF_KSe2KY$TpHy{WNLW5vNTeP7h)q+`0As zd$~iM`V)(D_sjoeR=yWyK>;b-4gJjbSmiv^+5V^OE;ouC%aeJwJs)i=ck}axh9^+-5h{K$M1G&OR~Y25C6WkXri*i{Ws<+K#0yL)L2(&SiBmEz u(@egtt3G>=lL-he@gTXwW73zE_ZaT_UR=IcIrSw25O})!xvXV%IrA4cJ!H z{%6v>^!#H6Jkl4vwZ4?r*PNeLf2ZCZWTxCk-76LThCGL@%1`9Id^^YXO1~D+`2XSe zf)<{?t2e*)=U%bH201r4v;V~N9Ny6Ql>LiTW1_^hBfqA3UA>+x(Prx(d^-jxbIw#Q l3P^qRUiwNIXxx`Mwah;`)t!Pa$1i380#8>zmvv4FO#s&0se=Fj delta 340 zcmbQp+|E3~rrylc#WAFU@$Hq3xrYq|+5)W`q|D<^D(~1?Yt$ueKJ%QkK_-(x$4QP5 zk5eapdpYv|x_Za){}NTE!v;CVukX8GtNrW2b9lqQr9odOO0*?b=VwZHCQ6v?IQF?K zQR3SEkX3dpO3j?`HD?@5++Y)d5vvRACG2l78ZByXfPrIcGj~eh~ zC;s(b`sv_z4xoCe+u7c?gMf_vI`#{;e^oZ*Ijk19F67lu{hIzG20XjZ?v82g6BGw3 zSi7b;|EFqg{9Z|*>0Zx6UKCo)`SddWy;}@W&%8~tS1SC047cg`FGYX*Gkr18X=Zzh zwZ8l?wDyhf26EoEnAVAd9QKoOuX}<-o9V`lKo5NddT9OSOJ*RMg5Gwq!v<^Wfi72R dOPmq6+5f+H<|L>2=Oc)I$ztaD0e0svAhorM4Z diff --git a/test/render/flex/flexbox-justify-content-vert-001a.htm.png b/test/render/flex/flexbox-justify-content-vert-001a.htm.png index 4b9548411a193fddccaa4713aec87b9de15ab491..86cdcec976feed3e6ce1b6330d1d7673c00f5389 100644 GIT binary patch delta 400 zcmdnae2961O?{!Ki(^OyZNv;#ptGqgb$?CmT6Z@fD9eg8n=o(pxy*XUZKe)xVUA+|w>9>>3EGq? z4OCp5zdZX?+mAOM*ZOkKpYQ1D>3L&&b7Q{xrs!MYIfeiA@BO#;+O|*0biza+*s9KL zXaoeC^inUUnoXE?@{*mJHpmXQu;{QDN4IV9VKFhGW-Z~5+j8V0<_NrJmc02h_40vf zIff2y-|9JU+S+}v2r-M#J8{ilK^X{MyHDc-n+!BO)@j>pKag2vVK)WhdQ(8a_EgvN zH0G3)`4dFLf$ILM+4 ch4iXZAGXRBDyK6rFmN(>y85}Sb4q9e0OX6ZUH||9 delta 388 zcmX@ayq$T1O?{fDi(^Oy(`wrI@=Dhn@^}R=a{nPHBML)|d z0+pg=_t+{KPMA0`bh7HiiBnJi`|<0PyPKQawMjYo&dWEYDC{?{w|8(W%Z~hWo6Trb z^vP$JPnNk(3oUVP^r?bDY2ME^4-z;kYF@WHW*rp^akU5d7HyQ4k4Rq9r6ID}W z-}!>H^7ShyD=Yt=le0W()8~m3V}rjf+%E@G3Q&mfhfM63_s^T~Q$h%;zDxQZw ZaGzcBVJqudgA4{B@O1TaS?83{1OU@HxH$j- diff --git a/test/render/flex/flexbox-justify-content-vert-001b.htm.png b/test/render/flex/flexbox-justify-content-vert-001b.htm.png index 4b9548411a193fddccaa4713aec87b9de15ab491..86cdcec976feed3e6ce1b6330d1d7673c00f5389 100644 GIT binary patch delta 400 zcmdnae2961O?{!Ki(^OyZNv;#ptGqgb$?CmT6Z@fD9eg8n=o(pxy*XUZKe)xVUA+|w>9>>3EGq? z4OCp5zdZX?+mAOM*ZOkKpYQ1D>3L&&b7Q{xrs!MYIfeiA@BO#;+O|*0biza+*s9KL zXaoeC^inUUnoXE?@{*mJHpmXQu;{QDN4IV9VKFhGW-Z~5+j8V0<_NrJmc02h_40vf zIff2y-|9JU+S+}v2r-M#J8{ilK^X{MyHDc-n+!BO)@j>pKag2vVK)WhdQ(8a_EgvN zH0G3)`4dFLf$ILM+4 ch4iXZAGXRBDyK6rFmN(>y85}Sb4q9e0OX6ZUH||9 delta 388 zcmX@ayq$T1O?{fDi(^Oy(`wrI@=Dhn@^}R=a{nPHBML)|d z0+pg=_t+{KPMA0`bh7HiiBnJi`|<0PyPKQawMjYo&dWEYDC{?{w|8(W%Z~hWo6Trb z^vP$JPnNk(3oUVP^r?bDY2ME^4-z;kYF@WHW*rp^akU5d7HyQ4k4Rq9r6ID}W z-}!>H^7ShyD=Yt=le0W()8~m3V}rjf+%E@G3Q&mfhfM63_s^T~Q$h%;zDxQZw ZaGzcBVJqudgA4{B@O1TaS?83{1OU@HxH$j- diff --git a/test/render/flex/flexbox-justify-content-vert-002.htm.png b/test/render/flex/flexbox-justify-content-vert-002.htm.png index 3edd4083d2a15d5694c426bb721c9d93533f9db9..c2605500a536e5866b84a5ac97fdaf391d360793 100644 GIT binary patch literal 901 zcmeAS@N?(olHy`uVBq!ia0y~yU|I!a-(q0~l5@mrHv%cq0G|-o|Ns93nGFmL6W&eu zf8aDjL&N{2499;s<}ffYYkRslhEy=Vxq7j1wu1<3K)M>M$|{FjVpkmOE;&Vc{8vrM zxn?HEc(aw&_Q4%}v*Psm_fIOsxq!f;=g-}%`X93|U3tk}PxJY=pB1$~&5CAd{jJ!) z>AOYU3@ulg@Q_7bThn4{J72|xypN5${k}i{?ZLw#nG;`K-(PZahvcfW94ms>2CdZ# zTpIP&Yn!zDRISie?cuTMzNJ(}Tz$WP_n#_@E7QtW@9IhLzG}Po zPKf_nDb_bVt6a_3+V{OWk$+~3#1DsLne07TR)U2(qrtfTSk6fyd@O5bx6Htxa-KJNJ$6SMD|9sz;eJuFz<&Por9HR}Tj zEMB#2&eK(UXPZg5e=S+{_Yzxno=uOp{sC?H$^%}&FZGpa) zAuHL!@9uJ$n#EuM^x8Xr(?`$eB3lX9mmZM2T^1#XL7I@mY--m25>HEWps3iL zFYEX2@?;cfS){S2ZQBL0TmSD#NnAZJ-$d^2y5~JYa&7V*D;C`fyBoA(QP-;0tW_JI znm$=^%d_E?`>LI;xhDd)PG`948S;5MZ)nKV5bpil!L^?R7Fzu)`XBoBC?{JP7vtUi$X)pPCll5)cG}iB;Cugc}MO7uZJ-5lnh9^9FVf2U8_ zc+kw+&4uZp-NBvlCyL!4$?AVl0s$dgdwZi@KKfIhdCBiAan74R{rdF$&Z99ekN=*w z`1F^gbs`^kthrPedis55mg?0{FITVy?EPMuyFY&4R(0{>rJ<|(%XdB7!Mf@y2j7|~ zAOEe>vOboCoL?~O`=Zt5GNG$NR?5Yd&Nf^bwA5>=*3}=$$HLyW-LccZe`|90&Y+`) z%yQF1tu|zRw9Q>G%c{I;2ZVPGf%n#XC5$2OYqeJNm3ggxHYF-_ zu3T|vmZAjIryv)uU9rx(59E=R^E|goZ;C73a+&XVpzYjOJGLC2VJ+`IHEZhJ72p^N zT{U}k+%Cm%a41E&eno^Bl25N1thy_(Dx`V!yVylurVJpPZU^`Ns9X*XPt?{seTh|)2ylPn$*QdE)m)ydxR{~d`zWEjrXAmL{&H$h8 Z@u|x!Scj<*{GT$`J-dq&Tj zPn%|~b_a@FiwKKTu=X-*(R}Q;@Q=jNPQ{%~JwWiLB(kzz@%=~7bqXL8cFzOpf`T_s zS&V>Slk|x;gVZ|{bz85t{3ut@o<3DxVpDReak{_Ra+hs$_PymY+QfbOTio*8N#XrE zvYV_=Zc_xARqY(vadOV?U<=={c#z?*!>?r+N&>;nmz$Pu_*M4rM}GIo6H&Ty6^Euw z1iFMHQbumpscHF>wNIQ_weE!Erk&nyW!g8*zHUl6apGRcv~UIG>hznJZ%a&Du9FyCzJW`1I7XcSaAt9)HBScAmb`CZEXA6DNL6>+HCrRDW^b Vhpi81on~PG0#8>zmvv4FO#m;>x^w^l delta 385 zcmcb>e3p5F4P(tjTiJSjF~=KXCM=)-26x5X`|o^B|Mvj63#fWY$8UDYQ~KtP^)wAkc{d-vv? zzo-lZyL;EvK6tfB(MQsp?N)r)9f>YcsFqvo^{@2iC$UNb!Oh<%ryT{0gNW7AV56)i z@Ft$xq3F$gv+YN@!fVfK|JL7W&v}+}^4XRXm#pK$CQRJBG3Rwz)Ut{%Cr<2|ChF`4 z1Z9qq9V_qbHgvca=L6#Idb1$O2naS^PR&%PwyLj*G?csd09|VS$Xx;vzs#y|2qDR*F82qC1vWSSViUC+kIS?bpK&w`tV_EW$bP0l+XkKp~bs+ diff --git a/test/render/flex/--flexbox-margin-auto-horiz-002.htm b/test/render/flex/flexbox-margin-auto-horiz-002.htm similarity index 100% rename from test/render/flex/--flexbox-margin-auto-horiz-002.htm rename to test/render/flex/flexbox-margin-auto-horiz-002.htm diff --git a/test/render/flex/flexbox-margin-auto-horiz-002.htm.png b/test/render/flex/flexbox-margin-auto-horiz-002.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..ce44257d5af812826e6bf5d9c9acf6e2f3dfebc8 GIT binary patch literal 293 zcmeAS@N?(olHy`uVBq!ia0vp^6$}iFK`hKb)@d#_Rv;x5;1lBd|Nnm=^Z$XF5P-^+=mVRIMkR+v^`9JY}=G55y$^up6Bp~;tzrc4S3eK3txRu zdG_|6R|}iPkLZG>@AI}LN&wNi1MVz`4fe?0YioWeIA;ah`Rseo>|aMu`ElN0&Y}DJ z4~AFtKZt(L*7h1`Qs$jz_K%SUHcb%Y=0xxxw!E`wvobS~I?v0qU+nvNgP8X14-+a_ g)K?v>`d!Dc`*fglbpAs}pwAdQUHx3vIVCg!0GgA0_5c6? literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-overflow-horiz-003.htm.png b/test/render/flex/flexbox-overflow-horiz-003.htm.png index 3042450f0b7c9fbfd5072fc5b09b65d37aa96bed..18efa69cd22279c3d19ccc69daaeac7d85758eea 100644 GIT binary patch delta 131 zcmdnTxPx(mO-;I|i(^Oy};8n{hVx_ng|(*Zr=J!-p7vz|+;wWt~$(695DcII;i$ delta 138 zcmdnNxQ}syO?|GXi(^OyFU0-_7 i3CKrA;md#3>c3pXb$?0&XFmfFc)I$ztYdacXaWG=zC1?& diff --git a/test/render/flex/--flexbox-overflow-horiz-004.htm b/test/render/flex/flexbox-overflow-horiz-004.htm similarity index 100% rename from test/render/flex/--flexbox-overflow-horiz-004.htm rename to test/render/flex/flexbox-overflow-horiz-004.htm diff --git a/test/render/flex/flexbox-overflow-horiz-004.htm.png b/test/render/flex/flexbox-overflow-horiz-004.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..12842f7ddfa1739017550230a64ce3509ae2e3a0 GIT binary patch literal 180 zcmeAS@N?(olHy`uVBq!ia0vp^%YgU|6El!(RyBPGq<8{+LR|m<|Ig6S(7@2Z!0`XC zmjX9XJlWI5F{Fa=?WwiA4F(bn7lqP}7%&AJaLv-3!QOi8L-65tl_kq6)%EpPhQzLz zzkZq8x`%PfU5noLt@i!GYnoGm P)-iax`njxgN@xNATy{X~ literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-overflow-vert-003.htm.png b/test/render/flex/flexbox-overflow-vert-003.htm.png index 3cad619d910048db95ca7d14a8ef8329b9d15b4b..1102be21fadbb214782110199deb5b43f2fbb42c 100644 GIT binary patch delta 120 zcmV-;0Ehpv0j&X$JaJq}L_t(|0qxWw4!|H3M8O`hrkCWBG+4eO7?#ZQqc+(`seN-V zmcZI_7=~e$MI0W6oyPhI!!T@`DA9=40A6tUZvS(^^SFs!nO!^5y+tdB4Z!xmY@ e;bFU&0=ogF9tjzopr0JsA`mH+?% literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-single-line-clamp-1.htm b/test/render/flex/flexbox-single-line-clamp-1.htm similarity index 100% rename from test/render/flex/--flexbox-single-line-clamp-1.htm rename to test/render/flex/flexbox-single-line-clamp-1.htm diff --git a/test/render/flex/flexbox-single-line-clamp-1.htm.png b/test/render/flex/flexbox-single-line-clamp-1.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..58541d2462b2e86741163e2faf40fdfc4e3c2f0d GIT binary patch literal 404 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYU|h(=3>0~iYq1_k@dWsUxc>kDzk#6v2-e>9Zj=W3;A_oF|-WeJHa1=^YnAtSHAVT;H0kW56ZvmbkH!D{_)E?H|Bs))?6X{FFW9=u`|Hhpoq4%yYnASn>25rE z@%5dkH+cume}0|#Q9=K0Vy@>Ch1^4G@81-Dx+{0R%gix5bo#5!wZeCAMg4Z!^)@PL z^5W||x8Athl>h0y(_{xm1zpZtlTJ9^YVo~y_vw}0XD{K^@_KRrv!cmiu#Vln`(jVM z?s1LxU$Awmnd9oH==pD@Uxw|yovU=WP3*>#7o|nIrQ4s({$pSw)$0bdN=9$@dfiT$ zC3|l_F@N*v*O#d1OyMo7wgUY#G4JZ`yK0wmGa7yS;?%DPm3!|y=?`(;Z?Ijbx4-{* zdADuvwXj<(YqN4|x8*O1{+hSFvqU;70qCKVTd&-ml>h1Q#E;_1Tk5aWZS`hXU&rhy z;P6$FJt0-;1xroAKf~Ia6>nyX9SQi974N8g;c4Jq=fxK@Ku-G|d}|Ic1WLbf>3^Sh z``X=o5!u|i4Pjfil*--r*dDdpR{hf2>_*>jFqidC{HSO+-Auh`!nd1GW`yqhUh)6W z@9))H7V%z)x*GD@1{6Ijueq6?YjD+%xB5%D@?QJ z?A2Sh^xd?Y$?|-YCo;+zF1{#teVdElCAs@g_S&x7d;4+J>n*HNq4~+*@|Q&S<{fw0 z<*U2ld;h-Z>D{o*wU@;*LihIG+&?kT zbeF8~OS7#9)Y8{?XRq9?djCng^Tdw|y2rQbPMo~uw)*x@Q}@{Hzh;%&7AAc1x7_{Rw=ZYlb=&R9c8n6K@mKzB@n%=&JM19ha8!$RjdjE}ro$!^oPVv) zd@CSXbg{`G`SBk9=Dz-)%2K^E;!^Yq;h>`8x>91W*T{_dg}gU-#k}4ulITB zSDUsqhbepMY~Cli`>JK!gTe~DWM4fP~JVh diff --git a/test/render/flex/flexbox-with-pseudo-elements-001.htm.png b/test/render/flex/flexbox-with-pseudo-elements-001.htm.png index eae89224f724e30540032aa0a1b28fb1108a6ab0..0c02696228dd7b138eb0ffe2ec50fdd2fd04a0c5 100644 GIT binary patch delta 471 zcmV;|0Vw{L1dIfbKYzGML_t(|0qxb%af2`rgkf4>=)kT(UUvZf*Ay{%vB#O96QDcf zf1d?>taLCCLdZ8}3>kRv;K73zD)8XJgLfY9mg9}NE>G|}=1HM>xBJ5z0}o!DTxD{D z|J2}h%=3o8gBL5^@-$A#vOcet?Ez8>%v&E(&zq9%X?9+|Vt>ckQ#zTaJ!kLq_SUl# z`0TB#+ws;(w60H0zkAlnZTwjd&69D|8}n*1kR#%~jT@Wm4S@$QR^Y*d2M=DT!0VK^ zIeSVc^D4?~*g6iIJp(CR@Dc*UtGmrHRLtPK#qv_ zHg0ULHv}HMSb+x*9z1xV0`CysEyo-4o+alhJi+UjCk5lp(rbJ7hd1aw%Q8O$^KyHU zd5YcMrFao1_j#3{8oZ8q-k84w4<5YzyeW;^T%>i`)=-V|FElW3ELvmbjVicn8LzB7 zBX26WYZ0%oJg@c&%kvtIi3f1$s{x<*s N002ovPDHLkV1i*A?l%Ac delta 482 zcmV<80UiE~1eXMmKYznXL_t(|0qxb%v70aug<)FIC>8itz+D>1SpC-&;k?-6OwbCh z_JIHMEYRm8)|v<*r)Zks17Y%_2Pb*jDT;K73jPb%=P z$@^7G`3(;qyf>cNqRcDBlzC>#yu3)a2X9ZrzdiN;J$TpUJpvCNy#Mno<=OLKU2U$N z>K!!;^OAf0Gk-77zNh`X>@V->+jCa$=XI1fu)Uu0Mvg`r$y+DUyMD*ycKo!iKH&Yu zb)3~e-jGb>h(sUb#^FXo;K9=hJb3Wn!IKKSLwL8EXv}L$%~^N`@4`GYG2Y$mxxKIN zXwYj)xi7-J+MY7cwA(usPjPaWvs`NMF3gL@{5$aA!CTwU%X6~LMYb;6dQrVXg?XuI zjhC0K;jL}Fw(^|3-0;>WUSoMt?KPGcH5zjmuTEvq05AXT0f7RLIe)WBL_t(|0qxW=4udcZM&Y(nm!7Tz&X60B({wQdbAyCWS%Xx; zOa@c+eg7WiNr4Lh00000_&ImkJfkjg-Cd&l`;el&%)Zc&T(cBkOGuS|U1&%zd0ktG zoFPP7LmuYO%0rUn@`?(%nU*!ghVgyyjPKLRX{_N-E9o?M?MWeehLGAEVq^Tro@~nGMH7WD^&%y96PGoGb(Y00000#Q6YL;*v`?5x~d*0000< KMNUMnLSTY#6k8nt delta 188 zcmZoc6o?qCe#O6>&S;ls0D%W(YSw$-%OuTFy1MO(TeOP8k>ahn@~IO$1ajNI1{{%n6nd#nqWENJ zn2OSok0GD;toamvTKG|Z`#+Ih#8`d{0+Dmvv4FO#oZ4PzwM6 diff --git a/test/render/flex/justify-content_space-around.htm.png b/test/render/flex/justify-content_space-around.htm.png index 699d26127f11a4f218167f03673cab057cfd26bc..295c5d0a98274a2170c0effb07939bff24a61411 100644 GIT binary patch delta 2239 zcmZvdc{G#@1IA|v@2DBWBn?VAU92=#&UWYqpNbYRt4c~pGMRH)hiMu&@- z%5X0{9z7)Xt$6Kc1Mnpob_a3RZ=l^6T6BYY);dDZ1VY_ZR#_?NO$exAcA7-nW`3xF_2@Re|MD!@4Q6DelN(0 zVcnC2y$LeQZc(N8&OjQIMQ|B}K7Pcc5HY6sS(-{U#i@+j5H_`OHJN-m<{{>`iawuM zbTe%5=9V`^eii>d(*Zx*iaw_2_{P^a;sRjKGvSydzS>1eW~c z_v&Pw0w-YuI@vb;rR5_1!fg{fO5tbHNE~n(015_CnG7D@%mz z;83nIer(eD&KrC@qEl6qlDR6rE-QTBls6<#@*N1;r_Rlgck}489qRjOL+-|9L?_%P z-M^NQ5R{p%cDibLHidUAQUywWO6-c}p1-)v#Ws_x6#BAWUm$Lqcle=4ntcim!}HQj z$Lk?O>;tRqHAGKbhzpQ4UkkIKw4@6lsB(>LCZFul@36nH#=h}nsC#TDW#+n(cg&A7 z7M}fd7W2rMkzg#UwNhuPHP*GnFotXO1h*@B7FO`8SlDwpWKAjWI@#lv*HNa%&A;m4 zxE9az1mKa>9$1l-4_uIVkslr)`5s^Tw3nP1XV%%vxXGtj=K_;Fw>^Y{AmC!MF=Z*0cU&alG~31R@0kV!LvO7=Pv#?`1-kGK#Hnv>(I!9vgHQQwfRkKe_2^Bgh7 zY_V+ou{*5=iORggpl_)ypx}*tx*-kv2b~wL*4#V%@5c1Nv61p#$%cALmm#lQQigdf{M zgI6y5P(+kI>2B4pnAK-Dag|JrL{{T6%m(~JX(y_qHJp#l`35C-=*M<76Kv?Q6Lvib zlWm%I3SNUjnIVkjS-lWKr`um6CW<-ncf*C>ZrFsruPa5Ea;LGl@wO#h22Gf@`ZqkU z@(E`8*WrXfaqh2hU+I_VHgWv}Kl>B(E8=s$v+WM+axb;O!3yLaRHY2jcbRJC#AJR% zEG+4D+QA5#Lc3X$|43MVHwCTd)d;c)ucFU(ox;)+=kZfVi z!C8CV$jenzS%qgPOg~>l-(n9)y>+W{ymR;JU0OsEEv<62!&2B3#2UmmQ)#g@XqaQG3mN8T-RJfj42V2mum$2#$0lI0?wq1@coC6Ko#{AsWv_mgA z@)0H3M{)RB=C}MAS&BrH0sqIL$?9F(i#+HPUIX-s@Fg>^Tce8O-qpdeXcE{@(#fgnyK) z<}2`&q6hEvRjM*^P8o(NV`4y?!$~eeZ=_FfY=YNQ$7<$SR|>T5Os2PINhq_ds+Y>< zfYpQG=FfG2g1|D+xuZ}Hb$IP0_qx)f%`gPzc0m4K=Ga+>e`b%4E)bo2Or|?(N!vp9 z1d2APw(EGBD&;fXnDX449W?6oE_LErS~0gkr{gU}4tj5Rh4j}oM{w(oZF_f7Xu@V}xv2S)#RX$!!T z5cZ8VT53igsPTYlo>8-z#Sk8TzBdPalh!pRQdsNt#m_iNtwFcxE;R~6afbFRsuFc z>i5RReh}|Pr@QVBO79n6)M3VwQc$8W7)%!6dq`a9)4Ht){-QUc7LJNeKd9y7zW`=` L>^Qy@^uF~U%V04d delta 2219 zcmV;c2vqm+7wQ*~LO7F2L_t(|0qj-%k^CqQH5s6)y#zLctBv5QehKU!lYc4)LJ|_j z_@nI}dPc9t(|kxm@X%v%I2@Bt2^D|89gt8v2OL67AH?s@`{yF4vpq@(e0S168D|MO zW9PVlL`X=gmA=U81*MN;^kKV9Mw~Z9I&MTd*mT?xsi2z=<)Of_^3lAOEGOh4Y!HGK zGa|(C5HcYoOPUZO1*J>oosc&GE5tN}kVQ$CXp|H3Fs>5fZ^%PP2TQV)+JJwj3`MFU z(74Q(Nhjppa7CI7PRL|%LL3fp#^}+te>?e|BHXBx2mhHu# z#_}()e+tL#c5NYbV1xOb$#;Khtlp4xP<&{*k9#R??BftQ8$#5k`QVls#}K0YYc+M& zK4^0|->ESoByzvZ;Z5Hoq*E=1kT51hZac3X4%nQ{cWU$q;SCoVlMO<9^<-%T$Px|21ThSxaAN^zr@0|O1s3wHcL&DE86$+NBbf@ zl0V1OF=fAYud?^{jo>)ij_1oE?!ZJPaUKH}LH zcH+S())~Nd9@7v4$8vyC+|>cD_qTZv(7U)T!S5hsl)x@NfRJG>ZzKd#2?l^viLikE z#WK!)E<+s4O=VlExWv$7G+tx%{bUS3+DW!&yU?-kf5qZ`aExXzGT-&hzgdZjP2@G& z{B^z@vloxgO~*P;2(lX@ZUlWx8~Zp!bO$A!+D9%y>W4bUnQ6PVpYox(dI@ve`h!lQ zjn#{-;)06b`m$sJ-*ni>pVwD0yYcWR_pek){(5{sNUZU? zgv0}ce?&`2n?F{HCM0eX!nvO(q?DXELt7zKu2#PIhNx2J!)5!WiPiA~O`;-1;?YGB z`yL@O*CB)su#MCD3L&&MuK`;X3hK;y@#rG!Smy{?>djaYVjimYhBc)f^w@w9y>^EX zEfx9=?N^B2M_VD*Ze8KZSwhz}hJ=jbiL&See>_cyD(_bb5wkl8(e}TDkX%|=UI9qA zi+(RWPOm0#JBSTUfxIClPBa=Eq?D~6N>hmnJrG?G2*H8L(Ngg=RCycyASkb zLLwhP*&*J#4k0)mEg@V*yM(AXrwED12q`(MeS9)-BeWrN7)%IB0B_dzH!1|G)bPCa z+p;%=a88_Ghmb(>rE_EX`&fYbx`Zt1mYVl?K!`*y^VXzSA$D%PR(|W>Ssce=pI8 zzad(SA0njndxj8>LpgmafJ(o}3y>bu`@rM;hOi9jH>AAubUxzCQj`A~DG396&Vk3O z85BZPjvOCKj*<5OER#PE^X&>cxqbMHaRyGvRA3pI3DC)HzAPOMhvWCaycJ+I8Jaf~ zTG0*=dw%N8HSwjb=2yOZxGTqAf3jN-6Rb@h1L%a#ZWcBURc%1Wm-agefxUGO5E5o1 zME4JDHtZ2HIN-~KoXl}rLiB2oBqe_=Ez(X0oPHzEv;2Uv(|&dXy2IDF#OwLy@vt7- zw7;4ogtCsrt$neh-xN4nX@3-}HzY*9$r2f%RI-b-iXWe}JIk;rzWh z!l)0trj7k3Mq0_bnUG$!>=1%CT@ix)y9tR~{bF0zoP`iBV{RYaEcvyMc8?H|fW{Z4 zf-6Mjv1NZXM<_C8E&?#|iaa3%)Wi5Bpj#nz4&+83xqWMnEjPM?_&sTS`5=PLW6S<( zjv${Rgzry}khieG3Gu1je@RF^Kh^#OLW)n9kawsSN`btcrG!}?q@6z2)NCVuyt~FP zkc5=SvbL-2Bw3ONzFCvk3O3%R{ly&Vttz?NKH73DoR{%;JtJq|nj?UX_Dnf`Tg;!G z*zY7ne-q+u?9H91e%W;cz${4u`|xa5x+ehr{8xj=vfIe^~sz!XJyZ!Iwpy z`0hP^6r7OB;Dk(umJrw>1OUc_Bm*bp1vG^GcZZPw{gwX)g#7!T{O5#RMnecVA>WLX zlC?`n;lv5KjI(dZA1CBlI3bhaJR$IBNXWkcUrxw%oF;?{#4F?>oF;?{#0hx_X9?i~ zaY7!#Swgr#wg^dVD>xyq;3OeZAWq0bXb1s-F(Jv|uc2fmgD)rKI@${PXYWz}v-^g8 zIUz5=lRgR;lR63;lR63t7x)xH{?8sAkN^O{KoIKRdMO46uN9mjv!Mzj0h53WHY^9% t9vut-001x$^0ywuo>vMzga7~lbPYg09%}Edu#o@&002ovPDHLkV1n~LG;II? diff --git a/test/render/flex/multi-line-wrap-reverse-column-reverse.htm.png b/test/render/flex/multi-line-wrap-reverse-column-reverse.htm.png index ca592ddb2297a4ee47eff4a0579994661e30a686..1cbe50aebef9788e8a2278174f526c83fbe02e08 100644 GIT binary patch literal 1622 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYVANq@28x_yKE(;7Bm#UwT>t<7f9A}Y|4SME z|7QT<28RDY$nd|aOyv#(1M5#u7srqa#y3~@=1Mz?Fg!GVz@!ow!uaMu0xQ!xMpm5z zoWJ!Cy5H-6$T%m-Ixo;Mo&8b!T8$Hi&a69g=8Fdw z?uxs<{<1#nMz)#H&wniz3pd=Gt9b8>!u7pJLU}%YF4q3Ij%{a-qMkB~C9hygSTj#y zs%-hxDj*T+IBj><-=O9_{2$wN6z}Qv|MueD)UqRP`tMVAitj%^-nXfF&0@Bjd>wKr ze|1h=JjhdI^NMxmH|C%TnN|DbPrupU_2_4vPVud}{ngjBv+v1$eQuq!HYw=eEH3Gd z`xTkjINd)g(9z_OsLaLG+N;4KVzx*j;Krx`$>A}viO2Ap7FW=OCXpoytePH~wYKmm=MBLR+iudl!T_EhstXphK~J#3csZ&P_%_jXNey2E7@HetUkmlA)|oNDJM zmQ8c=`>Rh|DzF~Z>JwIyozRpZ>MroIL4;-XjphjUB?=Koztq^rZ7)9(bYr!ICd>jC z#|0Y%SsM?ziLgLyq_IFtm*6rKze2n%7-raV$Ze0vlX!57lK=kubMpVc?=(3?zF+UZ z-{1fDyZz_od##RTN^mhLoDyA8V<+`}<-f0t43?1lWi@wmHwA>B!~Ox<`R^;i0_>tUs4d5MQDYV)OoZZQTF= z)dQ52)mSABzXhX3KPX6y)J||fGFMW_gwnrJub*iGy(RKwN0ZFt<7f9A}Y|4SME z|7QT<28RDY$nd|aOyv#(1FNT}i(^OyKwF1IODE8c zM-+TmS`?Mo5|tEq1PwWa8527?9A|KFIJ@v1a&eGQN)k|GIwT<2Y#=!FwXiW69nlrw zI3cjzK|#U!4pUf9(7(>6pWm zD3TI3;V*BXK-0$>>Gv<&1bUtyuCS5YuUDnO`g2=%w!DYqKBIMeft+JIel&_a(SBTN zf9~gxy(}QTEfJ1BEQdHYHqGE@5lmt=6y#7o!j+^X;MO5}#6_V;K)a*UK|(Q1K)BJs zX^ny!aT?lgur@l7M1ZX*G+ aXPB=cCi8B>xdLFp%i!ti=d#Wzp$P!{HUirK diff --git a/test/render/flex/multi-line-wrap-with-column-reverse.htm.png b/test/render/flex/multi-line-wrap-with-column-reverse.htm.png index a3d6d6ed14bcc2e475e6f13ff4c9b54cecad7e2e..45b3da248d4d365d87ad650f8adebe4c25c0012c 100644 GIT binary patch literal 636 zcmeAS@N?(olHy`uVBq!ia0y~yU{+*cVANq^28yg~44Dq3I0Jk_T>t<7f9A{?AdiDp z`5OZRlb)xGV@L(#+p7oH-uB{Q4Y=L#|54~uCA;*6d`s%KoQ&i4ojS8pwZ&gj zaJ32(=U0kKN=l}}Cu`)+=X4%_Ja^59dR@=k%FiZG`10|)s_M`6{qs#VBh#ccPiEUI zZJY8Wd*5ke&6{q$y816OJx_b-?T9T*$-iD*w&7o;r}z1jzq>3mtL-OGTKZMFTFw4f zU9<5_-77m{-J?F0@}JD!-<~3UI^SF8fa1$yZh6U*e~h;Md;R`%w9v^jx^vFVn4H2Y zL_V0*t@?8U1l$Rnl>6AZXy=l*g0}-5H}Ra@7&aj%RpoP;tE^`y$btJ!SycqRLnf|C zRdMG$S?2a-bCb$#Hcl+yizNUu=`?>i0g`Du3~qbCLW><7JCl zmh?(yiavX?b4#5L(89j?TU%5t)xJ;MGby=9*;77x$MhSqH-(_api=t-C-Fn5tQMGn7(8A5T-G@yGywpGDD_qV literal 627 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYVANq^28y^j+ph#toB=)|uK)l4KXc{`kjKHQ z{EdNuN!8QEF{Fa=?bVHEmlz1J1x&h|u=@98#RB#V{Hg*Ew9e02*Ce~-^Vz-rPA+n1 z56f-t=;-iR>SA>IlULY}%0-<{6TWurnEyU|&+m#{%@cKLvm>UNUE3bgd;adBsZDdD zw{?CrJod|$H}dm@7-4^zwb%FBly7lALe=Pp&`$N2Mz$b{OMIn|Fo$xN_YcmH3lbbVdNPPJnnebUZ&Y&vva*tdav@aOx4 z8V3k?*7zj5!G=4szvHhCLnd=k9;-sN=!x1bi+GkC>RIEyzb^S-t%pmu(uB2KPu4Kp zT;EYA+5psn4P0rq5rBXRnF{MuTIDCSE54W8_>F18`6?G_{u4SAuJ>v%W?aEa~79WIA&S`&U}xQcqLHc)*Hff8gEwY@d+GN{#99`_34DKf{a zq5}%GXhevu&};$~xh-r66oFR3S`jS|;Z|VK(GIVG($#H#TC#mO=OpLD$vMCCKj%t# zSRl@Jvn>XL!37=KAA!MOX%-_}TUjyzU`doEYzPmDJYY7P#bU9!t;cM(q%d_a5dJLR zKz(olgR$-m+V2+$VrMj2g|}(zR*tmhHk`PV6ON_Tu4u~newqG0{>*vdsbaUF0^|XD zDVkXKs8-PUacjF=Qw!-HrPB@A4hHI;O7Gvk_LsykfB?Y7c=MY?~F=fh`v#&HVB!ML_-+Bn-sdo3>l5q_ZV+=6?&hrSJ7KNnwsO5gbE zW?o*db=1Q?3NRC_Zsl(;-WOt!G-H{Y20ZxsroPa}p_-hu@O@hS(^7{SI56(GDD2K9 zQiTNfx{B#~MAjMMt%v2yX!TvFgyUPIHKSs7U9aR#ei_$xl2qMITsP3N6=>$UJE)lRwxmU5GBWsW3DZ?Mq`Fpv1f|cHCqLSi zM>8sUZ38(m_f+7k?A!dS4DU8|(|1vniPnRqr zdoqlYt_Gs$6Ei1#yW5)fGYmKVNlPy_ieXc(RiM-5JSowa3#v=m;MesaCc7we z&q%@Y8hE6eL(d>ob2G`uhLgzmM3Eu*Z>GyMbh1;FSc{v1{zs#r?xW;`ilrk%0b18KRTayKF@4nN?$cw z%Ds(P;#1xuY$erE+S5WYC89oKf&e@;JUVFc83aR@uv=(lI{2u{UDsNKg0jGjn zsrO^pv8&7e6|@!Zaw+l!D>kHOpJ>R7vV-!iozV}=t_nO3G??&$vyjh^_KH*WUWpk% zW7O--^a-Kq-Qw^+gaPxgB>8MY!;_aYEZ%mWl4zj9*SuFDlYSmY;#a55A<=`oq(vm) z;f~MhNCziW9jx6PjSKv?vi9(fTXdjt+c_$uqQZGW6a8|%+Ol?{8q2UN`N@awC`wg9 zNojNap@fgQWXSsDMYP?bP~_JIF)(^yn06z0HQOj&2@OI0&uHCJ{J`HbO##5>|W&C V7ilo*NuT~((1Ec1_5LTa{{#_4tHA&O literal 0 HcmV?d00001 From ef70eefe4f6358952d0dbcfbf507b4c3bfd8f504 Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Sun, 28 Jan 2024 02:38:20 +0300 Subject: [PATCH 72/73] flexbox rendering fixes --- include/litehtml/render_item.h | 24 ++++++++-- src/flex_item.cpp | 28 ++++++++---- src/render_block.cpp | 16 ++++++- src/render_item.cpp | 41 +++++++++--------- ...m => --table-as-item-narrow-content-2.htm} | 0 ...3.htm => flexbox-align-self-horiz-003.htm} | 0 .../flex/flexbox-align-self-horiz-003.htm.png | Bin 0 -> 1182 bytes ...4.htm => flexbox-align-self-horiz-004.htm} | 0 .../flex/flexbox-align-self-horiz-004.htm.png | Bin 0 -> 1113 bytes ...01.htm => flexbox-align-self-vert-001.htm} | 0 .../flex/flexbox-align-self-vert-001.htm.png | Bin 0 -> 1145 bytes ...03.htm => flexbox-align-self-vert-003.htm} | 0 .../flex/flexbox-align-self-vert-003.htm.png | Bin 0 -> 616 bytes ...04.htm => flexbox-align-self-vert-004.htm} | 0 .../flex/flexbox-align-self-vert-004.htm.png | Bin 0 -> 805 bytes 15 files changed, 75 insertions(+), 34 deletions(-) rename test/render/flex/{table-as-item-narrow-content-2.htm => --table-as-item-narrow-content-2.htm} (100%) rename test/render/flex/{--flexbox-align-self-horiz-003.htm => flexbox-align-self-horiz-003.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-horiz-003.htm.png rename test/render/flex/{--flexbox-align-self-horiz-004.htm => flexbox-align-self-horiz-004.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-horiz-004.htm.png rename test/render/flex/{--flexbox-align-self-vert-001.htm => flexbox-align-self-vert-001.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-vert-001.htm.png rename test/render/flex/{--flexbox-align-self-vert-003.htm => flexbox-align-self-vert-003.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-vert-003.htm.png rename test/render/flex/{--flexbox-align-self-vert-004.htm => flexbox-align-self-vert-004.htm} (100%) create mode 100644 test/render/flex/flexbox-align-self-vert-004.htm.png diff --git a/include/litehtml/render_item.h b/include/litehtml/render_item.h index 038c95a68..bfe08d119 100644 --- a/include/litehtml/render_item.h +++ b/include/litehtml/render_item.h @@ -224,12 +224,20 @@ namespace litehtml int box_sizing_left() const { - return m_padding.left + m_borders.left; + if(css().get_box_sizing() == box_sizing_border_box) + { + return m_padding.left + m_borders.left; + } + return 0; } int box_sizing_right() const { - return m_padding.right + m_borders.right; + if(css().get_box_sizing() == box_sizing_border_box) + { + return m_padding.right + m_borders.right; + } + return 0; } int box_sizing_width() const @@ -239,12 +247,20 @@ namespace litehtml int box_sizing_top() const { - return m_padding.top + m_borders.top; + if(css().get_box_sizing() == box_sizing_border_box) + { + return m_padding.top + m_borders.top; + } + return 0; } int box_sizing_bottom() const { - return m_padding.bottom + m_borders.bottom; + if(css().get_box_sizing() == box_sizing_border_box) + { + return m_padding.bottom + m_borders.bottom; + } + return 0; } int box_sizing_height() const diff --git a/src/flex_item.cpp b/src/flex_item.cpp index 36176368a..90ecfbd54 100644 --- a/src/flex_item.cpp +++ b/src/flex_item.cpp @@ -234,8 +234,13 @@ void litehtml::flex_item_row_direction::align_stretch(flex_line &ln, const conta set_cross_position(ln.cross_start); if (el->css().get_height().is_predefined()) { - // TODO: must be rendered into the specified height - el->pos().height = ln.cross_size - el->content_offset_height(); + el->render(el->left(), el->top(), self_size.new_width_height( + el->pos().width + el->box_sizing_width(), + ln.cross_size - el->content_offset_height() + el->box_sizing_height(), + containing_block_context::size_mode_exact_width | + containing_block_context::size_mode_exact_height + ), fmt_ctx); + apply_main_auto_margins(); } } @@ -337,6 +342,7 @@ void litehtml::flex_item_column_direction::direction_specific_init(const litehtm { base_size = el->css().get_flex_basis().calc_percent(self_size.height) + el->content_offset_height(); + base_size = std::max(base_size, min_size); } } @@ -397,9 +403,8 @@ void litehtml::flex_item_column_direction::align_stretch(flex_line &ln, const co { el->render(ln.cross_start, el->pos().y - el->content_offset_top(), - self_size.new_width_height(ln.cross_size, - main_size - - el->content_offset_height(), + self_size.new_width_height(ln.cross_size - el->content_offset_width() + el->box_sizing_width(), + main_size - el->content_offset_height() + el->box_sizing_height(), containing_block_context::size_mode_exact_height), fmt_ctx, false); } else @@ -407,8 +412,8 @@ void litehtml::flex_item_column_direction::align_stretch(flex_line &ln, const co el->render(ln.cross_start, el->pos().y - el->content_offset_top(), self_size.new_width_height( - ln.cross_size - el->content_offset_width(), - main_size - el->content_offset_height(), + ln.cross_size - el->content_offset_width() + el->box_sizing_width(), + main_size - el->content_offset_height() + el->box_sizing_height(), containing_block_context::size_mode_exact_width | containing_block_context::size_mode_exact_height), fmt_ctx, false); @@ -421,7 +426,14 @@ void litehtml::flex_item_column_direction::align_baseline(litehtml::flex_line &l const containing_block_context &self_size, formatting_context *fmt_ctx) { - align_stretch(ln, self_size, fmt_ctx); + // The fallback alignment for first baseline is start, the one for last baseline is end. + if(align & flex_align_items_last) + { + set_cross_position(ln.cross_start + ln.cross_size - get_el_cross_size()); + } else + { + set_cross_position(ln.cross_start); + } } int litehtml::flex_item_column_direction::get_el_main_size() diff --git a/src/render_block.cpp b/src/render_block.cpp index 333395235..13f815e59 100644 --- a/src/render_block.cpp +++ b/src/render_block.cpp @@ -234,6 +234,9 @@ int litehtml::render_item_block::_render(int x, int y, const containing_block_co m_pos.width = self_size.min_width; requires_rerender = true; } + } else if(m_pos.width < 0) + { + m_pos.width = 0; } // Fix width with max-width attribute @@ -264,7 +267,15 @@ int litehtml::render_item_block::_render(int x, int y, const containing_block_co if (self_size.height.type != containing_block_context::cbc_value_type_auto && !(containing_block_size.size_mode & containing_block_context::size_mode_content)) { - if (self_size.height > 0) + // TODO: Something wrong here + // Percentage height from undefined containing block height is usually <= 0 + if(self_size.height.type == containing_block_context::cbc_value_type_percentage) + { + if (self_size.height > 0) + { + m_pos.height = self_size.height; + } + } else { m_pos.height = self_size.height; } @@ -299,6 +310,9 @@ int litehtml::render_item_block::_render(int x, int y, const containing_block_co { m_pos.height = self_size.min_height; } + } else if(m_pos.height < 0) + { + m_pos.height = 0; } // Fix width with max-width attribute diff --git a/src/render_item.cpp b/src/render_item.cpp index 72f3a409e..0af172807 100644 --- a/src/render_item.cpp +++ b/src/render_item.cpp @@ -1074,28 +1074,27 @@ litehtml::containing_block_context litehtml::render_item::calculate_containing_b calc_cb_length(src_el()->css().get_min_height(), cb_context.height, ret.min_height); calc_cb_length(src_el()->css().get_max_height(), cb_context.height, ret.max_height); - if (src_el()->css().get_box_sizing() == box_sizing_border_box) + // Fix box sizing + if(ret.width.type != containing_block_context::cbc_value_type_auto) { - if(ret.width.type != containing_block_context::cbc_value_type_auto) - { - ret.render_width = ret.width - box_sizing_width(); - } - if(ret.min_width.type != containing_block_context::cbc_value_type_none) - { - ret.min_width.value -= box_sizing_width(); - } - if(ret.max_width.type != containing_block_context::cbc_value_type_none) - { - ret.max_width.value -= box_sizing_width(); - } - if(ret.min_height.type != containing_block_context::cbc_value_type_none) - { - ret.min_height.value -= box_sizing_height(); - } - if(ret.max_height.type != containing_block_context::cbc_value_type_none) - { - ret.max_height.value -= box_sizing_height(); - } + ret.render_width = ret.width - box_sizing_width(); } + if(ret.min_width.type != containing_block_context::cbc_value_type_none) + { + ret.min_width.value -= box_sizing_width(); + } + if(ret.max_width.type != containing_block_context::cbc_value_type_none) + { + ret.max_width.value -= box_sizing_width(); + } + if(ret.min_height.type != containing_block_context::cbc_value_type_none) + { + ret.min_height.value -= box_sizing_height(); + } + if(ret.max_height.type != containing_block_context::cbc_value_type_none) + { + ret.max_height.value -= box_sizing_height(); + } + return ret; } diff --git a/test/render/flex/table-as-item-narrow-content-2.htm b/test/render/flex/--table-as-item-narrow-content-2.htm similarity index 100% rename from test/render/flex/table-as-item-narrow-content-2.htm rename to test/render/flex/--table-as-item-narrow-content-2.htm diff --git a/test/render/flex/--flexbox-align-self-horiz-003.htm b/test/render/flex/flexbox-align-self-horiz-003.htm similarity index 100% rename from test/render/flex/--flexbox-align-self-horiz-003.htm rename to test/render/flex/flexbox-align-self-horiz-003.htm diff --git a/test/render/flex/flexbox-align-self-horiz-003.htm.png b/test/render/flex/flexbox-align-self-horiz-003.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..2d7feff597c79bc56745b4cf6b747727b72f57d0 GIT binary patch literal 1182 zcmeAS@N?(olHy`uVBq!ia0y~yU@8EzD_EF;WW&cxSAdjyfKQ0)e;`=Ou=d6?pa28I ze;{ONX!w8N^#A`16W&c=`2YW1)4NMsdPMB6u4G_fG4gbA45?szd-eRpS8f7q1)&dF zR-9!Jy0A*HNZ0Pi0-g|;4WTLr8b#(bo!>X{kX&tPz`L1wy)D}!**>}-Uj5$L-z4eY zg1@2tYP)TVm9On+ooM~%&ug{elqw5*M-Jkb9bNOt( zi)H%`flJ?isR}>%*P~W9fB)%1^&Kmt(?aT`8Qn{CV;C*O*`)d1T@GhuHP3#yZDMC@ zw2=M(o9T+K55F~~KI}U!yWO~`<4nBUKeHl}PpMDrl@~v__a|uY9!rsKC%($czE@aS_8qUcW68VRew*ja zzrT;Ib}W-&e9m8avN`Xh|F(=B=f8>;{C<_SV?uvGN$s_pyu05@$2g}tN85SD&uQ(h zt@~AK)uR2VER;LX?Pt%XJM*6^YlC|<_Wa@#B4F-$YpZ5ox zNU?J3`?u#^!H%6iYV(WcCU898wdP5m_UYdTbbBJs@3_0O=C#G%+(jSQqYLhYr$1OC z{&WBHw@2mf_@sxbOI|tnQ){}TdO_*iEq_+?AMagNuyB=f^1+XKj)(h;*A>-bGED0( zYwcE?_VicG{=(xgPsX39;=L5T>Q>gDWubLtE7SI}{$Bg|)4`y#Yx=BbZs~o!V%e3Y zx7MC{`Oryt7rWK{ZPEJ1k>z4@?z@z@NJs8_TO7ZSb9M*M*Xd7Z?bq4=+K4krnVX3?IfEpm7L?uILC zFU@~wwT|=Q8XHc(TfMX2JS;eWYVrf8%Z%^l6(ok&D(<-V?7-D;g|iPwom)Ped47%P zR?C7?4~}yu_C73|X!x+lCzox5C`Alu?VEW5kQsbir{ z1vTM7%BkQ^%B}R+sX{X5GrvWK`{rIdRQlS)cSqh_CcXlY_6@7m_O8zB^oZ_T{pA5) zP57;%n58V~Dw-C`!Lu15N`N-BA2bb7|1?p z?b>B#pEFP8Dn~oblHIZMS6(A)M;1lBd|Nnm=^Z!zYwKtvt zX&_{1X!w8N^qZI5+ZY&_|9HAMhEy=Vx$0ZA*g&8yQU4i}t!DrAbG#by3f%Dxu6z%A zzpp9!E6Bt>hiPHU{=A=moldU0q_X(9?v?hnN}s;hs-%1V`n&zK2iHv>Mz)^Jo`y=x zo+C_Y9KkG;XRqz-%rBGdX{kD~YwAsoVn${)=QEN$+iv^(n|F8liKrR6zt8;qd&ed_ zk!`b>n~L(8#TNQ~6C=tF?)jbkZ8f)pqT05bE5H6oJ9y*Zn!D-Sj)>$-h8`1G_QUkq zE{8?4eWUsl4pj;Mi!{%^#{4XK;whi6om1={u~lmSiSXz887BGhyhG~07l%crFRGk1 zzifY+;n$CunqQAtJ^Qr6yQ1)y#LHdYEXL)=pZE71H|$P2mS@~5@&DfM?g$t6~+ zXRK4XB$_UG<_>q#gSji&Gy89TPJ5fERI4JhxyE2paO#1Eo8OoscAS6HAQ>OtHuKei zgaZvfZ^|<#vn}49*~GY*4QR~l$m1R>+Hb7y`Ep)D!XP1zZ}R!vX`%Bad4QY)4HuhE zt~@{Gc#jsdo9Hs0WqE00%KvUIH=5XRl1DkVd}II3w`S2lW}g(?eAzIX@$!4UXNJv; z%xpXo&Wwvq6SlDRTx+-}We~;emVF?DS7I$;!O49oEr_i>$xwOnTB z^3`(JcmBJd4QIC&9?v;^YR9cRd2dq~lowB(`S15~^+RS7@nYePG6oAR^xFiVO8oz3 zp8SMK;+1jcjC-sbs^;%hk2$OSI&;Rs22jAw*!W*(QmH|m8W z5QXoc3y?#ay9h|y!2Ab(c6`xQf&2pk2A{22kZ%ox4CK|6FF5)N&;- z(Z$ev443=3UJnR}AKvWj%$uyNEUi8&6lmXG9q9*#qqhUniUX@ij0Rlc+E!7xfJ~dW z-iqQ{;_ceefI@R_Me`&`n_DKY&}Q-q$=&Y3XcX?`Xvnk?(F(Y3;%Omr?`Yl-yhV|e z#>=FT2C26R(nvKKRf*=lO<>|=TBeAJ(Q9%*8aD zqX$G5>D%$pR_W1jTjF-*cNeU{q|M6J%CF{G-BP{HEQLVJasi!I9-R4@o=F+a zSBcMLiISelWP3^ZPs+4c)2xSN+IVOHT3U$wJC?WBl>Lh%C5@O#9qlB4nRaO!t0ucD z(cHHQOq@*1wDU6{)(Y&26AMyriO@oyECqeCZwBzZO@!8+pvD`$CI_U^&#m{qF?&hM z6K909?>3!&eZ$dEw0X)j{J3!owky1?H=DKl+pIM-Z)^=nXzPQ$M`)_zazb`M88 z(go2|q9N19Mze10`iN~l;(N0Z5H=-Ekx3y9Qg4%?(QC4)65)MId*Y-?`~HEi-v^{s zhu2lu(x3qkxT`9+H>VonVh?tfcw5> z^1)XO)f->`JKAs3uACMPnKmMtb>nuzAVlsR%^QNZD3a26nH16>^)^8osV1W;(cHHQ zOq@*1wDU6{7U&ZvQgx^FmI$rula-)P_RRpEw~5fg35vYYYjQvuJ(GR+joM36o;az} zKKzGYef`wwk2GnINz(A?(OCFoOX2O&(fp(E1|e-G^`@m+CZB9QK~yD)_LBF{r}{I~ zMnIcAZ@2jA8SuMXY?@oo+cwzpX=cfx%ppIMM(Z4EY1B-K}lOky^(2F7WREt z96PsLCT&lpmq=+}sBh{X{Y9hgk3o9@Z6DM2L|T1JtGP7PdwjN4+rCGQ+5%=K?P=F% zdL{!6*z?b=^HwKEv*Pfyy2+%KOAYc3koA&(r+rlDvW~K{vd-ym-S8mbSQjbE00000 LNkvXXu0mjfAXP!Z literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox-align-self-vert-003.htm b/test/render/flex/flexbox-align-self-vert-003.htm similarity index 100% rename from test/render/flex/--flexbox-align-self-vert-003.htm rename to test/render/flex/flexbox-align-self-vert-003.htm diff --git a/test/render/flex/flexbox-align-self-vert-003.htm.png b/test/render/flex/flexbox-align-self-vert-003.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..6246abda97be1f5f690ca86031a394648fcd2767 GIT binary patch literal 616 zcmV-u0+;=XP)KV$^${%++J@D!OrxRlqEqbzzNLC4UZ~RNdYU20V^n4(Z`@TQ1vL}iE{8u z8c?xIcZKK*T2K^F3I#b=*`sD-7uYM+H$yUNbr|((xOxDp)`h~Z#_j;{QT9;R;Rv7r zF%*qSA8Hi>ii};yw#Sd&Dnk_VMAe{+U_iw#-4&uMXhBgxDHP;fWsjPTU0|v2Q~4O@m~VZJQ>X;c52it}G=3Mv!lKsCM!cdR{;oR2X{**rMeH zRJiT!J>`d@Ezc4~-#H^HcImE0JM?RA?71k4C4{;F7StEUF0fasZw5AMra%2fN23K* z>O|px?+>W5U3Gom`JcWMKm|)3z(;kHF-52_^Db09EBYYRm5y1VkTHthJ-?n*LdSGP zZ*weSD0V<86y#j}02BnqF11%$Zw3+6`ut&pB#g4tA2ya}qX2`AwZ0C=QcY4BT-l8; z!(&r@t?@4qj3s+RlZ-l_CW4Vhr3Wl2pn?A|1vKGbknT$7w%^fvekkOLIsq>uDt76v z5M4nFiULZZAm=K3)NJemd!_nj;G&A6FpCy_uRa0(({hhs`<*8M0000|^Tj;8iOAuP2kfzm* z!5WBxc_orHg0cWaCIw=AmhD{d?nG7aPXq!8%nGjBf`-7FW@myIz4`S;dV-JG z5duamqM$tapNfL(`&yn_f}5-XAC%PxQ>a2IAo`1d*Pt9z?2Yn9U2v_-@P~CE2M#H>duBnTilwV)S8LG_;?*tcNhv7v>o5O^jSt~?_v zar$X~3f{BP+Lb2*0R+1dysjn%pBn@U0;(Y|>XCE=R6{=0BhA&IdU<~7mO-xu)ywls zw+ucDc(n`)_|sGc?YJfc?YI!^OYpN24ebXv_5Hw`FB1e1K;TfY5Jkb#(;)Ctu;Q_y zg{}}-6U1?BYShT+O4_a9J01uia4E=6D=0{uBwK!Flx;1@zFB#e2W?*i@yb*Q(jM36Za$OR~8p~wm+v*6Q?1OWsm7EA?#6A6BE3Bv6Mg}}Xl7IOwc_MJ-s0R$%% z5CqNyMFXK8X~P;&bD?tz_$)XUknq4p{&)XY7400000NkvXXu0mjfaF|iA literal 0 HcmV?d00001 From cca054779b99d9e1a545d3039cf65cf47d63a03c Mon Sep 17 00:00:00 2001 From: Yuri Kobets Date: Wed, 31 Jan 2024 02:36:05 +0300 Subject: [PATCH 73/73] flexbox: some tests are resolved --- include/litehtml/render_item.h | 11 + src/flex_item.cpp | 55 ++++- src/render_block.cpp | 20 +- src/render_flex.cpp | 207 ------------------ src/style.cpp | 9 +- .../{--flex-inline.htm => -flex-inline.htm} | 0 ...> -flexbox-align-self-horiz-001-table.htm} | 0 ... -flexbox-collapsed-item-baseline-001.htm} | 0 ... => -flexbox-collapsed-item-horiz-001.htm} | 0 ... => -flexbox-collapsed-item-horiz-002.htm} | 0 ... => -flexbox-collapsed-item-horiz-003.htm} | 0 ...m => -flexbox-flex-basis-content-001a.htm} | 0 ...m => -flexbox-flex-basis-content-001b.htm} | 0 ...--flexbox_block.htm => -flexbox_block.htm} | 0 ...> -flexbox_rowspan-overflow-automatic.htm} | 0 ...flow.htm => -flexbox_rowspan-overflow.htm} | 0 ...exbox_rowspan.htm => -flexbox_rowspan.htm} | 0 ....htm => -flexbox_stf-table-singleline.htm} | 0 ...h.htm => -negative-flex-margins-crash.htm} | 0 ...m => -table-as-item-fixed-min-width-3.htm} | 0 ...htm => -table-as-item-flex-cross-size.htm} | 0 ...-table-as-item-inflexible-in-column-1.htm} | 0 ...-table-as-item-inflexible-in-column-2.htm} | 0 ...=> -table-as-item-inflexible-in-row-1.htm} | 0 ...=> -table-as-item-inflexible-in-row-2.htm} | 0 ...tm => -table-as-item-narrow-content-2.htm} | 0 ...-table-as-item-percent-width-cell-001.htm} | 0 ...tm => -table-as-item-specified-height.htm} | 0 ...htm => -table-as-item-specified-width.htm} | 0 ...> -table-as-item-stretch-cross-size-2.htm} | 0 ... => -table-as-item-stretch-cross-size.htm} | 0 ...-align-baseline.htm => align-baseline.htm} | 0 test/render/flex/align-baseline.htm.png | Bin 0 -> 675 bytes ...ontent.htm => css-box-justify-content.htm} | 0 .../flex/css-box-justify-content.htm.png | Bin 0 -> 1212 bytes ...-flex-basis-011.htm => flex-basis-011.htm} | 0 test/render/flex/flex-basis-011.htm.png | Bin 0 -> 789 bytes ...rgin.htm => flex-flexitem-childmargin.htm} | 0 .../flex/flex-flexitem-childmargin.htm.png | Bin 0 -> 851 bytes ...exbox-flex-basis-content-nocanvas-001a.htm | 83 +++++++ ...x-flex-basis-content-nocanvas-001a.htm.png | Bin 0 -> 530 bytes ...exbox-flex-basis-content-nocanvas-001b.htm | 86 ++++++++ ...x-flex-basis-content-nocanvas-001b.htm.png | Bin 0 -> 537 bytes ...m => flexbox_order-noninteger-invalid.htm} | 0 44 files changed, 246 insertions(+), 225 deletions(-) rename test/render/flex/{--flex-inline.htm => -flex-inline.htm} (100%) rename test/render/flex/{--flexbox-align-self-horiz-001-table.htm => -flexbox-align-self-horiz-001-table.htm} (100%) rename test/render/flex/{--flexbox-collapsed-item-baseline-001.htm => -flexbox-collapsed-item-baseline-001.htm} (100%) rename test/render/flex/{--flexbox-collapsed-item-horiz-001.htm => -flexbox-collapsed-item-horiz-001.htm} (100%) rename test/render/flex/{--flexbox-collapsed-item-horiz-002.htm => -flexbox-collapsed-item-horiz-002.htm} (100%) rename test/render/flex/{--flexbox-collapsed-item-horiz-003.htm => -flexbox-collapsed-item-horiz-003.htm} (100%) rename test/render/flex/{--flexbox-flex-basis-content-001a.htm => -flexbox-flex-basis-content-001a.htm} (100%) rename test/render/flex/{--flexbox-flex-basis-content-001b.htm => -flexbox-flex-basis-content-001b.htm} (100%) rename test/render/flex/{--flexbox_block.htm => -flexbox_block.htm} (100%) rename test/render/flex/{--flexbox_rowspan-overflow-automatic.htm => -flexbox_rowspan-overflow-automatic.htm} (100%) rename test/render/flex/{--flexbox_rowspan-overflow.htm => -flexbox_rowspan-overflow.htm} (100%) rename test/render/flex/{--flexbox_rowspan.htm => -flexbox_rowspan.htm} (100%) rename test/render/flex/{--flexbox_stf-table-singleline.htm => -flexbox_stf-table-singleline.htm} (100%) rename test/render/flex/{negative-flex-margins-crash.htm => -negative-flex-margins-crash.htm} (100%) rename test/render/flex/{--table-as-item-fixed-min-width-3.htm => -table-as-item-fixed-min-width-3.htm} (100%) rename test/render/flex/{--table-as-item-flex-cross-size.htm => -table-as-item-flex-cross-size.htm} (100%) rename test/render/flex/{--table-as-item-inflexible-in-column-1.htm => -table-as-item-inflexible-in-column-1.htm} (100%) rename test/render/flex/{--table-as-item-inflexible-in-column-2.htm => -table-as-item-inflexible-in-column-2.htm} (100%) rename test/render/flex/{--table-as-item-inflexible-in-row-1.htm => -table-as-item-inflexible-in-row-1.htm} (100%) rename test/render/flex/{--table-as-item-inflexible-in-row-2.htm => -table-as-item-inflexible-in-row-2.htm} (100%) rename test/render/flex/{--table-as-item-narrow-content-2.htm => -table-as-item-narrow-content-2.htm} (100%) rename test/render/flex/{table-as-item-percent-width-cell-001.htm => -table-as-item-percent-width-cell-001.htm} (100%) rename test/render/flex/{--table-as-item-specified-height.htm => -table-as-item-specified-height.htm} (100%) rename test/render/flex/{--table-as-item-specified-width.htm => -table-as-item-specified-width.htm} (100%) rename test/render/flex/{--table-as-item-stretch-cross-size-2.htm => -table-as-item-stretch-cross-size-2.htm} (100%) rename test/render/flex/{--table-as-item-stretch-cross-size.htm => -table-as-item-stretch-cross-size.htm} (100%) rename test/render/flex/{--align-baseline.htm => align-baseline.htm} (100%) create mode 100644 test/render/flex/align-baseline.htm.png rename test/render/flex/{--css-box-justify-content.htm => css-box-justify-content.htm} (100%) create mode 100644 test/render/flex/css-box-justify-content.htm.png rename test/render/flex/{--flex-basis-011.htm => flex-basis-011.htm} (100%) create mode 100644 test/render/flex/flex-basis-011.htm.png rename test/render/flex/{--flex-flexitem-childmargin.htm => flex-flexitem-childmargin.htm} (100%) create mode 100644 test/render/flex/flex-flexitem-childmargin.htm.png create mode 100644 test/render/flex/flexbox-flex-basis-content-nocanvas-001a.htm create mode 100644 test/render/flex/flexbox-flex-basis-content-nocanvas-001a.htm.png create mode 100644 test/render/flex/flexbox-flex-basis-content-nocanvas-001b.htm create mode 100644 test/render/flex/flexbox-flex-basis-content-nocanvas-001b.htm.png rename test/render/flex/{--flexbox_order-noninteger-invalid.htm => flexbox_order-noninteger-invalid.htm} (100%) diff --git a/include/litehtml/render_item.h b/include/litehtml/render_item.h index bfe08d119..ac8a9f4c6 100644 --- a/include/litehtml/render_item.h +++ b/include/litehtml/render_item.h @@ -301,6 +301,7 @@ namespace litehtml m_element->in_normal_flow() && m_element->css().get_float() == float_none && m_margins.top >= 0 && + !is_flex_item() && !is_root(); } @@ -319,6 +320,16 @@ namespace litehtml return !(m_skip || src_el()->css().get_display() == display_none || src_el()->css().get_visibility() != visibility_visible); } + bool is_flex_item() const + { + auto par = parent(); + if(par && (par->css().get_display() == display_inline_flex || par->css().get_display() == display_flex)) + { + return true; + } + return false; + } + int render(int x, int y, const containing_block_context& containing_block_size, formatting_context* fmt_ctx, bool second_pass = false); void apply_relative_shift(const containing_block_context &containing_block_size); void calc_outlines( int parent_width ); diff --git a/src/flex_item.cpp b/src/flex_item.cpp index 90ecfbd54..d0fbaecd7 100644 --- a/src/flex_item.cpp +++ b/src/flex_item.cpp @@ -121,11 +121,13 @@ void litehtml::flex_item_row_direction::direction_specific_init(const litehtml:: { auto_margin_cross_end = true; } + def_value content_size(0); if (el->css().get_min_width().is_predefined()) { min_size = el->render(0, 0, self_size.new_width(el->content_offset_width(), containing_block_context::size_mode_content), fmt_ctx); + content_size = min_size; } else { min_size = el->css().get_min_width().calc_percent(self_size.render_width) + @@ -160,12 +162,27 @@ void litehtml::flex_item_row_direction::direction_specific_init(const litehtml:: el->content_offset_width(); break; } - case flex_basis_max_content: + // if width is not predefined, use content size as base size case flex_basis_fit_content: - base_size = el->render(0, 0, self_size, fmt_ctx); + case flex_basis_content: + base_size = el->render(0, 0, self_size.new_width(self_size.render_width + el->content_offset_width(), + containing_block_context::size_mode_content | + containing_block_context::size_mode_exact_width), + fmt_ctx); break; case flex_basis_min_content: - base_size = min_size; + if(content_size.is_default()) + { + content_size = el->render(0, 0, + self_size.new_width(el->content_offset_width(), + containing_block_context::size_mode_content), + fmt_ctx); + } + base_size = content_size; + break; + case flex_basis_max_content: + el->render(0, 0, self_size, fmt_ctx); + base_size = el->width(); break; default: base_size = 0; @@ -340,8 +357,20 @@ void litehtml::flex_item_column_direction::direction_specific_init(const litehtm } } else { - base_size = el->css().get_flex_basis().calc_percent(self_size.height) + - el->content_offset_height(); + if(el->css().get_flex_basis().units() == css_units_percentage) + { + if(self_size.height.type == containing_block_context::cbc_value_type_absolute) + { + base_size = el->css().get_flex_basis().calc_percent(self_size.height) + + el->content_offset_height(); + } else + { + base_size = 0; + } + } else + { + base_size = (int) el->css().get_flex_basis().val() + el->content_offset_height(); + } base_size = std::max(base_size, min_size); } } @@ -429,10 +458,22 @@ void litehtml::flex_item_column_direction::align_baseline(litehtml::flex_line &l // The fallback alignment for first baseline is start, the one for last baseline is end. if(align & flex_align_items_last) { - set_cross_position(ln.cross_start + ln.cross_size - get_el_cross_size()); + if(ln.reverse_cross) + { + set_cross_position(ln.cross_start); + } else + { + set_cross_position(ln.cross_start + ln.cross_size - get_el_cross_size()); + } } else { - set_cross_position(ln.cross_start); + if(!ln.reverse_cross) + { + set_cross_position(ln.cross_start); + } else + { + set_cross_position(ln.cross_start + ln.cross_size - get_el_cross_size()); + } } } diff --git a/src/render_block.cpp b/src/render_block.cpp index 13f815e59..c170c341f 100644 --- a/src/render_block.cpp +++ b/src/render_block.cpp @@ -226,6 +226,16 @@ int litehtml::render_item_block::_render(int x, int y, const containing_block_co } } + // Fix width with max-width attribute + if(self_size.max_width.type != containing_block_context::cbc_value_type_none) + { + if(m_pos.width > self_size.max_width) + { + m_pos.width = self_size.max_width; + requires_rerender = true; + } + } + // Fix width with min-width attribute if(self_size.min_width.type != containing_block_context::cbc_value_type_none) { @@ -239,16 +249,6 @@ int litehtml::render_item_block::_render(int x, int y, const containing_block_co m_pos.width = 0; } - // Fix width with max-width attribute - if(self_size.max_width.type != containing_block_context::cbc_value_type_none) - { - if(m_pos.width > self_size.max_width) - { - m_pos.width = self_size.max_width; - requires_rerender = true; - } - } - // re-render content with new width if required if (requires_rerender && !second_pass && !is_root()) { diff --git a/src/render_flex.cpp b/src/render_flex.cpp index 0948f6a34..d0170e650 100644 --- a/src/render_flex.cpp +++ b/src/render_flex.cpp @@ -1,213 +1,6 @@ #include "html.h" #include "types.h" #include "render_flex.h" -#include - -namespace litehtml -{ - class flex_justify_content_spread - { - flex_justify_content m_type; - int m_num_items; - int m_free_space; - bool m_row_direction; - bool m_reverse; - public: - flex_justify_content_spread(flex_justify_content type, int num_items, int free_space, bool row_direction, bool reverse) : - m_type(type), m_num_items(num_items), m_free_space(0), m_row_direction(row_direction), m_reverse(reverse) - { - set_free_space(free_space); - } - - void set_free_space(int free_space) - { - m_free_space = free_space; - switch (m_type) - { - - case flex_justify_content_space_between: - // If the leftover free-space is negative or there is only a single flex item on the line, this - // value is identical to flex-start. - if(m_num_items == 1 || m_free_space < 0) m_type = flex_justify_content_flex_start; - break; - case flex_justify_content_space_around: - case flex_justify_content_space_evenly: - // If the leftover free-space is negative or there is only a single flex item on the line, this - // value is identical to center - if(m_num_items == 1 || m_free_space < 0) m_type = flex_justify_content_center; - break; - case flex_justify_content_right: - case flex_justify_content_left: - if(!m_row_direction) - { - m_type = flex_justify_content_start; - } - break; - default: - break; - } - } - - int start() - { - switch (m_type) - { - case flex_justify_content_right: - if(!m_reverse) - { - return m_free_space; - } - return 0; - case flex_justify_content_start: - case flex_justify_content_left: - if(m_reverse) - { - return m_free_space; - } - return 0; - case flex_justify_content_flex_end: - case flex_justify_content_end: - return m_free_space; - case flex_justify_content_center: - return m_free_space / 2; - case flex_justify_content_space_between: - case flex_justify_content_space_around: - default: - // using flex-start by default - return 0; - } - } - - int before_item() - { - switch (m_type) - { - case flex_justify_content_space_evenly: - return m_free_space / (m_num_items + 1); - case flex_justify_content_space_between: - return 0; - case flex_justify_content_space_around: - return m_free_space / (m_num_items * 2); - default: - return 0; - } - } - - int after_item() - { - switch (m_type) - { - case flex_justify_content_space_between: - return m_free_space / (m_num_items - 1); - case flex_justify_content_space_around: - return m_free_space / (m_num_items * 2); - default: - return 0; - } - } - }; - - class flex_align_content_spread - { - flex_align_content m_type; - int m_num_lines; - int m_free_space; - flex_wrap m_wrap; - public: - flex_align_content_spread(flex_align_content type, flex_wrap wrap, int num_lines, int free_space) : - m_type(type), m_num_lines(num_lines), m_free_space(0), m_wrap(wrap) - { - if(m_wrap == flex_wrap_nowrap) - { - m_type = flex_align_content_stretch; - } - set_free_space(free_space); - } - - void set_free_space(int free_space) - { - m_free_space = free_space; - switch (m_type) - { - - case flex_align_content_space_between: - // If the leftover free-space is negative or there is only a single flex line in the flex - // container, this value is identical to flex-start. - if(m_num_lines == 1 || m_free_space < 0) m_type = flex_align_content_flex_start; - break; - case flex_align_content_space_around: - // If the leftover free-space is negative this value is identical to center. - if(m_num_lines == 1 || m_free_space < 0) m_type = flex_align_content_center; - break; - default: - break; - } - } - - int start() - { - switch (m_type) - { - case flex_align_content_flex_end: - case flex_align_content_end: - return m_free_space; - case flex_align_content_center: - return m_free_space / 2; - case flex_align_content_stretch: - case flex_align_content_space_between: - case flex_align_content_space_around: - default: - // using stretch by default - return 0; - } - } - - int add_line_size() - { - switch (m_type) - { - - case flex_align_content_flex_start: - case flex_align_content_flex_end: - case flex_align_content_start: - case flex_align_content_end: - case flex_align_content_center: - case flex_align_content_space_between: - case flex_align_content_space_around: - return 0; - case flex_align_content_stretch: - default: - return m_free_space / m_num_lines; - } - } - - int before_line() - { - switch (m_type) - { - case flex_align_content_space_between: - return 0; - case flex_align_content_space_around: - return m_free_space / (m_num_lines * 2); - default: - return 0; - } - } - - int after_line() - { - switch (m_type) - { - case flex_align_content_space_between: - return m_free_space / (m_num_lines - 1); - case flex_align_content_space_around: - return m_free_space / (m_num_lines * 2); - default: - return 0; - } - } - }; -} int litehtml::render_item_flex::_render_content(int x, int y, bool second_pass, const containing_block_context &self_size, formatting_context* fmt_ctx) { diff --git a/src/style.cpp b/src/style.cpp index 84a5bb0af..e89be9999 100644 --- a/src/style.cpp +++ b/src/style.cpp @@ -540,7 +540,14 @@ void style::add_property(string_id name, const string& val, const string& baseur break; case _order_: // - add_parsed_property(name, property_value(atoi(val.c_str()), important)); + { + char* end; + int int_val = (int) strtol(val.c_str(), &end, 10); + if(end[0] == '\0') + { + add_parsed_property(name, property_value(int_val, important)); + } + } break; default: diff --git a/test/render/flex/--flex-inline.htm b/test/render/flex/-flex-inline.htm similarity index 100% rename from test/render/flex/--flex-inline.htm rename to test/render/flex/-flex-inline.htm diff --git a/test/render/flex/--flexbox-align-self-horiz-001-table.htm b/test/render/flex/-flexbox-align-self-horiz-001-table.htm similarity index 100% rename from test/render/flex/--flexbox-align-self-horiz-001-table.htm rename to test/render/flex/-flexbox-align-self-horiz-001-table.htm diff --git a/test/render/flex/--flexbox-collapsed-item-baseline-001.htm b/test/render/flex/-flexbox-collapsed-item-baseline-001.htm similarity index 100% rename from test/render/flex/--flexbox-collapsed-item-baseline-001.htm rename to test/render/flex/-flexbox-collapsed-item-baseline-001.htm diff --git a/test/render/flex/--flexbox-collapsed-item-horiz-001.htm b/test/render/flex/-flexbox-collapsed-item-horiz-001.htm similarity index 100% rename from test/render/flex/--flexbox-collapsed-item-horiz-001.htm rename to test/render/flex/-flexbox-collapsed-item-horiz-001.htm diff --git a/test/render/flex/--flexbox-collapsed-item-horiz-002.htm b/test/render/flex/-flexbox-collapsed-item-horiz-002.htm similarity index 100% rename from test/render/flex/--flexbox-collapsed-item-horiz-002.htm rename to test/render/flex/-flexbox-collapsed-item-horiz-002.htm diff --git a/test/render/flex/--flexbox-collapsed-item-horiz-003.htm b/test/render/flex/-flexbox-collapsed-item-horiz-003.htm similarity index 100% rename from test/render/flex/--flexbox-collapsed-item-horiz-003.htm rename to test/render/flex/-flexbox-collapsed-item-horiz-003.htm diff --git a/test/render/flex/--flexbox-flex-basis-content-001a.htm b/test/render/flex/-flexbox-flex-basis-content-001a.htm similarity index 100% rename from test/render/flex/--flexbox-flex-basis-content-001a.htm rename to test/render/flex/-flexbox-flex-basis-content-001a.htm diff --git a/test/render/flex/--flexbox-flex-basis-content-001b.htm b/test/render/flex/-flexbox-flex-basis-content-001b.htm similarity index 100% rename from test/render/flex/--flexbox-flex-basis-content-001b.htm rename to test/render/flex/-flexbox-flex-basis-content-001b.htm diff --git a/test/render/flex/--flexbox_block.htm b/test/render/flex/-flexbox_block.htm similarity index 100% rename from test/render/flex/--flexbox_block.htm rename to test/render/flex/-flexbox_block.htm diff --git a/test/render/flex/--flexbox_rowspan-overflow-automatic.htm b/test/render/flex/-flexbox_rowspan-overflow-automatic.htm similarity index 100% rename from test/render/flex/--flexbox_rowspan-overflow-automatic.htm rename to test/render/flex/-flexbox_rowspan-overflow-automatic.htm diff --git a/test/render/flex/--flexbox_rowspan-overflow.htm b/test/render/flex/-flexbox_rowspan-overflow.htm similarity index 100% rename from test/render/flex/--flexbox_rowspan-overflow.htm rename to test/render/flex/-flexbox_rowspan-overflow.htm diff --git a/test/render/flex/--flexbox_rowspan.htm b/test/render/flex/-flexbox_rowspan.htm similarity index 100% rename from test/render/flex/--flexbox_rowspan.htm rename to test/render/flex/-flexbox_rowspan.htm diff --git a/test/render/flex/--flexbox_stf-table-singleline.htm b/test/render/flex/-flexbox_stf-table-singleline.htm similarity index 100% rename from test/render/flex/--flexbox_stf-table-singleline.htm rename to test/render/flex/-flexbox_stf-table-singleline.htm diff --git a/test/render/flex/negative-flex-margins-crash.htm b/test/render/flex/-negative-flex-margins-crash.htm similarity index 100% rename from test/render/flex/negative-flex-margins-crash.htm rename to test/render/flex/-negative-flex-margins-crash.htm diff --git a/test/render/flex/--table-as-item-fixed-min-width-3.htm b/test/render/flex/-table-as-item-fixed-min-width-3.htm similarity index 100% rename from test/render/flex/--table-as-item-fixed-min-width-3.htm rename to test/render/flex/-table-as-item-fixed-min-width-3.htm diff --git a/test/render/flex/--table-as-item-flex-cross-size.htm b/test/render/flex/-table-as-item-flex-cross-size.htm similarity index 100% rename from test/render/flex/--table-as-item-flex-cross-size.htm rename to test/render/flex/-table-as-item-flex-cross-size.htm diff --git a/test/render/flex/--table-as-item-inflexible-in-column-1.htm b/test/render/flex/-table-as-item-inflexible-in-column-1.htm similarity index 100% rename from test/render/flex/--table-as-item-inflexible-in-column-1.htm rename to test/render/flex/-table-as-item-inflexible-in-column-1.htm diff --git a/test/render/flex/--table-as-item-inflexible-in-column-2.htm b/test/render/flex/-table-as-item-inflexible-in-column-2.htm similarity index 100% rename from test/render/flex/--table-as-item-inflexible-in-column-2.htm rename to test/render/flex/-table-as-item-inflexible-in-column-2.htm diff --git a/test/render/flex/--table-as-item-inflexible-in-row-1.htm b/test/render/flex/-table-as-item-inflexible-in-row-1.htm similarity index 100% rename from test/render/flex/--table-as-item-inflexible-in-row-1.htm rename to test/render/flex/-table-as-item-inflexible-in-row-1.htm diff --git a/test/render/flex/--table-as-item-inflexible-in-row-2.htm b/test/render/flex/-table-as-item-inflexible-in-row-2.htm similarity index 100% rename from test/render/flex/--table-as-item-inflexible-in-row-2.htm rename to test/render/flex/-table-as-item-inflexible-in-row-2.htm diff --git a/test/render/flex/--table-as-item-narrow-content-2.htm b/test/render/flex/-table-as-item-narrow-content-2.htm similarity index 100% rename from test/render/flex/--table-as-item-narrow-content-2.htm rename to test/render/flex/-table-as-item-narrow-content-2.htm diff --git a/test/render/flex/table-as-item-percent-width-cell-001.htm b/test/render/flex/-table-as-item-percent-width-cell-001.htm similarity index 100% rename from test/render/flex/table-as-item-percent-width-cell-001.htm rename to test/render/flex/-table-as-item-percent-width-cell-001.htm diff --git a/test/render/flex/--table-as-item-specified-height.htm b/test/render/flex/-table-as-item-specified-height.htm similarity index 100% rename from test/render/flex/--table-as-item-specified-height.htm rename to test/render/flex/-table-as-item-specified-height.htm diff --git a/test/render/flex/--table-as-item-specified-width.htm b/test/render/flex/-table-as-item-specified-width.htm similarity index 100% rename from test/render/flex/--table-as-item-specified-width.htm rename to test/render/flex/-table-as-item-specified-width.htm diff --git a/test/render/flex/--table-as-item-stretch-cross-size-2.htm b/test/render/flex/-table-as-item-stretch-cross-size-2.htm similarity index 100% rename from test/render/flex/--table-as-item-stretch-cross-size-2.htm rename to test/render/flex/-table-as-item-stretch-cross-size-2.htm diff --git a/test/render/flex/--table-as-item-stretch-cross-size.htm b/test/render/flex/-table-as-item-stretch-cross-size.htm similarity index 100% rename from test/render/flex/--table-as-item-stretch-cross-size.htm rename to test/render/flex/-table-as-item-stretch-cross-size.htm diff --git a/test/render/flex/--align-baseline.htm b/test/render/flex/align-baseline.htm similarity index 100% rename from test/render/flex/--align-baseline.htm rename to test/render/flex/align-baseline.htm diff --git a/test/render/flex/align-baseline.htm.png b/test/render/flex/align-baseline.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..360c0ad1798ceee58919d4a8e0e19bfecdfe057c GIT binary patch literal 675 zcmeAS@N?(olHy`uVBq!ia0y~yU{(OKzc2y`25+DGLKZc z=!pp^Y6D{WV{8hI3N zcMhJgP|(>aCRhHn^H)Qal{1#4$E0y(%J4e`3Ap@{t=!M0#N1xJ%Y-1wki{T&1Zo)1nwdr zBS_rP5l1gfVC4bh0 z?)3Pl^r+wA6+co?z+AB3+DbHIYpQwv^PgKzWbGIFB=g*T*SEao(}EYwy)|K17+dDM zvJ5UGlO&Ih)o+t4SJ<_wh)({}bJ|C-_c5afSChwn<@e!^DG%Pv+IjR0=^=8S85A!t z$3Pe-_BTl^D%3PiH8QtLxu^Ga;-9XR$d-8=SKa4)va$}Ex3Aw%^V3Z6_pg-Pvgev+ z`sQBy<>vjY)!*qvsq-9`N99kP(ws{i^`=ftbw8t>)aO_f>XP~X(X?1KtG{k~pB}}= sKAFD1D)L8iS{eF%hpyk_>bp(4UG?jhYrO;7 zg#v#3T9Nfyc1o|>i*BAN(`3VZoRX)m+wnic!t}Q2mbWS4t2Q~Uh*fX#{kAkbGVJ8u z9c4E|Yp#Dvvy$}}s!RHFXRoo}>J8oYE**aCy&*qL*GyQ-^HaE`V0Ts9ggZ~N#ZPg4 zbnI}tc4p&;KigYVmdCAF>M!o(+P$iCwf?%Ei{<6=T(?%}#%#3jo%(l2zMn_dT#NSm z?sM`p^GxrAul(&&zu!+pt!{H}@#D}t-bX(lwQLa(J+(pV)JJ9GmS(m4M+6*n?Tp|p+X`3o(@lY4oVs;eH!f9}ooaCIvIbhl&H`j-=0Nzy4^OM99ZlBlGXU3snkZpZ|9G z-}PPSxtQwd^WwKx@8Fl`w>Ps1|7SV;1O7$$$}E? z3=9v>r_NuUzjSqXzRMSQ-u#5E_OOp zz%euNOzD2}wES=D!+-TVz53OtFn?77=Qb{`|Vc=vj(i`tMdfeHEVnr)O;2JLC4#YqPo+N^@+~@@NrG5^`F@_4*L! z!fdUUkO*;=Bc3z4Hfo({7EelZ@^HhJ|e$ieI*?9GM~A;-a`dynfn~mVkp& zLMduTMAx+PSpI+1Y^$mAgq`neIaep=CquVMDn$!ivYL3r+-fi!$kdp4vV(52b_3oJ*8#$SZmdtH^TrCbK z{&QUf2Id@rwWYc1*Gw?5QCHzc|eLYz$e7@|Ns9$CIiF&;9$24 z3=B-iJzX3_Dj45R@t*Wpfu}8Tq4a~lGDqDNLJQ{KJHxx{d*t&ei`gyeROb48Kcw~Q ze@v@zbV99L7}yLDVYT&?$0u$7suqFg5l^D*T!O9h-ygY|RJ@?F*#2$0`(FRz{>7e0_$E{{CI@4n}-U*7#@*R(q0x4pNn zZ@w$|*M{G^C||~``@P4TK$RPDE!&hIp6qK`+cD?m1&=z#MVk9Hojxl~lIvPx?s6$C zyPq+eU8|bT?*>n(|TuiiSY6;rHv6T@1rh7?r^BsXEU#ww|w$byYrI*la@pm zI<;;wpLi^D`sLEptM{0nZs#~L%a(o8-s|g*>N_SYf8Ra#MCOvs!VM>;IbUal#&Lm> z`O~U0sr}ELkK3m&XPnr&zx9WN!;{HE@&X^3UG{toRkvdkkW6z|c+{KdVpr1AA+PX= zx1)kt>0U#JITq#)&Fh;lH=H9%La61fzp45>30QRFkTci207Z()z4*}Q$iB}E*)`F literal 0 HcmV?d00001 diff --git a/test/render/flex/--flex-flexitem-childmargin.htm b/test/render/flex/flex-flexitem-childmargin.htm similarity index 100% rename from test/render/flex/--flex-flexitem-childmargin.htm rename to test/render/flex/flex-flexitem-childmargin.htm diff --git a/test/render/flex/flex-flexitem-childmargin.htm.png b/test/render/flex/flex-flexitem-childmargin.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a356877ca0c5b2f917540d8b7f7686baaf743d8a GIT binary patch literal 851 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYV6}}?<0jlGj&!TAPl+<#Bqf<~w zS;ftxXM)7206F1tuGOcyH28J`Pn+WeZxJ@Vrf*OCS8l)e_piz93^%rf?5`*0*Rga8 zs<=&%a7>~d<6o1_w!Obzy-&y$eiGJnq(?!w>Bt<8PjdvH6d4!SD4x%ETxa(B_46N2 zEIaRXDkLkK3xHfy?{VhLnr272+i`zylyBI^S)@%%H`31cNG4kfvM?|_kpIi%y)bLn TgAl!ZP?qp?^>bP0l+XkKPiqEE literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-flex-basis-content-nocanvas-001a.htm b/test/render/flex/flexbox-flex-basis-content-nocanvas-001a.htm new file mode 100644 index 000000000..e66abb4ed --- /dev/null +++ b/test/render/flex/flexbox-flex-basis-content-nocanvas-001a.htm @@ -0,0 +1,83 @@ + + + + + + CSS Test: Testing "flex-basis: content" in a row-oriented flex container + + + + + + + + + + +
+
a b
+
c
+
+
+
+ + +
+
a b
+
c
+
+
+
+ + +
+
a b
+
c
+
+
+
+ + + + + + \ No newline at end of file diff --git a/test/render/flex/flexbox-flex-basis-content-nocanvas-001a.htm.png b/test/render/flex/flexbox-flex-basis-content-nocanvas-001a.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..a5f351d663aedaa4a4d86b9f34903100d97ffa01 GIT binary patch literal 530 zcmeAS@N?(olHy`uVBq!ia0vp^4;UC2#aNhutls@?NkB>{z$e7@|Ns9D3_#ehR7;ED z|9_zHqCMtTK&87qT^vIy7~fvL*m>B1ry)`J1H;_|OQg4GmoV(D_#djbj=!eBV{dyz zQT6}-0$f=?CUgo5uDy74rNf1n3d#p-m;AXsC$Bc*O?dJ_!>bP2yJFwFoAcIexyJCc z`C!cL{wP`VDbL#;ZC_}tvEF>muSS2y%}aFBBbgsSp(<%!guUY5R)bBL zL9jr7hyCRP_oAEYxdp(WpmxLegAX_vnV6y$1Q#j@g2CV4`xtm!Udu*1ew+Y|O$JX_ KKbLh*2~7av^4wei literal 0 HcmV?d00001 diff --git a/test/render/flex/flexbox-flex-basis-content-nocanvas-001b.htm b/test/render/flex/flexbox-flex-basis-content-nocanvas-001b.htm new file mode 100644 index 000000000..8b4992931 --- /dev/null +++ b/test/render/flex/flexbox-flex-basis-content-nocanvas-001b.htm @@ -0,0 +1,86 @@ + + + + + + CSS Test: Testing "flex-basis: content" (set via the "flex" shorthand) + in a row-oriented flex container. + + + + + + + + + + +
+
a b
+
c
+
+
+ +
+ + +
+
a b
+
c
+
+
+ +
+ + +
+
a b
+
c
+
+
+ +
+ + + + + + diff --git a/test/render/flex/flexbox-flex-basis-content-nocanvas-001b.htm.png b/test/render/flex/flexbox-flex-basis-content-nocanvas-001b.htm.png new file mode 100644 index 0000000000000000000000000000000000000000..e9be0e8522fc1d4d0b34d008dd3e3ba4d133b9cc GIT binary patch literal 537 zcmeAS@N?(olHy`uVBq!ia0vp^4;UC2#aNhutls@?NkB>{z$e7@|Ns9D3_#ehR7;ED z|9_zHqCMtTK&6K~T^vIy7~fvK*!kE%puJGIfbr#l86^|=oVaF8f4P6^=10u2I;Yn> z{38GG?>=_nEzNZvoi`ghe!bAs5)g?^QL%WwEqQxs<*jw|<@nh?%Xi5x`}614!J9U%0oJSYP&M7D{*W6LF_udPy@AW3@>ON{Gq{?gvzOXdm zscjBB-z#la76f=Bc1F~C&1q}vIWqmMs;*6o9yut1!J;d%AqpD1PIwfY%RQd=`qP$J zds{i4XZ9l2K0kkMJ!~A>XMfLoeVpTN1Bs`THpRz$uG_W#_Fd`tvcas+9fT*|trq8x}9;e|JcD+2xz( zBxlbJ;JI~>)4hCh(`oV7z3WQ;yFY##*S&Yu1N-yx4fg-@8E>$aXhu}>-)?OF<;58K zAj)u`UOc0XyaE^`9DnfV<)H`vxdjA1aEOSq3kib2#r5y`f4XwKnGrUv6&R@up00i_ I>zopr0LfeB?EnA( literal 0 HcmV?d00001 diff --git a/test/render/flex/--flexbox_order-noninteger-invalid.htm b/test/render/flex/flexbox_order-noninteger-invalid.htm similarity index 100% rename from test/render/flex/--flexbox_order-noninteger-invalid.htm rename to test/render/flex/flexbox_order-noninteger-invalid.htm