Closed
Bug 285721
Opened 20 years ago
Closed 20 years ago
<div> height is poorly formed when not floated
Categories
(Core :: Layout, defect)
Tracking
()
RESOLVED
DUPLICATE
of bug 210703
People
(Reporter: bryce, Unassigned)
References
()
Details
(Keywords: testcase)
Attachments
(3 files, 2 obsolete files)
User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; .NET CLR 1.1.4322) Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8b2) Gecko/20050307 Firefox/1.0+ Look at the bottom of this page, and you will see the white box (div) that is called "content", that did not grow to fit the image. I do not believe the image is floated so it is part of the normal flow and should be accommodated. When the div is floated, it magically fixes itself. Please see this page for the fixed version: http://www.sitesforart.com/gallery.asp? PageID=1411&UserID=253&css=http://www.designapproach.com/sitesforart/top_navigat ion_tan4.css Please note that setting a proper height for the 'imagebox' class works, but since the images are variable height this destroys the style integrity. height: auto should be a solution, but doesn't help (not sure if this is a valid style). Reproducible: Always Steps to Reproduce: 1. create some nested divs, according to this page layout, a common method of doing things 2. see style sheet for details Actual Results: Images flowed outside of their parent box. Expected Results: Parent box should expand to accommodate images. parent box will expand only to the size of the text, unless the parent box is floated, in which case it expands to fit the image as well.
Comment 1•20 years ago
|
||
Please create a minimized testcase showing your problem and upload it: https://bugzilla.mozilla.org/attachment.cgi?bugid=285721&action=enter
Assignee: firefox → nobody
Component: General → Layout
Product: Firefox → Core
QA Contact: general → layout
Version: unspecified → 1.0 Branch
Comment 2•20 years ago
|
||
testcases will follow
Comment 3•20 years ago
|
||
<style type="text/css">
.content {
// float: left;
PADDING: 5px 20px 20px 20px;
WIDTH: 620px;
BACKGROUND-COLOR: lime;
}
.galleryimages {
CLEAR: both;
FLOAT: left;
WIDTH: 100px;
}
.imageblock {
margin-left: 60px;
CLEAR: both;
WIDTH: 560px;
PADDING-TOP: 10px;
}
</style>
</head>
<body>
<div class="content">
<div class="imageblock"><div class="galleryimages"><img
src="https://bugzilla.mozilla.org/attachment.cgi?id=177245" alt="San"
border="0" width="100" ></div></div>
<div class="imageblock"><div class="galleryimages"><img
src="https://bugzilla.mozilla.org/attachment.cgi?id=177245" alt="Tec"
border="0" width="100"></div></div>
</div>
Comment 4•20 years ago
|
||
'float: left' added:
.content {
float: left;
PADDING: 5px 20px 20px 20px;
WIDTH: 620px;
BACKGROUND-COLOR: lime;
}
Comment 5•20 years ago
|
||
Comment 6•20 years ago
|
||
Attachment #177246 -
Attachment is obsolete: true
Attachment #177247 -
Attachment is obsolete: true
Comment 7•20 years ago
|
||
confirming: Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.8b2) Gecko/20050312
minimimal testcase 1:
.content {
PADDING: 5px 20px 20px 20px;
WIDTH: 220px;
BACKGROUND-COLOR: lime;
}
.imageblock {
FLOAT: left;
}
<div class="content">
<div class="imageblock">
<img src="https://bugzilla.mozilla.org/attachment.cgi?id=177245" alt="San"
border="0" width="100" >
</div>
</div>Status: UNCONFIRMED → NEW
Ever confirmed: true
Comment 8•20 years ago
|
||
Mozilla's rendering is correct. see comments in the dupe *** This bug has been marked as a duplicate of 210703 ***
Status: NEW → RESOLVED
Closed: 20 years ago
Resolution: --- → DUPLICATE
You need to log in
before you can comment on or make changes to this bug.
Description
•