文本框越來越切斷在iphone佈局

當你減少瀏覽器窗口到iPhone佈局.... 你可以看到不同的佈局.... 問題是右側的文本字段是被切斷...... 如何解決它...... 提供下面我的代碼.....文本框越來越切斷在iphone佈局

<input type="text" placeholder="Company Name " name="fullname" maxlength="30" required="required" id="id_username"> 
<input type="text" placeholder="Contact Name" name="company" maxlength="30" required="required" id="id_company"> 
<input type="text" placeholder="Address1" name="email" maxlength="75" required="required" id="id_email"> 
<input type="password" placeholder="Address2" name="password" maxlength="16" required="required" id="id_password"> 
<input type="password" placeholder="Address3" name="repassword" required="required" id="id_repassword"> 
<input type="text" placeholder="City " name="fullname" maxlength="30" required="required" id="id_username"> 
<div class="controls"> 
    <select name="select" id="state" style="width: 300px;height: 38px;"> 
     <option value="California" selected="">California</option> 
     <option value="New York">New York</option> 
     <option value="Texas">Texas</option> 
    </select> 
</div> 
<input type="text" placeholder="Zip" name="email" maxlength="75" required="required" id="id_email"> 
<div class="controls"> 
    <select name="select" id="country" style="width: 300px;height: 38px;"> 
     <option value="USA" selected="">USA</option> 
     <option value="India">India</option> 
     <option value="Korea">Korea</option> 
     <option value="Vietnam">Vietnam</option> 
    </select> 
</div> 
<input type="text" placeholder="Phone" name="company" maxlength="30" required="required" id="id_company"> 
<input type="text" placeholder="Fax" name="email" maxlength="75" required="required" id="id_email"> 
<input type="password" placeholder="Email" name="password" maxlength="16" required="required" id="id_password"> 
<input type="text" placeholder="URL" name="company" maxlength="30" required="required" id="id_company"> 
<input type="text" placeholder="GL Account" name="email" maxlength="75" required="required" id="id_email"> 
<input type="password" placeholder="" name="password" maxlength="16" required="required" id="id_password"> 
<textarea name="inquiry" placeholder="Notes" rows="3" required="required" id="id_inquiryForm" style="width:290px;"></textarea>

來源

2013-03-26 user2136828

看起來你的＃註冊模態格設置爲寬度125px。只需將其增加爲適合輸入的正確尺寸即可。或刪除'overflow：hidden'

來源

2013-03-26 19:53:08 iluvpinkerton

幾個星期前有過這個問題。我不知道你的CSS是什麼樣子，但是嘗試在輸入字段中添加一個百分比寬度：

form input{width: 99%;}

YMMV。您可能還必須爲textarea添加一些內容並選擇字段並根據需要調整百分比。

來源

2013-03-26 19:58:16

嗨我在小提琴中升起，但它不工作http://jsfiddle.net/jPvzL/5/ – user2136828 2013-03-26 21:58:10

你有一些固定的寬度是非常小的，就像在＃註冊模式窗體和＃註冊模式。在Chrome開發工具中，我刪除了它們，或者用百分比替換了它們，並且表單字段很好地響應並彎曲了。更改任何直接影響表單的父div的固定寬度。 – 2013-03-28 13:34:03

確定這裏有一些我爲你做的調整：http://jsfiddle.net/maEZr/ 我的新增功能是用/ *添加sarah */ 我沒有對齊輸入和選擇字段，您會發現百分比可以幫助您調整寬度並使其適合您所需的方式，無論您使用的是何種屏幕尺寸。 – 2013-03-28 13:47:04

文本框越來越切斷在iphone佈局

回答

相關問題