Closed Bug 291559 Opened 19 years ago Closed 19 years ago

Inline form is rendered outside its containing p element

Categories

(Core :: DOM: HTML Parser, defect)

Product:
Core
Component:
DOM: HTML Parser
Version:
1.0 Branch
Platform:
x86
Windows XP
Type:
defect
Priority:
Not set
Severity:
normal

Tracking

()

Status:
RESOLVED INVALID

People

(Reporter: AnneTLambert, Assigned: bugzilla)

Details

Attachments

(1 file, 1 obsolete file)

original testcase
684 bytes, text/html
Details 
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.7) Gecko/20050414 Firefox/1.0.3
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.7) Gecko/20050414 Firefox/1.0.3

If I put a Form styled as inline within a P styled as a block, I would expect
the form to stay "inside" the p.

But form elements, and any elements after the form, are displayed outside the
containing P.

Reproducible: Always

Steps to Reproduce:
1. Save the following sample document as an html file.

2. Open the sample in Firefox 1.0.3.

Sample document:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test form</title>

<style type="text/css">
	p { display: block; border: 2px solid red;}
	form { display: inline; }
	input { display: inline; }
</style>

</head>

<body>
	<p>Some text before the form
		<form method="post" >
			<input type="text" value="" name="test1" />
			<input type="submit" value="click this button" />
		</form>
		Some text after the form. This is the last content within the red-bordered p.
	</p>
</body>
</html>

Actual Results:  
In the sample document provided, the form elements, and the text after the form,
displays outside the red border of the containing p.

Actual results (pseudo-html): <start red border>Some text<end red border>Form
elements. Other text.

Expected Results:  
In the sample document provided, the inline Form elements are contained within a
block p element that has a red border. Therefore, I would think that all the
form elements within that p ought display within the p and therefore within its
red border.

Expected results (pseudo-html): <start red border>Some text. Inline Form
elements. Other text. <end red border>

Workaround for authors of sites: Use a <div> to surround the text and the form
instead of a <p>.

Workaround for viewers of sites: None. The site would just look ugly.
Attached file original testcase (obsolete) — 
Original testcase, as attachment.
Attached file original testcase — 
Oops - the previous testcase was simplified. This is the original.

BTW, this bug is INVALID - I'll soon explain why.
Attachment #181607 - Attachment is obsolete: true
The testcase is not valid XHTML. <form> is not allowed inside <p>. This has
nothing to do with the form being inline or not.
The parser implicitly closes the <p> element when it encounters the <form>
(since it knows the <form> can't be inside the <p>), and therefore the form and
everything after it is rendered outside the <p>.
Status: UNCONFIRMED → RESOLVED
Closed: 19 years ago
Component: General → HTML: Parser
Product: Firefox → Core
Resolution: --- → INVALID
Version: unspecified → 1.0 Branch
Also see bug 91927 for a discussion (using TABLE, not FORM. But the idea is the
same).
Even better, see bug 94269 which discusses the <p>/<form> issue specifically.
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: