I wish to have a dropdown within a radio button label, it seems to work however it cuts off the bottom of it. I faced a similar issue with textboxes however I fixed that by making the positions relative.
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>
I've added a jsfiddle here. Hopefully that can demonstrate the problem more clearly.
Because you do so: http://jsfiddle.net/MehU5/3/ instead of using a checkbox uses a separate collapsible forms with different
<!-- 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>