Question

我试图做一个文字场,一个 but子像是联合元素的一部分,这样他们就象这个(从 Chrome光 Linux起):

“Example

in 富尔顿是两个 too子:

“Example 。

Example CSS: http://dabblet.com/gist/1603701

我将这两个元素的体积定为16px,希望它们能够显示同样的水平,使19px的线形形形色色——但 Firefox子的高度为21px! 规定明确的高度,除非我缩小了字体(但不能肯定为什么如此)。

很明显,你可以就以下投入打下线-八分(见 article 和 bug report , 否则,我如何迫使这些要素成为右高?

任何建议?

Answer 1

这里的解决办法是:

<!doctype html>
<html lang="en">
    <head>
       <style>
            html, body{
                padding: 50px;
            }
            .inputWrapper{
                display:inline-block;
                font-size:16px;
                padding:0px;
                border:1px solid #000000;
                border-radius:6px;
                background-color:#ffffff;
            }
            .email{
                margin:0px;
                margin-left:1px;
                padding:5px;
                border-width:0px;
                border-radius: 6px 0px 0px 6px;
            }
            .submit{
                margin: -1px;
                margin-left: -5px;
                padding: 6px;
                border-width:0px;
                border-radius: 0px 6px 6px 0px;
                color:#ffffff;
                background-color:#D94E35;
            }
        </style>
    </head>
    <body>
        <div class="inputWrapper">
            <input class="email" type="email" value="" placeholder="email address"/>
            <input class="submit" type="submit" value="Subscribe" />
        </div>
    </body>
</html>

http://dabblet.com

Answer 2

您在表格箱上有两个不同的dding子,非常方便。

3. 改变社保局。

input[type="submit"] {
margin: 0;
padding: 6px 15px; /* Padding set 1px to high, so your getting 2px total extra space */
border: none;
border-radius: 0 6px 6px 0;
font-size: 16px;
line-height: normal;
color: white;
background: #D94E35;
}

To ;

input[type="submit"] {
margin: 0;
padding: 5px 15px; /* Now you should have even paddings */
border: none;
border-radius: 0 6px 6px 0;
font-size: 16px;
line-height: normal;
color: white;
background: #D94E35;
}

友情链接