mirror of
https://github.com/servo/servo.git
synced 2025-08-03 04:30:10 +01:00
Fix clearance on replaced elements
This commit is contained in:
parent
cc4650aeb3
commit
246dc983f6
3 changed files with 69 additions and 3 deletions
|
@ -733,10 +733,13 @@ fn layout_in_flow_replaced_block_level<'a>(
|
||||||
|
|
||||||
let mut clearance = Length::zero();
|
let mut clearance = Length::zero();
|
||||||
if let Some(ref mut sequential_layout_state) = sequential_layout_state {
|
if let Some(ref mut sequential_layout_state) = sequential_layout_state {
|
||||||
|
sequential_layout_state.adjoin_assign(&CollapsedMargin::new(margin.block_start));
|
||||||
sequential_layout_state.collapse_margins();
|
sequential_layout_state.collapse_margins();
|
||||||
clearance = sequential_layout_state.calculate_clearance(ClearSide::from_style(style));
|
clearance = sequential_layout_state.calculate_clearance(ClearSide::from_style(style));
|
||||||
sequential_layout_state
|
sequential_layout_state.advance_block_position(
|
||||||
.advance_block_position(pbm.border.block_sum() + pbm.padding.block_sum() + size.block);
|
pbm.border.block_sum() + pbm.padding.block_sum() + size.block + clearance,
|
||||||
|
);
|
||||||
|
sequential_layout_state.adjoin_assign(&CollapsedMargin::new(margin.block_end));
|
||||||
};
|
};
|
||||||
|
|
||||||
let content_rect = Rect {
|
let content_rect = Rect {
|
||||||
|
@ -756,7 +759,7 @@ fn layout_in_flow_replaced_block_level<'a>(
|
||||||
pbm.padding,
|
pbm.padding,
|
||||||
pbm.border,
|
pbm.border,
|
||||||
margin,
|
margin,
|
||||||
Length::zero(),
|
clearance,
|
||||||
block_margins_collapsed_with_children,
|
block_margins_collapsed_with_children,
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -61742,6 +61742,35 @@
|
||||||
{}
|
{}
|
||||||
]
|
]
|
||||||
],
|
],
|
||||||
|
"clear-on-replaced-element.html": [
|
||||||
|
"e5566b38326da17455d54c3d06d498f72bc4c693",
|
||||||
|
[
|
||||||
|
null,
|
||||||
|
[
|
||||||
|
[
|
||||||
|
"/css/CSS2/reference/ref-filled-green-100px-square.xht",
|
||||||
|
"=="
|
||||||
|
]
|
||||||
|
],
|
||||||
|
{
|
||||||
|
"fuzzy": [
|
||||||
|
[
|
||||||
|
null,
|
||||||
|
[
|
||||||
|
[
|
||||||
|
0,
|
||||||
|
2
|
||||||
|
],
|
||||||
|
[
|
||||||
|
0,
|
||||||
|
1500
|
||||||
|
]
|
||||||
|
]
|
||||||
|
]
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
],
|
||||||
"clear-with-top-margin-after-cleared-empty-block.html": [
|
"clear-with-top-margin-after-cleared-empty-block.html": [
|
||||||
"5d0fba7981f3f688b22442c1e8bef2ff8b146f5e",
|
"5d0fba7981f3f688b22442c1e8bef2ff8b146f5e",
|
||||||
[
|
[
|
||||||
|
|
|
@ -0,0 +1,34 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Clear on block-level replaced element</title>
|
||||||
|
<link rel="author" title="Oriol Brufau" href="obrufau@igalia.com">
|
||||||
|
<link rel="help" href="https://www.w3.org/TR/CSS22/visuren.html#flow-control" title="9.5.2 Controlling flow next to floats: the 'clear' property">
|
||||||
|
<link rel="help" href="https://www.w3.org/TR/CSS22/conform.html#replaced-element">
|
||||||
|
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
|
||||||
|
<meta name="fuzzy" content="maxDifference=0-2;totalPixels=0-1500">
|
||||||
|
<style>
|
||||||
|
#wrapper {
|
||||||
|
width: 90px;
|
||||||
|
border: 5px solid green;
|
||||||
|
background-image: linear-gradient(
|
||||||
|
to bottom,
|
||||||
|
red 30px, green 30px,
|
||||||
|
green 50px, red 50px,
|
||||||
|
red 60px, green 60px,
|
||||||
|
green 70px, red 70px,
|
||||||
|
red 80px, green 80px
|
||||||
|
)
|
||||||
|
}
|
||||||
|
#wrapper > * {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
background: green content-box;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||||
|
<div id="wrapper">
|
||||||
|
<div style="float: left; height: 20px"></div>
|
||||||
|
<canvas style="clear: both; height: 10px; margin: 10px 0"></canvas>
|
||||||
|
<canvas style="float: left; height: 10px; margin: 10px 0"></canvas>
|
||||||
|
<div style="clear: both; height: 10px; padding-bottom: 10px"></div>
|
||||||
|
</div>
|
Loading…
Add table
Add a link
Reference in a new issue