Closed
Bug 67207
Opened 24 years ago
Closed 24 years ago
[FIX][FILE]<input type=file> & input btn wrong hieght in strict mode
Categories
(Core :: Layout: Form Controls, defect)
Tracking
()
VERIFIED
FIXED
mozilla0.9
People
(Reporter: gcarnes, Assigned: rods)
Details
(Keywords: testcase, Whiteboard: fix in hand)
Attachments
(2 files)
From Bugzilla Helper:
User-Agent: Mozilla/5.0 (Windows; U; WinNT4.0; en-US; m18) Gecko/20010131
BuildID: 2001013104
The <input type="file"> height is displaying about 1 1/2 larger than it should
and is ignoring all styles applied. Also, using its own font. IE displays as
expected.
Reproducible: Always
Steps to Reproduce:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<title>test file</title>
<style type="text/css">
a:hover { color: #0000cc }
a:link { text-decoration: none; font: 12px arial,helvetica,sans-serif; color:
#000000; line-height: 150%; font-weight: bold; width:100% }
a:visited { text-decoration: none; color: #000000; font: 12px
arial,helvetica,sans-serif; line-height: 150%; font-weight: bold; width:100% }
a:active { text-deocration: none; color: #000000; font: 12px arial, helvetica,
sans-serif;font-weight: bold; line-height: 150%; width:100% }
.inputBox { font: 11px arial,helvetica,sans-serif; border: 1px solid #cccccc;
padding-left:2px }
td.textRight { font: 11px arial,helvetica,sans-serif; text-align: right }
.smallblock { font: 11px arial,helvetica,sans-serif }
</style>
</head>
<body style="margin: 0px; background-color: #ffffff">
<form>
<div id="newUser3" style="position:absolute; z-index: 4; top: 10px; left: 21px;
width: 254px">
<table cellspacing="0" border="0">
<colgroup class="smallblock" align="right">
<tr><td colspan="2" height="200" align="center">
<table style="border:1px groove #666666">
<tr><td style="font-size: 12px"><span id="pict">photo max width=200pixels<br>photo
max height=200pixels</span></td></tr>
</table>
</td></tr>
<tr><td colspan="2" align="left">
<span class="smallblock">Picture File</span><br><input type="file" name="picFile"
size="30" style="font: 12px arial,helvetica,san-serif; border: 1px solid
#cccccc"></td></tr>
<tr><td align="left" class="textRight">Caption</td>
<td><input type="text" name="caption" class="inputBox" size="36"></td></tr>
<tr><td> </td><td></td></tr>
</table>
</div>
</form>
</body>
</html>
Actual Results: Input box is very large. 'Browse' button also large. Any styles
applied are ignored.
Expected Results: Should have 12px size text, the box should have a 1px gray
border. Should be same size and look as input box below it. (I know the Browse
button will be come flat looking, and right now, that is ok.)
I removed all extra items (div, tables, etc), styles and fonts on the page and
still get same results, using both strict and loose DTDs. I thought it was at
least using the font-family I wanted (arial,helvetica,sans-serif) until I
removed all references to the font and discovered it was still using that font.
I've tried using different sizes and it is ignored. Also ignoring setting any
border properties. In the above html, there is another input box underneath the
problem area that is of type="text" and it is working perfectly.
|
||
Comment 1•24 years ago
|
||
|
Reporter | |
Comment 2•24 years ago
|
||
This is partially a dupe as far as the styles being ignored. On the other hand,
why this box is displaying larger than normal is still an issue.
|
|
||
Comment 3•24 years ago
|
||
Gene, can you create a very simple testcase. (minimal css, except when it comes
to the input[type="file"]) and attach the testcase to this report.
In my own reports I always try to create a simple testcase that displays just
the error without extra markup like positioning. Sometimes a screenshot never
hurts either. :-)
thanks.
|
|
Reporter | |
Comment 4•24 years ago
|
||
The script I included in the original message produces the problem. At least it
did on my system.
|
||
Comment 5•24 years ago
|
||
|
|
||
Comment 6•24 years ago
|
||
Confirmed that the file input is bigger than the text input. Marking new.
Status: UNCONFIRMED → NEW
Ever confirmed: true
|
Assignee | |
Comment 7•24 years ago
|
||
Is there anyway this could be reduced down further? There is a lot going on here
and I would rather deal with the smallest number of elements. thanks.
Status: NEW → ASSIGNED
|
|
Assignee | |
Updated•24 years ago
|
Summary: <input type=file> display problems → [FILE]<input type=file> display problems
|
|
Assignee | |
Comment 8•24 years ago
|
||
setting target to moz 1.0, and I am still looking for a further reduced testcase
Target Milestone: --- → mozilla1.0
|
|
||
Comment 10•24 years ago
|
||
|
|
||
Comment 11•24 years ago
|
||
Rod I just added a testcase. :-)
I think that the reporter is expecting the text field part of the
input[type=file] to be the same height as the input[type=text]?
This kinda goes along with the same point of bug 69130. But I think in the case
of the input[type=file] you're kinda screwed because of the button attached.
Might the answer be resizing the button in strict like how you resize
input[type=text]?
Keywords: testcase
|
|
Assignee | |
Comment 12•24 years ago
|
||
btn: The problem is extra padding in strict mode
file: The problem is there is too much padding in the btn part of the file
control
Patch:
Index: forms.css
===================================================================
RCS file: /cvsroot/mozilla/layout/html/document/src/forms.css,v
retrieving revision 3.7
diff -u -r3.7 forms.css
--- forms.css 2001/03/08 02:58:12 3.7
+++ forms.css 2001/03/09 18:07:17
@@ -244,6 +244,12 @@
height: inherit;
}
+input[type="file"] > input[type="button"]:-moz-focus-inner
+ {
+ padding: 0px 2px 0px 2px;
+ border: 1px dotted transparent;
+}
+
/* radio buttons */
input[type="radio"] {
border: 2px inset ThreeDFace;
@@ -314,7 +320,7 @@
border: 2px outset ButtonFace;
background-color: ButtonFace;
color: ButtonText;
- padding: 1px 1px 1px 1px;
+ padding: 0px 1px 0px 1px;
font: button;
cursor: default;
white-space: pre;
Summary: [FILE]<input type=file> display problems → [FIX][FILE]<input type=file> & input btn wrong hieght in strict mode
Whiteboard: fix in hand
Target Milestone: mozilla1.0 → mozilla0.9
|
||
Comment 13•24 years ago
|
||
|
||
Comment 14•24 years ago
|
||
OK with me - sr=attinasi
|
|
Assignee | |
Comment 15•24 years ago
|
||
fixed
|
|
Assignee | |
Comment 16•24 years ago
|
||
fixed
Status: ASSIGNED → RESOLVED
Closed: 24 years ago
Resolution: --- → FIXED
You need to log in
before you can comment on or make changes to this bug.
Description
•