Opened 10 years ago
Closed 10 years ago
#9212 closed bug (notabug)
Buttonset button margin shouldn't be applied to the last button in the set
Reported by: | emlun | Owned by: | emlun |
---|---|---|---|
Priority: | minor | Milestone: | none |
Component: | ui.button | Version: | 1.10.2 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
Suppose you have three buttons and one buttonset in a column, and want their edges to align nicely:
| Button1 | | Button2 | | Radio1 || Radio2 || Radio3 | | Button3 |
This is near impossible since the buttonset will always be offset by a bit on one side or the other. By not applying the shift-right style rule to the last button in the buttonset, however, no special margins poke out of the sides, and styling it all becomes much easier.
Change History (12)
comment:1 Changed 10 years ago by
Owner: | set to emlun |
---|---|
Status: | new → pending |
Version: | git → 1.10.2 |
comment:2 Changed 10 years ago by
Status: | pending → new |
---|
Working on it, still figuring out how best to attach images. I have a fix ready for pull requesting as well, so my creating this ticket is mostly a formality. Right now I'm on my way home, I didn't really expect anyone to find this until I got home so I left it half done. I clearly underestimated the community here, sorry 'bout that. :)
comment:3 follow-up: 4 Changed 10 years ago by
Status: | new → pending |
---|
Working on it, still figuring out how best to attach images.
Please do not provide a screenshot. Use jsFiddle or jsbin to create an actual page showing the problem.
I have a fix ready for pull requesting as well, so my creating this ticket is mostly a formality.
Glad to hear you have a pending fix :-)
Tickets are not formalities. They're important for verification, discussion, version tracking, changelogs, etc.
Right now I'm on my way home, I didn't really expect anyone to find this until I got home so I left it half done. I clearly underestimated the community here, sorry 'bout that. :)
No problem :-) I'm going to set this back to pending until we get the visual test case. Thanks.
comment:4 Changed 10 years ago by
Status: | pending → new |
---|
Tickets are not formalities. They're important for verification, discussion, version tracking, changelogs, etc.
Yeah, I got that. By 'formalities' I meant RingTFM and following the instructions. ;)
comment:5 Changed 10 years ago by
Status: | new → pending |
---|
comment:6 Changed 10 years ago by
Status: | pending → new |
---|
Huh, for whatever reason I can't seem to reproduce the problem in a minimal example - it styles nicely without ugly hacks, unlike in the development environment where I found myself having a problem with it. I'll try to figure it out at the next opportunity, which will probably be Tuesday. Can I just leave this as pending with me as the owner until then, or what's the policy for this kind of thing?
And if I'm the one changing the status to new all the time, please let me know how to not do that when I post a comment... :x
comment:7 Changed 10 years ago by
Status: | new → pending |
---|
You're not doing anything wrong. Every time you reply it'll automatically get set back to new. If you don't reply for 2 weeks, the ticket will automatically close.
I'll set back to pending for you to investigate the scenario(s) that cause this problem.
comment:8 Changed 10 years ago by
Status: | pending → new |
---|
So I created a demo:
- http://f.kth.se/~emlun/jquery-ui/buttonset-fix-margin/before/
- http://f.kth.se/~emlun/jquery-ui/buttonset-fix-margin/after/
The only differences between these two are http://pastebin.com/Seiics2f . The example shows that the change has some merit, though perhaps not a great deal.
Sadly, the "after" version does not render properly in IE9 - the buttonset buttons get spaced too far apart since IE does not understand the :last-child selector. I suppose that disqualifies this change since it would break buttonsets in IE. Rearranging the :not(:last-child) and :last-child rules does not help either.
See the accepted answer at http://stackoverflow.com/questions/1293369/using-last-child-in-css . I did not realize this when opening this ticket. :)
comment:9 Changed 10 years ago by
Status: | new → pending |
---|
I copied your "before" page into jsFiddle and I don't see the problem: http://jsfiddle.net/5CjAV/
Perhaps it's because you're in quirks mode.
comment:10 follow-up: 11 Changed 10 years ago by
@emiun It might be easier to use this as a starting point for your test case: http://jsfiddle.net/tj_vantoll/RKwuk/. It has the latest versions of jQuery and jQuery loaded, is in standards mode, and has some example markup already in place.
comment:11 Changed 10 years ago by
Status: | pending → new |
---|
Replying to scott.gonzalez:
I copied your "before" page into jsFiddle and I don't see the problem: http://jsfiddle.net/5CjAV/
Perhaps it's because you're in quirks mode.
Yeah, I've probably gotten lost in my own changes while trying to fix the original problem. After I sat down to straighten these things out for the sake of this ticket everything seems to work just fine. I guess there really isn't any problem with the theme css as it is. Whatever it was that caused the problem turned out to be easy to override after all.
Anyway, I no longer see any reason to keep pursuing the change I originally suggested. Thanks for your patience. :)
comment:12 Changed 10 years ago by
Resolution: | → notabug |
---|---|
Status: | new → closed |
Can you please provide an actual page showing this instead of ASCII art?