0

これを短くて甘いものにしてください。私の問題は次のとおりです。 Internet Explorer、Firefox、または Google Chrome でフォームを表示すると、期待どおりにフォームが表示されます。

このフォームを iPad (または iPod touch...) で表示すると、フォームが本来のように表示されず、配置したコンテナ (固定幅または自動) を横切って「千鳥状」になり、完全に恐ろしいように見えます。少しでも!私が抱えている問題は、以下にリンクされている画像に示されています。

誰かが I-OS プラットフォーム内でフォームを正しく整列させるように強制しようとする提案があれば、それは素晴らしいことです!

PS - Android ベースの Sony Ericsson Xperia で表示すると、フォームは正しく表示されます。

問題の画像 (下のリンクの画像を参照 -> http://imgur.com/a/1aB2j <- 画像について)

使用される HTML

<p><b>Add a user:</b></p>
<form action='adminmanageuser.php?addconf=yes' method='post'>
<input type='checkbox' checked name='unamecheckbox'>
<br><br><div style='width: auto; text-align:left; display: block;'>
<label class='adduser' for='access'>User Type:</label><select name='access'>
<option value='0'>-- -- -- -- -- -- -- -- -- -- --</option>
<option value='2'>Student</option>
<option value='3'>Teacher</option>
<option value='5'>Admin</option>
</select><br>
<label class='adduser' for='access'>Forename:</label><input type='text' name='fname'><br>
<label class='adduser' for='sname'>Surname:</label><input type='text' name='sname'><br>
<label class='adduser' for='uname'>Username:</label><input type='text' name='uname'<br>
<label class='adduser' for='pass'>Password:</label><input type='text' name='pass'><br>
<label class='adduser' for='year'>Yeargroup:</label><input type='text' name='year'><br
<label class='adduser' for='form'>Formgroup:</label><input type='text' name='form'><br
<input type='submit' style='margin-left: 9em;' value='Add User'>
</form>
</div>

使用される CSS

label.adduser
{
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 16px;
    width: 7em;
    float: left;
    text-align: right;
    margin-right: 0.5em;
    margin-top: 0.2em;
    margin-bottom: 0.2em;
    display: block
}
input[type='text']
{
    padding: 2px;
    border-color: gray;
    border-width: 2px;
    box-shadow: none
    font-size: 15px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    width:12em;
}
4

0 に答える 0