0

jQuery Mobile の折りたたみ可能な div で、ページの幅が縮小されたときに (つまり、モバイル デバイスで見られるように) 縮小されないという問題があります。私はそれを持っているので、ページ上の他のすべての要素は適切に拡大縮小されます (幅) が、折りたたみ可能な div は境界を過度に伸ばしており、それらを小さくすることはできません (ページ幅よりも広くなります)。

折りたたみ可能な IS のヘッダー ラベルを切り取ります。方法がわかりません。これは概念的な質問かもしれませんが、参照用にコードの一部を投稿します。

<table id="DataTable" style="width:100%" cellpadding="0" cellspacing="0">
  <tr>
    <td>
      <div id="row" class="Collapsible" data-role="collapsible" data-theme="c" data-content-theme="c" style="margin:0">
        <h3>Example header label (Can be covered)</h3>
        <p>Contents of the div on expand</p>
      </div>
    </td>
  </tr>
</table>
4

1 に答える 1

0

.ui-btn-inner問題は:の css 定義だと思いますwhite-space: nowrap;。次のように上書きしてみてください。

.ui-btn-inner {
    white-space: normal !important;
}

この例も参照してください。

===更新===

次の css を追加して、折りたたみ可能なdiv(およびh3) 要素をインライン要素に変更できます。

.Collapsible, .Collapsible h3 {
    display: inline !important;
}

私の更新された例も参照してください。

于 2012-05-17T12:55:52.467 に答える