Странные отступы в iPad Safari при использовании и <input>в HTML - PullRequest
Новая
       23

Странные отступы в iPad Safari при использовании и <input>в HTML

0 голосов
/ 07 ноября 2011

Я строю систему для диктантных упражнений на датском, специально для iPad.До сих пор я тестировал в gnome, и страницы выглядят нормально, но когда я наконец-то получил свой iPad, что-то не так.*

В Chrome и IE текст выглядит нормально, как:

Солнце имело [поле ввода], а воздух был [поле ввода]

Но на iPad это выглядит как [вкладка] вставляется перед каждой строкой "a href =": 

       The sun had [ input box ]            and the air was [ input box ]

Это мой первый большой проект с домашней страницей, и эта проблема для меня довольно неприятна, так как вся идея заключается в этомработать на iPad - помогите пожалуйста ..

1 Ответ

1 голос
/ 07 ноября 2011

Я обнаружил, что удаление звуковых тегов решает проблему.Вы можете использовать следующий макет: 

<body>
<audio id="audiotag6" src=diktat02/gaaet.m4a preload="auto"></audio>
<audio id="audiotag7" src=diktat02/koelig.m4a preload="auto"></audio>

<form>
<a href="javascript:play_sound('audiotag6');">The sun had   <input type="text"       name="word6" autocomplete="off"/>  ned, </a>
<a href="javascript:play_sound('audiotag7');"> and the air was  <input type="text" name="word7" autocomplete="off"/>  klar, </a>
</form>
</body>

Кроме того, вы не должны помещать якорные элементы внутри элемента формы, но вне элемента типа поля ... это может работать, но это не семантически точно:)

РЕДАКТИРОВАТЬ:

Подумав еще немного о том, как это можно сделать семантически более дружественным способом, я соединил это: 

<audio>
  <source src="diktat02/gaaet.m4a" id="audiotag6" preload="auto" type="audio/m4a" />
  <source src="diktat02/koelig.m4a" id="audiotag7" preload="auto" type="audio/m4a" />
  Your browser does not support the audio tag.
</audio> 

<form onsubmit="play_sound('audiotag6');">
The sun had   <input type="text" name="word6"  autocomplete="off"/>  ned, 
<input type="submit" value="Play" />
</form>

<br />
<br />

<form onsubmit="play_sound('audiotag7');">
and the air was  <input type="text" name="word7" autocomplete="off"/>  klar,
<input type="submit" value="Play" />
</form>

Таким образом, вы избегаете ссылок,звуковые теги настраиваются сразу, механизм воспроизведения предложений более понятен, а javascript менее косвенен.Конечно, вы примете решение о том, как реализовать это, исходя из своих собственных предпочтений, и я не думаю, что мое решение является лучшим в любом случае:)

Надеюсь, это поможет.

...