css - iOS HTML5 date picker won't accept width: 100%; -
i have html5 date picker in form mobile version of site. text inputs set width:100% , parent td set padding-right:15px make fit. means fields nicely formatted , adjust fill half of container when orientation of device changes. date picker not behave in same way, can help?
form:
<form method="get" action="home"> <table id="form"> <tr><td> <input type="text" name="title" class="tbox" placeholder="title" /> </td><td> <input type="text" name="genre" class="tbox" placeholder="genre" /> </td></tr> <tr><td> <input type="text" name="location" class="tbox" placeholder="location" /> </td><td> <input type="date" name="date" class="tbox" placeholder="dd/mm/yy" /> </td></tr> <tr><td> <input type="text" name="postcode" class="tbox" id="postcode" placeholder="postcode" /> </td><td> <input type="number" name="radius" class="tbox" placeholder="mile radius" /><br /> </td></tr> </table> <input type="submit" value="search" /> </form>
relevant css:
.tbox { background-color: #a1c9ff; border: 1px solid #003f94; width: 100%; height: 30px; margin: 3px 2px; padding: 0 5px; border-radius: 15px; font-size: 18px; float: left; } table#form tr td { overflow: hidden; padding-right: 15px; }
.tbox { min-width:100%; } table#form { width:100%; }
use width 100% table#form , min-width:100% .tbox, hope solve problem. have updated jsfiddle http://jsfiddle.net/brfqf/1/
Comments
Post a Comment