Closed
Bug 451005
Opened 17 years ago
Closed 17 years ago
Border definition in css screws up the flow
Categories
(Core :: Layout: Floats, defect)
Core
Layout: Floats
Tracking
()
RESOLVED
INVALID
People
(Reporter: g.burckardt, Unassigned)
References
Details
(Keywords: testcase)
Attachments
(2 files)
User-Agent: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.0.1) Gecko/2008071618 Iceweasel/3.0.1 (Debian-3.0.1-1)
Build Identifier: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.0.1) Gecko/2008071618 Iceweasel/3.0.1 (Debian-3.0.1-1)
if i define a border for an input-field,
then the flow of input-fields goes wrong.
Example:
<?xml version="1.0" encoding="utf-8"?>
<!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" xml:lang="de" lang="de">
<head>
<title>
Test
</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="language" content="de" />
<style>
.inputrow label {width: 8em; float: left;}
.inputrow input {background: #fff215; border: 1px solid #0077bd;}
</style>
</head>
<body>
<form name="baseform" action="/kontakt/index.htm" method="post" style="margin: 0;">
<div>
<div id="namediv" class="inputrow">
<label for="nameinput">name:  </label>
<input id="nameinput" name="name" value="" />
<br />
</div>
<div id="firstnamediv" class="inputrow">
<label for="firstnameinput">firstname: </label>
<input id="firstnameinput" name="firstname" value="" />
<br />
</div>
</div>
</form>
</body>
</html>
Without the border on .inputrow input the flow ist correct.
Example:
<?xml version="1.0" encoding="utf-8"?>
<!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" xml:lang="de" lang="de">
<head>
<title>
Test
</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="language" content="de" />
<style>
.inputrow label {width: 8em; float: left;}
.inputrow input {background: #fff215;}
</style>
</head>
<body>
<form name="baseform" action="/kontakt/index.htm" method="post" style="margin: 0;">
<div>
<div id="namediv" class="inputrow">
<label for="nameinput">name:  </label>
<input id="nameinput" name="name" value="" />
<br />
</div>
<div id="firstnamediv" class="inputrow">
<label for="firstnameinput">firstname: </label>
<input id="firstnameinput" name="firstname" value="" />
<br />
</div>
</div>
</form>
</body>
</html>
Reproducible: Always
Steps to Reproduce:
1.
2.
3.
|
||
Updated•17 years ago
|
Component: Extension Compatibility → Layout: Floats
Keywords: testcase
Product: Firefox → Core
QA Contact: extension.compatibility → layout.floats
Summary: Border definition in css crashes the flow → Border definition in css screws up the flow
|
||
Comment 1•17 years ago
|
||
Reporter, do you mean that there should be one pixel space between the two input fields? In that case this is a regression between 2006042015 (works) and 2006042019 (fails).
Regression window is:
http://bonsai.mozilla.org/cvsquery.cgi?module=PhoenixTinderbox&date=explicit&mindate=2006-04-20+14%3A00&maxdate=2006-04-20+20%3A00
could be caused by bug 132561 or bug 309433.
If that's not what you mean could you delete the bug number from the "Blocks" field?
|
||
Comment 2•17 years ago
|
||
|
|
||
Comment 3•17 years ago
|
||
This is what the reporter indicates, is the right layout.
|
|
||
Comment 4•17 years ago
|
||
This seems more like a bug on branch to me.
|
||
Updated•17 years ago
|
Status: UNCONFIRMED → RESOLVED
Closed: 17 years ago
Resolution: --- → DUPLICATE
|
|
||
Comment 6•17 years ago
|
||
Er, this isn't a dup, since that bug is quirks-only. It _is_ invalid, since the input is shorter than the text with the border set like that.
Resolution: DUPLICATE → INVALID
I see, that you no realize the problem and so you can't fix it.
Let me explain again:
Testcase1 shows the problem the flowing-error and
Testcase2 showes how it has to flow.
The difference is only the border-declaration in the style.
The border-declaration in the style definition destroys the left flow.
There is no one pixel problem.
Status: RESOLVED → VERIFIED
|
|
||
Comment 8•17 years ago
|
||
The border is a problem because it makes the float bands overlap vertically. The one-pixel thing mentioned above is not what Martijn's testcases show, nor why I marked the bug invalid.
The bug is invalid because the behavior is correct given your styling.
Steps to Reproduce:
1.
Look at the output of the Testcase1
You see there is the border colored
and no flow.
2.
Look at the output of the Testcase2
That way it has to flow.
Status: VERIFIED → UNCONFIRMED
Resolution: INVALID → ---
|
|
||
Comment 10•17 years ago
|
||
That's not what the CSS spec says, actually. Please read the section on float positioning carefully.
This bug really is invalid. Please don't reopen it again.
Status: UNCONFIRMED → RESOLVED
Closed: 17 years ago → 17 years ago
Resolution: --- → INVALID
You need to log in
before you can comment on or make changes to this bug.
Description
•