mirror of
https://github.com/servo/servo.git
synced 2025-07-23 07:13:52 +01:00
Fix img with display: block. Fixes text/image overflow on wikipedia.
Ref: #2554
This commit is contained in:
parent
a3b20d8179
commit
818f70e319
4 changed files with 51 additions and 0 deletions
|
@ -1646,8 +1646,12 @@ impl Flow for BlockFlow {
|
|||
|
||||
fn assign_block_size<'a>(&mut self, ctx: &'a LayoutContext<'a>) {
|
||||
if self.is_replaced_content() {
|
||||
let _scope = layout_debug_scope!("assign_replaced_block_size_if_necessary {:s}",
|
||||
self.base.debug_id());
|
||||
|
||||
// Assign block-size for fragment if it is an image fragment.
|
||||
self.fragment.assign_replaced_block_size_if_necessary();
|
||||
self.base.position.size.block = self.fragment.border_box.size.block;
|
||||
} else if self.is_float() {
|
||||
debug!("assign_block_size_float: assigning block_size for float");
|
||||
self.assign_block_size_float(ctx);
|
||||
|
|
|
@ -133,3 +133,4 @@ flaky_gpu,flaky_linux == acid2_noscroll.html acid2_ref_broken.html
|
|||
== percent_height.html percent_height_ref.html
|
||||
== inline_block_with_margin_a.html inline_block_with_margin_ref.html
|
||||
== table_padding_a.html table_padding_ref.html
|
||||
== img_block_display_a.html img_block_display_ref.html
|
||||
|
|
25
tests/ref/img_block_display_a.html
Normal file
25
tests/ref/img_block_display_a.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
@font-face {
|
||||
font-family: 'ahem';
|
||||
src: url(fonts/ahem/ahem.ttf);
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: 'ahem';
|
||||
font-size: 50px;
|
||||
line-height: 1;
|
||||
color: red;
|
||||
}
|
||||
img {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div><img src="100x100_green.png"></div>
|
||||
<div>A</div>
|
||||
</body>
|
||||
</html>
|
21
tests/ref/img_block_display_ref.html
Normal file
21
tests/ref/img_block_display_ref.html
Normal file
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
.ahem {
|
||||
background-color: red;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div><img src="100x100_green.png"></div>
|
||||
<div class="ahem"></div>
|
||||
</body>
|
||||
</html>
|
Loading…
Add table
Add a link
Reference in a new issue