265622 - display:inline does not work properly

Status: VERIFIED INVALID

(Core :: Layout: Block and Inline, defect)

Description

[Michael Kauffmann]

User-Agent:       Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8a5) Gecko/20041020 Firefox/0.9.1+
Build Identifier: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8a5) Gecko/20041020 Firefox/0.9.1+

An inline-element starts a new block.

Reproducible: Always
Steps to Reproduce:
<p>A text parapraph with an <h4 style="display:inline">inline headline</h4>
within  it</p>

Actual Results:  
The inline-element starts in a new paragraph.
At ist end, it continues correctly.

Expected Results:  
Display the inline-element really inline, without line breaks at the beginning
or the end.

Or have misunderstood the inline-style?
But I think firefox used to work as I expected.

Comment 1

[Uri Bernstein]

This really doesn't have to do with style but with HTML.

According to the HTML spec:
"The P element represents a paragraph. It cannot contain block-level elements
(including P itself)."
h4 is a block-level element. This is true even if its style attribute is set to
"display:inline;" (HTML classifies element to "block" and "inline", regardless
of how they are actually displayed by the style system).
When the HTML parser encounters the <h4> starting tag, it knows that it can not
be contained inside the <p> tag. It therefore implicitly closes the p element at
that point (in HTML, unlike XHTML, the parser assumes that in certain cases
closing tags can be ommitted, and implicitly inserts them as necessary).

So the line break you are seeing is the result of the block-level p element
being closed.

If you upload your HTML to a validator (http://validator.w3.org), it will
complain about an "end tag for element "P" which is not open" - because the "P"
element was already implicitly closed before the <h4>. 
If you specify that your markup is XHTML (not HTML), it will again be invalid,
because <h4> is not allowed inside <p> (in this case the validator will complain
as it encounters the <h4> tag, as a </p> tag cannot be inserted implicitly).

So the bug is INVALID.

Comment 2

[Boris Zbarsky [:bzbarsky]]

Verified.  "block" and "inline" in HTML are completely unrelated to "block" and
"inline" in CSS.  Using <div> instead of <p> will demonstrate that setting
"display: inline" on the <h4> does in fact affect the rendering as it should. 
But it doesn't affect the parsing (also as it should).

Comment 3

[Michael Kauffmann]

Thank You both, I wasn't aware that text without an enclosing <p>-block ist
valid and good style.