CSS对齐textarea a

Question

我有一个textarea和一个按钮风格的链接：

__________________
|                 |
|                 |
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯  ______
                     |send|
                     ------

我想要水平对齐。

我的HTML：

<form method="post" action="">                  
    <div>
        <textarea></textarea>
        <a href="javascript:void(0);">Send</a>
    </div>
</form>

我的CSS：

textarea {
    display: inline;

    border: 1px solid #CCC;
    -webkit-border-radius: 5px;
    -moz-border-radius : 5px;
    border-radius: 5px;
}

form a {
    display: inline-block;
    margin-top: -10px;

    background: #CCC;
    padding: 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius : 5px;
    border-radius: 5px;
}

抱歉我的英文。

Answer 1

为什么不使用float属性？例如，除了当前的CSS样式之外，还要附加以下样式。

textarea {
  float:left;
}

form a {
  float:left;
}