Closed
Bug 644789
Opened 14 years ago
Closed 9 years ago
div with CSS page-break-after:always causes following div containing floats to render incorrectly
Categories
(Core :: Layout: Block and Inline, defect)
Tracking
()
RESOLVED
WORKSFORME
People
(Reporter: redscourge, Unassigned)
References
()
Details
(Keywords: css2, regression)
Attachments
(1 file)
|
1.69 KB,
text/html
|
Details |
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:2.0) Gecko/20100101 Firefox/4.0
Build Identifier: 4.0
A php script we used to lay out an organization's member directory stopped correctly rendering the document for printing in Firefox 4.0 in a way that had worked fine from 3.0.0 - 3.6.15.
I found out after eliminating all other possible elements causing the problem that it was the page-break-after:always CSS directive being applied to the div above another one that contains floats. If you put in another div in between the two that has no floats and contains at least SOME content (non-breaking space, any text, etc), the bug also stops happening.
Reproducible: Always
Steps to Reproduce:
1. go to the website address i included in this bug report
2. take a quick look at how the page looks
3. compare vs Print Preview and see that clearly something is not right
Actual Results:
a div containing floats was behaving as if it had NOT been set to 100% width, in that two floats that should have fit side by side, a left and a right in that order in the source code, instead had the second (right floated) div be pushed down after the first (left floated) div.
Expected Results:
it should have rendered both floats on the same line as each other
Incase the URL of my bug report ever goes missing, here is the code to reproduce it:
<html>
<head>
<title>Member Directory</title>
<style>
/*debug line*/
* {border:1px solid black;}
body, table{
font: 11px arial, sans-serif;
}
div.directory_cover_page{
page-break-after:always;
}
div.directory_header{
margin-top:1px;
text-align:center;
clear:both;
color:#006;
width:100%;
font-size:24px;
font-weight:bold;
}
.header_left{
text-align:left;
float:left;
}
.header_right{
text-align:right;
float:right;
}
</style>
</head>
<body>
<div class = "directory_cover_page" >
<h1>2011 Membership Directory</h1>
<br /><br />
<h2>By Company</h2>
<br /><br />
<br /><br />
</div>
<div class = "directory_header" >
<span class = "top_br"><br /></span>
<div class = "header_left" >
Organization Name
</div>
<div class = "header_right" >
Membership Directory<br />
<span class = "sortby" >By Company</span>
<span class = "quarter_line_height"><br /><br /></span>
<div class = "page_letter">A</div>
</div>
</div>
</body>
</html>
|
||
Updated•14 years ago
|
Version: unspecified → Trunk
Regression Range :
works:
Mozilla/5.0 (Windows NT 6.1; rv:2.0b4pre) Gecko/20100805 Minefield/4.0b4pre
broken:
Mozilla/5.0 (Windows NT 6.1; rv:2.0b4pre) Gecko/20100806 Minefield/4.0b4pre
pushlog:
http://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=bbefb7bcb41e&tochange=26ee1b556bd9
Status: UNCONFIRMED → NEW
Ever confirmed: true
|
||
Updated•14 years ago
|
Keywords: regression
|
||
Comment 5•9 years ago
|
||
Hello all,
I read carefully the description and examined attachment 521779 [details] and I get expected results in print preview with Firefox 44.0.2 and Firefox 47.0a1 buildID=20160304163750 under Linux: both floats (the left one "Organization Name" and the right one starting with "Membership Directory") are each rendered on the same line.
WORKSFORME
Can anyone still reproduce the problem?
|
|
||
Comment 6•9 years ago
|
||
No reply.
Resolving as WORKSFORME
If you believe this resolution is incorrect, then please reopen this bug report and give details (like page size in print preview, browser version, etc.) and explanations. Thanks!
You need to log in
before you can comment on or make changes to this bug.
Description
•