Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-07-23 15:23:42 +01:00
Code Issues Projects Releases Packages Wiki Activity

Fix img with display: block. Fixes text/image overflow on wikipedia.

Browse source 
Ref: #2554
This commit is contained in:
Glenn Watson 2014-09-19 11:05:54 +10:00
parent a3b20d8179
commit 818f70e319
4 changed files with 51 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

4
components/layout/block.rs
View file

@ -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);

1
tests/ref/basic.list
View file

@ -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
View 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
View 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>