我的表单中有一个
html5日期选择器,用于我的网站的移动版本.我的所有文本输入都设置为宽度：100％,其父td设置为padding-right：15px以使其适合.这意味着我的字段格式很好,并且当设备的方向发生变化时,调整为总是填满容器的一半.但是,日期选择器的行为方式不一样,有人可以帮忙吗？
形成：
<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>
相关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%; }
使用宽度100％表格形式和最小宽度：100％表示.tBox,我希望这可以解决你的问题.已经更新了jsfiddle http://jsfiddle.net/brfQf/1/
