0

跨度不会扩展到文本输入的高度，我只是希望它们具有相同的高度。不知道为什么不展开

代码 - http://jsfiddle.net/8Jxsd/

input{
font-size: 28px;
border: none;
margin: 0;
}
#searchbox{
font-family: 'Source Sans Pro', sans-serif;
outline: none;
font-size: 18px;
margin: 0 auto;
padding: 5px 0 5px;
-webkit-border-radius: 5px;
border: 1px solid #000;
background-color: #FFF
}
#searchinput{
padding: 5px;
-webkit-border-radius: 5px;
-webkit-border-top-right-radius: 0;
-webkit-border-bottom-right-radius: 0;
-webkit-box-shadow: none;
}
#searchgo{
padding: 5px;
background-image: url(images/arrow.png);
background-repeat:no-repeat;
width: 40px;
background-position: 0 -1px;
-webkit-border-radius: 0;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-webkit-box-shadow: none;
text-indent: -500em;
}
4

3 回答 3

0

用规则替换font-size: 28px;选择器input {}中的规则font-size: inherit;

于 2013-06-08T11:23:29.177 回答
0

display:inline-block;与span类一起使用

#searchbox{
    display:inline-block;
}

Js小提琴

于 2013-06-08T11:26:36.213 回答
0

<span>默认情况下是一个内联元素。通过 display:inline-block; 将内联元素更改为块元素；

内联元素显示在父元素的同一行，但每个块级元素将出现在具有自己宽度和高度的下一行。我们需要跨度在同一行和块中，以便您可以使用 inline-block 属性进行显示，以便在同一行中跨度将具有自己的宽度高度。

于 2013-06-08T11:48:29.227 回答