Почему кнопка jquery mobile отображается как мини?

Я использую следующий код для ссылки, стилизованной под кнопку в jquery mobile:

<a data-role="button" data-inline="true"  id="A1" href="#UserDialog" data-rel="dialog" data-transition="slideup"></a>

однако кнопка отображается так, как если бы она содержала атрибут data-mini="true". Это происходит только на этой странице в моем веб-приложении SPA. У меня нет CSS-правил или классов, которые могли бы быть связаны с этой ссылкой. Я попытался переместить ссылку по странице, чтобы увидеть, есть ли у div или другого родителя класс, влияющий на него, но безрезультатно. Я также попытался создать кнопку программно из элемента, который также не работал.

Я использую тему Tiatems для iOS для jquery mobile, но это единственная страница с этой проблемой.

Я не уверен, что является причиной этого, и мог бы определенно понять, как это исправить

редактировать: добавлено больше кода

        <h3>Marketing Rep Information</h3>                  

        <p>
            <b>Name:     </b>  <a data-role="button" data-mini="false" data-inline="true" data-bind="text: CreatorName" id="A1" href="#UserDialog" data-rel="dialog" data-transition="slideup"></a>
        </p>

        <div id="usecTablediv"  data-role="collapsible" data-collapsed="true" data-inset="true">
            <h2>USECs</h2>
                        <table id="usecTable" class="table table-striped table-bordered table-responsive">
                          <thead>
                            <tr>                                  
                              <th>Title</th>
                              <th>USEC</th>
                              <th>Rate</th>
                            </tr>
                          </thead>
                          <tbody>
                             <!-- ko foreach: USECs -->
                             <tr>
                              <td data-bind="text: Title"></td>
                              <td data-bind="text: UsecCode"></td>
                              <td data-bind="text: Rate"></td>
                             </tr>
                              <!-- /ko -->
                            </tbody>
                        </table>
             </div>
        <a id="Signout2"  class="signout" >Sign Out</a>

1 ответ

Попробуйте установить data-inline="false", и вы увидите, что ваша кнопка расширилась до требуемой ширины.

Другие вопросы по тегам