Несколько кнопок на правой стороне заголовка

Question

Я хотел бы иметь более одной кнопки на правой стороне панели заголовка.В документах говорится, что вы можете настроить с помощью DIV, но когда я это делаю, кнопки не имеют своего обычного стиля.Любой совет?

Answer 1

Приведенный выше пример помещает в заголовок больше, чем кнопки, но все они расположены слева от заголовка.Я думаю, что вы можете сгруппировать свои кнопки в контрольной группе и расположить контрольную группу справа от заголовка.Может быть, что-то вроде этого:

  <div data-type="horizontal" data-role="controlgroup" class="ui-btn-right">  
     //have your button here
  </div>

Надеюсь, это поможет.

Answer 2

Вот как я это сделал, кажется чистым.

HTML

<div id="myHeader" data-role="header" data-theme="a">
    <span class="ui-title"></span>
    <div class="ui-btn-right">
        <a id="myButton1" class="headerButton" href="#" data-role="button"></a>
        <a id="myButton2" class="headerButton" href="#" data-role="button"></a>
    </div>
</div>

CSS

.headerButton {
    float: left;
    margin-right: 5px!important;
}

Answer 3

Я видел, как это делается в нижнем колонтитуле ( Показано здесь ), может дать вам представление о заголовке или панели инструментов

Answer 4

Вы можете использовать класс сетки.

<div class="ui-grid-a ui-btn-right">
        <div class="ui-block-a" ><a href="#" data-role="button" data-inline="true" >Button1</a></div>
        <div class="ui-block-b" ><a href="#" data-role="button" data-inline="true" >Button2</a></div>
</div>

Answer 5

 <a href="#" class="ui-btn-right ui-btn ui-btn-up-a ui-btn-icon-left 
    ui-btn-corner-all ui-shadow" data-rel="back" data-icon="cancel" 
    data-theme="a">
    <span class="ui-btn-inner ui-btn-corner-all">
      <span class="ui-btn-text">Cancel</span>
      <span class="ui-icon ui-icon-arrow-l ui-icon-shadow"></span>
    </span>
 </a>