Search and Top Navigation
#5779 closed bug (fixed)
Opened June 28, 2010 03:13PM UTC
Closed July 16, 2010 03:21PM UTC
Last modified November 19, 2010 06:26PM UTC
Themeroller - size inconsistency with button widgets and dialog box buttons
Reported by: | dwreck | Owned by: | |
---|---|---|---|
Priority: | minor | Milestone: | 1.8.3 |
Component: | ui.dialog | Version: | 1.8.2 |
Keywords: | css | Cc: | |
Blocked by: | Blocking: |
Description
The Themeroller produces a style for the buttons in dialog boxes that are noticably bigger than other button widgets on your page, especially if your page's base font size is bigger than that on the Themeroller page. This is because of this line of CSS in the resulting style sheet:
.ui-dialog .ui-dialog-buttonpane button { float: right; margin: .5em .4em .5em 0; cursor: pointer; '''padding: .2em .6em .3em .6em;''' line-height: 1.4em; width:auto; overflow:visible; }
Is that padding attribute by design? Removing it from this line makes the button look more in line with other button widgets on the page, and I'm thinking it should be removed from the Themeroller's generated CSS output.
Attachments (0)
Change History (5)
Changed June 28, 2010 03:16PM UTC by comment:1
Changed June 28, 2010 03:21PM UTC by comment:2
One last thing - this issue is visible on the main Themeroller page. If you click on the sample dialog button, you can move the dialog box in such a way to line up its Cancel and Ok buttons with the "A button element" button to see the size difference.
Changed July 16, 2010 03:21PM UTC by comment:3
component: | [meta] ui.themeroller → ui.dialog |
---|---|
milestone: | TBD → 1.9 |
resolution: | → fixed |
status: | new → closed |
Fixed in 60dc674.
Changed August 04, 2010 01:30AM UTC by comment:4
milestone: | 1.9 → 1.8.3 |
---|
Sorry, the bolding didn't work in the code block. Here's the actual CSS code again, minus the extra apostrophees:
.ui-dialog .ui-dialog-buttonpane button { float: right; margin: .5em .4em .5em 0; cursor: pointer; padding: .2em .6em .3em .6em; line-height: 1.4em; width:auto; overflow:visible; }