display:block; height: 100% rendering fails

RESOLVED INVALID

Status

()

Firefox
General
RESOLVED INVALID
10 years ago
10 years ago

People

(Reporter: Eugen Konkov, Unassigned)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(3 attachments)

(Reporter)

Description

10 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; ru; rv:1.8.1.8) Gecko/20071008 Firefox/2.0.0.8
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; ru; rv:1.8.1.8) Gecko/20071008 Firefox/2.0.0.8

When child block height=100% it must fit parent block and do not overlap it

Reproducible: Always

Steps to Reproduce:
<div style="width: 300px; height: 30px; border: 1px solid;">
  <div style="height: 100%; border: 3px solid red;">HELLO</div>
</div>


Expected Results:  
child block with height=100% MUST NOT overlap parent block
(Reporter)

Comment 1

10 years ago
Created attachment 286127 [details]
testcase
(Reporter)

Comment 2

10 years ago
Created attachment 286128 [details]
block element in inline element

IE renders this ok, but FF rendering fail at least parent 'inline' block width does not match width: 300px
(Reporter)

Comment 3

10 years ago
Created attachment 286129 [details]
border of inline element do not take an account in line height calculation

Here width of parent block also FAIL.
But this exaple shows that border of inline element do not participiate in line height calculation and therefore does not fit its contained block

Comment 4

10 years ago
Testcase 1:
> child block with height=100% MUST NOT overlap parent block

'height' means content height, padding/border/margin is outside of that.
http://www.w3.org/TR/CSS21/visudet.html#propdef-height
http://www.w3.org/TR/CSS21/box.html

Testcase 2:
The 'width' and 'height' properties does not apply to non-replaced inline
elements.  http://www.w3.org/TR/CSS21/visudet.html#propdef-width

Testcase 3:
In addition to the above - "only the 'line-height' is used when calculating
the height of the line box":
http://www.w3.org/TR/CSS21/visudet.html#inline-non-replaced

All three testcases: since there is no DOCTYPE they trigger Quirks mode.

Also, please don't file layout bugs on Firefox 2.x, it's just a waste of
your time (and ours) since we only take security and stability fixes
for future Firefox 2.x releases.
Please test Firefox trunk builds instead:
http://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/latest-trunk/

All three cases are rendered according to CSS 2.1 - the buggy rendering
is in IE.  Please read:
http://en.wikipedia.org/wiki/Internet_Explorer_box_model_bug
http://msdn2.microsoft.com/en-us/library/bb250395.aspx
http://www.w3.org/TR/CSS21/

-> INVALID
Status: UNCONFIRMED → RESOLVED
Last Resolved: 10 years ago
Resolution: --- → INVALID
(Reporter)

Comment 5

10 years ago
>Also, please don't file layout bugs on Firefox 2.x, it's just a waste of
>your time (and ours) since we only take security and stability fixes
>for future Firefox 2.x releases.
Sorry, I do not know that before
May be it is needed NOTICE message at https://bugzilla.mozilla.org/ to not post bugs on FFv2.0 and post only FFv3.0 if it do not take security and stability fixes for future Firefox 2.x releases.
Sorry 
You need to log in before you can comment on or make changes to this bug.