3

ラジオ ボタン ラベル内にドロップダウンを配置したいのですが、動作しているように見えますが、その下部が切り取られています。テキストボックスで同様の問題に直面しましたが、位置を相対的にすることで修正しました。

input.inline
{
   position:relative !important;
   display:inline;
}

<div id="confirmBooking" data-role="page" class="ui-page">
    <div data-role="header" data-theme="b">
        <h1>Welcome</h1>
    </div>
<div data-role="content">
       <h3>Choose:</h3>
       <fieldset data-role="controlgroup">
          <input checked="checked" type="radio" name="item-choice" id="existing-item"/>
           <label for="existing-item">An Existing Item
           <select class="mySelect">
             <option>Option 1</option>
           </select>
          </label>
  <input type="radio" name="item-choice" id="new-item"/>
  <label for="new-item">New Item 
      <input class="inline" placeholder="Item Name"/>
      <input class="inline" placeholder="Item Description"/>      
  </label>
</fieldset>
<div align="right">     
 <a data-icon="arrow-r" data-iconpos="right" href="#" id="submit" data-theme="b" data-role="button" data-inline="true">Make Booking</a> 
</div>
</div> 
</div>

ここに jsfiddle を追加しました。うまくいけば、問題をより明確に示すことができます。

4

2 に答える 2

3

あなたがそうしているので：http://jsfiddle.net/MehU5/3/チェックボックスを使用する代わりに、異なる折りたたみ可能なフォームを使用します 

   <!-- Home -->
<div data-role="page" id="page1">
    <div data-role="content">
        <div data-role="collapsible-set">
            <div data-role="collapsible" data-collapsed="false">
                <h3>
                    An existing item
                </h3>
                <div data-role="fieldcontain">
                    <label for="selectmenu1">
                    </label>
                    <select name="">
                        <option value="option1">
                            Option 1
                        </option>
                    </select>
                </div>
                <input value="Make booking" type="submit">
            </div>
            <div data-role="collapsible">
                <h3>
                    New item
                </h3>
                <div data-role="fieldcontain">
                    <fieldset data-role="controlgroup">
                        <label for="textinput1">
                        </label>
                        <input name="" id="textinput1" placeholder="Item name" value="Item name"
                        type="text">
                    </fieldset>
                </div>
                <div data-role="fieldcontain">
                    <fieldset data-role="controlgroup">
                        <label for="textinput2">
                        </label>
                        <input name="" id="textinput2" placeholder="Item description" value=""
                        type="text">
                    </fieldset>
                </div>
                <input value="Make booking" type="submit">
            </div>
        </div>
    </div>
</div>
于 2013-03-27T19:13:25.180 に答える
1

ええ、あなたのコードで私が目にする唯一の問題は、and ステートメントの周りにタグをラップしていることです。正しい方法は次のとおりです。

     <div data-role="content">
       <form method="get" action="">
         <fieldset data-role="fieldcontain">
          <label for="select1">Basic Select Menu: </label>
            <select name="select" id="select1">
                 <option value="1">Value 1 </option>
                 <option value="1">Value 1 </option>
           </select>
          </fieldset>
       </form>
      </div>
于 2013-03-27T19:30:14.923 に答える