Inline icon button in field-contain has zero width #7526

Closed
Shepard opened this Issue Jun 27, 2014 · 0 comments

Projects

None yet

1 participant

@Shepard
Contributor
Shepard commented Jun 27, 2014

See this test page:
http://jsbin.com/huvoraba/24/edit
It has icon buttons (with no text showing) inside a .ui-field-contain, one is inline the other isn't.

When the page is narrow enough, both will show as square blocks around the icon.
When it is wide enough though, the inline button will almost vanish, its width being 0 (it gets width:auto set via a media selector). The other button on the other hand is quite wide, using the available space.
I guess for the non-inline button the behaviour is intended. But for the inline button I would expect it to keep its regular size (i.e. being a square around the icon).

Tested in IE10, Chrome 35 and Firefox 30 on Windows 7.

@arschmitz arschmitz added a commit that closed this issue Aug 22, 2014
@Shepard @arschmitz Shepard + arschmitz Fieldcontain: Reset width for notext buttons
Buttons with .ui-btn-icon-notext normally have a fixed width of 1.75em.
However when putting them as inline buttons inside a .ui-field-contain,
from a certain page width on they get a width:auto, making them use the
available width on the page instead of staying at a fixed width.
This overrides the width:auto with the 1.75em again in that situation.

Fixes gh-7526
Closes gh-7525
2dd9cf4
@arschmitz arschmitz closed this in 2dd9cf4 Aug 22, 2014
@arschmitz arschmitz added a commit that referenced this issue Aug 26, 2014
@Shepard @arschmitz Shepard + arschmitz Fieldcontain: Reset width for notext buttons
Buttons with .ui-btn-icon-notext normally have a fixed width of 1.75em.
However when putting them as inline buttons inside a .ui-field-contain,
from a certain page width on they get a width:auto, making them use the
available width on the page instead of staying at a fixed width.
This overrides the width:auto with the 1.75em again in that situation.

Fixes gh-7526
Closes gh-7525

(cherry picked from commit 2dd9cf4)
01dc1e3
@agcolom agcolom added a commit to agcolom/jquery-mobile that referenced this issue Nov 26, 2014
@Shepard @agcolom Shepard + agcolom Fieldcontain: Reset width for notext buttons
Buttons with .ui-btn-icon-notext normally have a fixed width of 1.75em.
However when putting them as inline buttons inside a .ui-field-contain,
from a certain page width on they get a width:auto, making them use the
available width on the page instead of staying at a fixed width.
This overrides the width:auto with the 1.75em again in that situation.

Fixes gh-7526
Closes gh-7525
b166626
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment