2011-02-20 9 views
1

私はGoogleのカスタム検索エンジンを使用しているウェブページを持っています。私はそれをよりきれいにしたいので、基本的に探索領域を丸くした四角形の領域の周りにラッパーを作成しました。これを達成するには、次のコードを使用しています:FORMタグはIEに望ましくない改行を作成します

<table style="height:33px;" border="0" cellpadding="0" cellspacing="0"> 
    <tr> 
    <td style="background-image:url(/leftEdge.png); height:33px; width:5px;">&nbsp;</td> 
    <td style="background-image:url(/bg.png); height:33px; background-repeat:repeat-x;"> 
     <form name="cse" id="searchbox_demo" action="http://www.google.com/cse"> 
     <input type="hidden" name="cref" value="" /> 
     <input type="hidden" name="ie" value="utf-8" /> 
     <input type="hidden" name="hl" value="" /> 
     <input name="q" type="text" size="32" /> 
     <input type="submit" name="sa" value="Search" /> 
     </form> 

     <script type="text/javascript" 
     src="http://www.google.com/cse/tools/onthefly?form=searchbox_demo&lang="></script> 
    </td> 
    <td style="background-image:url(/rightEdge.png); height:33px; width:5px;">&nbsp;</td> 
    </tr> 
</table> 

このコードはChromeでよく見えます。ただし、Internet Explorerでは、次の行にrightEdgeイメージが表示されます。 IEが改行を追加しているようです。しかし、私はそれを取り除く方法がわかりません。これまでのところ、私が試してみました:

  • をする私のDOCTYPEを変更:以下のCSSの追加<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  • form { margin: 0; padding: 0; }

を私が行うには他に何かわかりません。誰かが私にこの問題を解決するのを助けることができますか?

ありがとうございました!

+1

'form {margin:0;パディング:0; } '私のためにそれを修正します。問題を示す小さなページを作って、そのコード全体を投稿できますか? – thirtydot

答えて

2

私はので、私はCSSを使用してそれをリメイクし、DIVのテーブルfoのファンではない:

<div style="height:33px; width:290px"> 
    <div style="background-image:url(/leftEdge.png); height:33px; width:5px; float:left;margin:0; padding:0;"></div> 
    <div style="background-image:url(/rightEdge.png); height:33px; width:5px; float:right;margin:0; padding:0;"></div> 

    <div style="background-image:url(/bg.png); height:33px; background-repeat:repeat-x;margin:0; padding:0;"> 
     <form name="cse" id="searchbox_demo" action="http://www.google.com/cse" style="margin:0; padding:0;"> 
     <input type="hidden" name="cref" value="" style="margin:0; padding:0;" /> 
     <input type="hidden" name="ie" value="utf-8" style="margin:0; padding:0;" /> 
     <input type="hidden" name="hl" value="" style="margin:0; padding:0;" /> 
     <input name="q" type="text" size="32" style="margin:0; padding:0;" /> 
     <input type="submit" name="sa" value="Search" style="margin:0; padding:0;" /> 
     </form> 

     <script type="text/javascript" src="http://www.google.com/cse/tools/onthefly?form=searchbox_demo&lang="></script> 
    </div> 
</div> 

それは少し汚いですが、私はそれに役立つことを願っています。

関連する問題