0

JQuery Mobile ページがあります。上部に 2 つの selects 要素が並んでいます。

iPhone などの小さくて狭い画面でページを開いて [選択] をクリックすると、ダイアログが横に表示されすぎて (中央に表示されず)、テキストが途切れます。

例はこちら。

jQuery ページのコードは次のとおりです。

<body>
<div data-role="page" id="page">
  <div data-role="content">
    <div id="selectview" style="width:50%; float:left">
      <label for="select-view1" style="font-size:12px" >First</label>
      <select name="select-view1" class="select-view" id="select-view1" >
        <option value="aaa">AAAAAAAAA</option>
        <option value="bbb">BBBBBBBB</option>
        <option value="ccc">CCCCCCCCC</option>
      </select>
    </div>
    <div id="select-function-div" style="width:50%; float:left">
      <label for="select-view2" style="font-size:12px" >Second</label>
      <select name="select-view2" id="select-view2"  >
        <option value="ddd">DDDDDDDDDDDDD</option>
        <option value="eee">EE</option>
        <option value="mafffin">FFFFFFFFFFFF</option>
      </select>
    </div>
  </div>
</div>
</body>

どうすれば修正できますか？

4

2 に答える 2

0

float:leftこのようにスタイルタグから削除します

<div id="selectview" style="width:50%;">
      <label for="select-view1" style="font-size:12px" >First</label>
      <select name="select-view1" class="select-view" id="select-view1" >
        <option value="aaa">AAAAAAAAA</option>
        <option value="bbb">BBBBBBBB</option>
        <option value="ccc">CCCCCCCCC</option>
      </select>
</div>
于 2012-06-21T06:47:00.373 に答える
0

スタイル要素の後にセミコロンがないため、表示上の問題が発生している可能性があります。style="width:50%; float:left;" を試してください。代わりは

于 2014-08-28T17:49:50.850 に答える