Question

为什么在IE6和IE7的以下代码中，p标签的顶部和底部之间会产生一个像素间隙，而不是在Firefox或IE8中？我一直在试着在powerset website创建搜索texbox 而且有趣的是他们没有IE6或IE7中的错误。我做错了什么？

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <style type="text/css">
            #sbox
            {
                overflow: hidden;
            }
            #sbox p
            {
                /*border:1px solid #dae7fa; */
                float:left;
                display: block;
                border: 1px solid red;
                width: 208px;
                padding: 0;
            }
            input#q
            {
                font-size: 11px;
                padding: 3px;
                border: 1px solid blue;
                width: 200px;
                color: #999999;
            }
        </style>
    </head>
    <body>
        <div id="sbox">
            <p>
                <input id="q" type="text" value="Search..." />
            </p>
        </div>
    </body>
    </html>

Answer 1

将float:left;添加到输入#q。这将崩溃p并摆脱差距。

p标签和输入标签之间的一个像素间隙

1 个答案: