New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

button with icon and no text #3284

Closed
pehrlich opened this Issue Dec 16, 2011 · 3 comments

Comments

Projects
None yet
3 participants
@pehrlich

<a data-role="button" data-icon="forward"></a>

Generates this markup:

<a data-role="button" data-icon="forward" class="ui-btn ui-btn-icon-left ui-corner-left ui-btn-up-a" data-theme="a">
<span class="ui-btn-inner ui-corner-left" aria-hidden="true">
    <span class="ui-btn-text"></span>
    <span class="ui-icon ui-icon-forward ui-icon-shadow"></span>
</span>
</a>

This appears as a rectangular button -- extra padding on the right with the empty span. The span can't simply be removed, because the button looses its height.

Here's my hack for the time being:

.ui-btn.notext .ui-btn-inner{
  padding-right: 0;
  margin-right: -5px; /* not a perfect soltiuon, leaves border along top */
}
@toddparker

This comment has been minimized.

Show comment
Hide comment
Contributor

toddparker commented Dec 16, 2011

Why not use data-iconpos="notext"

http://jsbin.com/eyicuv/2
http://jsbin.com/eyicuv/2/edit

@pehrlich

This comment has been minimized.

Show comment
Hide comment
@pehrlich

pehrlich Dec 16, 2011

d'oh. Just found that, too.

Wouldn't be bad if it did it intelligently I suppose..

UPDATE: actually, this causes the vertical alignment to go weird next to a regular button

d'oh. Just found that, too.

Wouldn't be bad if it did it intelligently I suppose..

UPDATE: actually, this causes the vertical alignment to go weird next to a regular button

@jaspermdegroot

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot May 1, 2012

Member

@pehrlich Is this what you mean with "vertical alignment to go weird next to a regular button"... http://jsbin.com/ikibog/2/

Member

jaspermdegroot commented May 1, 2012

@pehrlich Is this what you mean with "vertical alignment to go weird next to a regular button"... http://jsbin.com/ikibog/2/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment