Closed
Bug 635698
Opened 14 years ago
Closed 14 years ago
<input type="button" /> and <input type="text" /> with same style have different heights
Categories
(Core :: Layout, defect)
Tracking
()
RESOLVED
DUPLICATE
of bug 140562
People
(Reporter: simon, Unassigned)
References
Details
Attachments
(2 files)
User-Agent: Mozilla/5.0 (Windows NT 5.1; rv:2.0b11) Gecko/20100101 Firefox/4.0b11 Build Identifier: Mozilla/5.0 (Windows NT 5.1; rv:2.0b11) Gecko/20100101 Firefox/4.0b11 When styling buttons and text fields exactly the same way, the button is still higher. It seems some additional padding is added. Reproducible: Always Steps to Reproduce: 1. See the attached test case in Firefox and compare it to Chrome 9 or IE 8 Actual Results: The button is 2px heigher than the text-input; Expected Results: The button and the text-input have exactly the same height. Chrome, Opera, IE and Safari handle this just fine.
Updated•14 years ago
|
Version: unspecified → Trunk
Comment 3•14 years ago
|
||
Confirmed.
Status: UNCONFIRMED → NEW
Component: General → Layout
Ever confirmed: true
Product: Firefox → Core
QA Contact: general → layout
Comment 4•14 years ago
|
||
They're not the same height because a button has an extra pixel or two of "focus padding" for drawing the focus rect. This is a duplicate. Please find the original and mark accordingly.
Whiteboard: DUPEME
Thanks for the comment. This raises three new questions: 1.) How can of a button's "focus-padding" be disabled? 2.) Is there any standard description (HTML, CSS) on "focus padding? I could not find any. 3.) Why do all other browsers do it differently?
Comment 6•14 years ago
|
||
> 1.) How can of a button's "focus-padding" be disabled? The relevant UA rule is: button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner { padding: 0px 2px 0px 2px; border: 1px dotted transparent; } you can just put that in your page and change the padding and border as desired. > 2.) Is there any standard description (HTML, CSS) on "focus padding? No. Rendering of form controls in general is completely undefined in the specs. > 3.) Why do all other browsers do it differently? Because they take a different approach to showing the focus outline, presumably.
Updated•14 years ago
|
Status: NEW → RESOLVED
Closed: 14 years ago
Resolution: --- → DUPLICATE
Whiteboard: DUPEME
You need to log in
before you can comment on or make changes to this bug.
Description
•