css - wordpress 検索フォームの Chrome バグ

Question

WordPress CMS を利用したサイトで作業しています。
IE、Firefox、Opera、その他のブラウザでは正常に動作しますが、Chrome では動作しません。

Firefox のサイトhttp://dian.7u.czでは、検索フォームは適切な位置にありますが、Chrome では実際の位置の下にある行です。

このようなボタンを生成します

<div id="topsearch">
<?php get_search_form(); ?>
</div>

Firefoxはこのようにします

<div id="topsearch">
  <div id="search">
    <form id="searchform" action="http://localhost/wordpress/" method="get">
      <input id="s" type="text" onfocus="if (this.value == 'Hľadať') {this.value = '';}" onblur="if (this.value == '')  {this.value = 'Hľadať';}" name="s" value="Hľadať">    
      </input>
      <input type="image" style="border:0; vertical-align: top;"src="http://localhost/wordpress/wp-content/themes/GamesMax/GamesMax/images/search.gif">
      </input>
    </form>
  </div>
</div>

しかし、Chromeはこのようにします

<div id="topsearch">
 ""

  <div id="search">
    <form id="searchform" action="http://localhost/wordpress/" method="get">
      <input id="s" type="text" onfocus="if (this.value == 'Hľadať') {this.value = '';}" onblur="if (this.value == '')  {this.value = 'Hľadať';}" name="s" value="Hľadať">    
      </input>
      <input type="image" style="border:0; vertical-align: top;"src="http://localhost/wordpress/wp-content/themes/GamesMax/GamesMax/images/search.gif">
      </input>
    </form>
  </div>
</div>

topsearch の私の css は次のとおりです。

#topsearch {
    text-align:left;
    float:right;
    margin-bottom: 0;
    margin-right: 17px;
    margin-top: 9px;
}

誰でもこれで私を助けることができますか?

Answer 1

テンプレートをもう一度チェックしてheader.php、searchform.php見えないスペースやタブ文字がないことを確認してください。

#topsearchとの間の行末にある見えないスペース文字のよう#searchです。

<div id="topsearch">
                     
    <div id="search">
        <form method="get" id="searchform" action="http://dian.7u.cz/">

Answer 2

CSSに小さなハックを追加して修正しました：

#topsearch{
    font-size:0px;
}