mirrors/ladybird
1
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-04-21 20:15:17 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 10

LibWeb: Implement very basic margin collapsing

Browse source 
We now collapse a block's top margin with the previous sibling's
bottom margin so that the larger margin wins.
This commit is contained in:
Andreas Kling 2020-06-12 17:41:14 +02:00
parent 88673f3f85
commit 21b1f1653d
Notes: sideshowbarker 2024-07-19 05:41:58 +09:00
3 changed files with 25 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
Base/home/anon/www/margin-collapse-1.html Normal file
View file

@ -0,0 +1,16 @@
<style>
#foo {
border: 1px solid red;
margin: 25px;
width: 100px;
height: 100px;
}
#bar {
border: 1px solid green;
margin: 25px;
width: 100px;
height: 100px;
}
</style>
<div id=foo>foo</div>
<div id=bar>bar</div>

1
Base/home/anon/www/welcome.html
View file

@ -28,6 +28,7 @@ span#ua {
<p>Your user agent is: <b><span id="ua"></span></b></p>
<p>Some small test pages:</p>
<ul>
<li><a href="margin-collapse-1.html">margin collapsing 1</a></li>
<li><a href="position-absolute-from-edges.html">position: absolute, offset from edges</a></li>
<li><a href="iframe.html">iframe</a></li>
<li><a href="many-buggies.html">many buggies</a></li>

9
Libraries/LibWeb/Layout/LayoutBlock.cpp
View file

@ -477,7 +477,14 @@ void LayoutBlock::compute_position()
if (relevant_sibling) {
auto& previous_sibling_style = relevant_sibling->box_model();
position_y += relevant_sibling->effective_offset().y() + relevant_sibling->height();
position_y += previous_sibling_style.margin_box(*this).bottom;
// Collapse top margin with bottom margin of previous sibling if necessary
float previous_sibling_margin_bottom = previous_sibling_style.margin().bottom.to_px(*relevant_sibling);
float my_margin_top = box_model().margin().top.to_px(*this);
if (previous_sibling_margin_bottom > my_margin_top) {
// Sibling's margin is larger than mine, adjust so we use sibling's.
position_y += previous_sibling_margin_bottom - my_margin_top;
}
}
set_offset({ position_x, position_y });