LadybirdBrowser/ladybird
1
1
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2024-09-11 05:25:32 +03:00
Code Issues Packages Projects Releases Wiki Activity

LibWeb: Resolve horizontal auto margins for images with display: block

Browse Source
This commit is contained in:
Andreas Kling 2023-04-29 20:18:01 +02:00
parent f7e034d4b2
commit 5236819f58
Notes: sideshowbarker 2024-07-17 01:28:15 +09:00 
Author: https://github.com/awesomekling
Commit: https://github.com/SerenityOS/serenity/commit/5236819f58
Pull-request: https://github.com/SerenityOS/serenity/pull/18576
Reviewed-by: https://github.com/winfr34k
3 changed files with 20 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
Tests/LibWeb/Layout/expected/image-display-block-margin-auto.txt Normal file
View File

@ -0,0 +1,4 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x116 children: not-inline
BlockContainer <body> at (8,8) content-size 400x100 children: not-inline
ImageBox <img> at (158,8) content-size 100x100 children: not-inline

11
Tests/LibWeb/Layout/input/image-display-block-margin-auto.html Normal file
View File

@ -0,0 +1,11 @@
<!doctype html><style>
body {
width: 400px;
}
img {
margin: 0 auto;
display: block;
width: 100px;
height: 100px;
}
</style><img/>

5
Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp
View File

@ -210,6 +210,11 @@ void BlockFormattingContext::compute_width(Box const& box, AvailableSpace const&
};
auto input_width = [&] {
if (is<ReplacedBox>(box)) {
// NOTE: Replaced elements had their width calculated independently above.
// We use that width as the input here to ensure that margins get resolved.
return CSS::Length::make_px(box_state.content_width());
}
if (is<TableWrapper>(box))
return CSS::Length::make_px(compute_width_for_table_wrapper(box, available_space));
if (should_treat_width_as_auto(box, available_space))