Question

我有一些文字的跨度，在它下面应该是一个textarea和一个大方形按钮，并排。文本区域和跨度之间或按钮和跨度之间应该有无垂直空间。 textarea看起来很完美。然而，按钮上面有大约15-20px的空白区域，因此它看起来比文本区域低很多，而不是很好地排列。我告诉它将填充和边距设置为0px，那么F？

<span class="notice">
Logged in as "ladygaga" (type message and hit ENTER or click SEND)
</span>

<textarea id="messagebox">
</textarea>
<button id="send">SEND</button>

CSS：

#messagebox
{
width:300px;
height:40px;
background-color:white;
border:2px;
border-style:solid;
border-color:green;
overflow:auto;
resize:none;
}

#send
{
margin:0px;
padding:0px;
font-size:14px;
height:40px;
width:50px;
}

Answer 1

此：

#send {
    vertical-align: top; 
}

现场演示： http://jsfiddle.net/YSHmE/2/

Answer 2

我使用了 vertical-align：top ，但是它仍然有空白。使用 display：block 解决了问题，没有空格。

<button>元素上面的空格是什么？</button>

2 个答案: