入力フィールドのテキストは、IOSの場合のみスタイリングを変更します

Question

私の入力フィールド内のテキストはこのように見えますが、IOSの場合のみ問題があります。そして、私はフィールドに入力を開始するとき、すべてがオーケー..です

が

それはオーケー見え、Androidとdesktop'に、唯一のIOSは、問題を引き起こすようです。

これを解決するためのヒントは非常に高く評価されます。

コード：

HTML：

<div class="search-overlay"> 
     <div class="search-input" role="search"> 
      <input placeholder="Søg på titel" name="query" data-quick-search="" id="search-programs-input" 
       type="text" class="" value="" autocomplete="off"><button type="submit" class="dr-icon-search search-input-icon form-control-feedback"><span class="sr-only">{{dictionary "search" "Title"}}</span></button> 
      <button type="button" class="close close-search" data-quicksearch-close=""><span class="dr-icon-close" aria-hidden="true"></span><span class="sr-only">{{dictionary "mainNavigation" "closeSearch"}}</span></button> 

     </div> 
    </div> 

スタイリング：

.search-overlay { 
    background-color: white; 
    height: 75px; 
    position: absolute; 
    top: -75px; 
    width: 500px; 
    right: 5px; 
    z-index: 900; 
    border: 1px solid #ccc; 
    .search-input { 
     padding: 15px; 
     padding-left: 20px; 
     input { 
      background: #E5E5E5; 
      width: 92%; 
      font-size: 24px; 
     } 
     button { 
      border: none; 
      background: transparent; 
      &[class*=dr-icon-search] { 
       position: absolute; 
       right: 55px; 
       top: 23px; 
       &:before { 
        font-size: 25px; 
        color: gray; 
       } 
      } 
      .dr-icon-close { 
       position: absolute; 
       right: 14px; 
       top: 23px; 
       &:before { 
        font-size: 15px; 
        color: gray; 
       } 
      } 
     } 
    } 

} 

Answer 1

は、問題を修正しました私の入力にLine-height:24px; ...あなたはあなたのコードを含める必要があります