Closed
Bug 703786
Opened 13 years ago
Closed 9 years ago
<button> child with max-width:100% overlaps padding
Categories
(Core :: Layout: Form Controls, defect)
Core
Layout: Form Controls
Tracking
()
RESOLVED
WORKSFORME
People
(Reporter: MatsPalmgren_bugz, Unassigned)
Details
(Keywords: testcase)
Attachments
(1 file)
848 bytes,
text/html
|
Details |
The testcase at http://stackoverflow.com/questions/8185553/how-can-i-adjust-my-css-so-that-firefox-respects-the-padding-when-child-tag-has seems to put the ellipsis inside the content area in other browsers, while we let it spill out into the padding. Is that expected? Should we be doing the text-overflow clipping before the centering that buttons do? I'll look into this when I get back....
Reporter | ||
Comment 1•12 years ago
|
||
Reporter | ||
Comment 2•12 years ago
|
||
text-overflow handling seems correct - the problem appears to be with how we calculate max-width inside <button>. Setting -moz-box-sizing: content-box; doesn't seem to help, see Testcase #1. Not sure if there's a bug here, but Chrome on Linux renders the testcase as I would expect it - with a 10px horizontal padding around the green box.
Component: Layout: Block and Inline → Layout: Form Controls
Keywords: testcase
QA Contact: layout.block-and-inline → layout.form-controls
Summary: text-overflow in <button> → <button> child with max-width:100% overlaps padding
I can reproduce this behavior on Fx20, but not on Fx28+ // (Win7_64, Nightly 43, 32bit, ID 20150901030226, new profile, safe mode)
Status: NEW → RESOLVED
Closed: 9 years ago
Resolution: --- → WORKSFORME
You need to log in
before you can comment on or make changes to this bug.
Description
•