入力位置がiPhoneで正しく表示されない

Question

入力フォームで固まってしまいます。デベロッパーコンソールでチェックするとすべて問題ありません。しかし、私は私のiPhoneからそれを確認するときに約1-2pxに位置を変更します。私は同じサイズのアンドロイド携帯からチェックしても大丈夫です。 デベロッパーコンソールのiphone 5に入力 - http://cs629525.vk.me/v629525181/40c5e/zrdadYwKeBU.jpg。 私のiPhoneからの入力5 - http://cs629525.vk.me/v629525181/40c57/KjsRhwnjQ4k.jpg。

<form id="subscribe"> 
      <input type="text" class="enter-email" name="subscribe-email" id="subscribe-email" placeholder="YOUR EMAIL" spellcheck="false" /> 
      <button type="submit" id="signup-button" class="signup-button c-form">NOTIFY ME</button> 
      <label for="subscribe-email" class="subscribe-message c-form"></label> 
     </form> 
<!--css--> 
.enter-email { 
margin-top: 30px; 
margin-left: 17.5%; 
width: 40%; 
font-size: 16px; 
height: 50px; 
background: none; 
border: 2px solid white; 
color: #fff; 
text-align: center; 
outline: none; 
-webkit-transition: all 0.5s ease; 
transition: all 0.5s ease;} 

.signup-button { 
height: 50px; 
border: 2px solid white; 
color: white; 
text-align: center; 
padding: 5px; 
font-size: 16px; 
width: 25%; 
background: #32dbd0; 
margin-left: -6px; 
transition: all 0.4s ease;} 

::-webkit-input-placeholder { 
color: #fff; 
font-size: 16px; 
text-align: center; 
padding: 1px; } 

Answer 1

以下 コードは、あなたの二つの要素に以下を追加します。

.enter-email { 
    vertical-align: top; 
    ... 
} 

.signup-button { 
    vertical-align: top; 
    ... 
} 

ボタンや入力、デフォルトのインラインブロックです。そうすれば、彼らは同じレベルに揃えられます。