Кнопка добавления в правую сторону заголовка

Я хотел бы добавить кнопку значка в правую часть моего заголовка в jQuery mobile. У меня проблемы с автоматическим левым позиционированием.

Здесь мой заголовок:

<div data-role="header" data-position="inline">
     <h1>Resultaten</h1>
     <a href="#Home" data-role="button" data-icon="home" data-iconshadow="false"
        data-direction="reverse" onclick="empty()" data-transition="slide"
        data-iconpos="notext">home</a>
</div>

Ответы

Ответ 1

Используйте class="ui-btn-right" или добавьте класс ui-btn-right в <a>

<div data-role="header" data-position="inline">
     <h1>Resultaten</h1>
     <a href="#Home" data-role="button" data-icon="home" data-iconshadow="false"
        data-direction="reverse" onclick="empty()" data-transition="slide"
        data-iconpos="notext"  class="ui-btn-right">home</a>
</div>

Ответ 2

Если у вас есть несколько кнопок, которые вы хотите выровнять вправо, используя class="ui-btn-right" в <a>, поместите все кнопки друг на друга. Вместо этого вы можете просто обернуть div вокруг него и поплавать вправо.

<div data-role="header" data-position="inline">
    <h1>Resultaten</h1>
    <div style="float:right;">
        <a href="#Home" data-role="button" data-icon="home" data-iconshadow="false"
        data-direction="reverse" onclick="empty()" data-transition="slide"
        data-iconpos="notext"  class="ui-btn-right">btn 1</a>
        <a href="#Home" data-role="button" data-icon="home" data-iconshadow="false"
        data-direction="reverse" onclick="empty()" data-transition="slide"
        data-iconpos="notext"  class="ui-btn-right">btn 2</a>
    </div>
</div>

Ответ 3

В jQuery Mobile версии 1.2+ есть атрибут data, вы можете использовать data-iconpos="right".

<a href="#Home" data-role="button" data-icon="home" data-iconpos="right" data-iconshadow="false"
    data-direction="reverse" onclick="empty()" data-transition="slide"
    data-iconpos="notext">home</a>

Официальная документация