Closed
Bug 218715
Opened 21 years ago
Closed 21 years ago
DIV size wrong
Categories
(Core :: Layout: Block and Inline, defect)
Tracking
()
VERIFIED
INVALID
People
(Reporter: gerke.kok, Unassigned)
References
()
Details
User-Agent: Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.5b) Gecko/20030908
Build Identifier: Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.5b) Gecko/20030908
The DIV's in this page are not displayed correctly. Whe I tell the width of a
DIV to be 20% and the left to be 0%(or 0cm) and I setup another DIV to start
left: 20% that these are displayed next to eachother. In stead, they overlap in
Mozilla.
Reproducible: Always
Steps to Reproduce:
1.
2.
3.
Actual Results:
The DIV's that should be ajacent overlap
Expected Results:
I would like them to be displayed next to eachother.
IE/Windows interprets 'width' incorrectly. 'width' is the area inside the
border, so the border-edge of the box is really 20% plus 2pt wide. Thus the
overlap.
(You can always create an extra element inside the positioned one and put the
border on that. But the correct CSS model does make more sense in many cases as
well.)
Status: UNCONFIRMED → RESOLVED
Closed: 21 years ago
Resolution: --- → INVALID
Please have a look at this page too:
http://kok.thuis99.org/testoo/index-2.html
It shows the same as the former, but also shows that there is still overlap.
Even without the border.
Comment 3•21 years ago
|
||
You're not accounting for the padding. In your other case, the box is 20% +
.1cm wide because of the padding. So you still get overlap.
Verifying invalid.
Status: RESOLVED → VERIFIED
The pain is that other browser (Opera & IE) don't take the width for the inside
of the DIV element. This makes it hard to make cross-browser pages. I know we
get into religious areas with this, but it does make sense to consider this...
Comment 5•21 years ago
|
||
>The pain is that other browser (Opera & IE) don't take the width for the inside
>of the DIV element.
The current versions of both these browsers get this right if not displaying in
compatibility mode. See, for example, http://www.opera.com/docs/specs/doctype/
for a good summary.
I made the page http://kok.thuis99.org/testoo/index-2.html using DOCTYPE Strict
(<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN">) and took a look at it
with different browsers. This does not make it much better. You can see a
difference still: the bottom two boxes over-lap where they should NOT IMHO.
Please have another look.
(index-3.html is even with the requeired URL in the DOCTYPE)
You need to log in
before you can comment on or make changes to this bug.
Description
•