Question

怎么使按钮和文字排在一行且对齐

Answer 1

我们通常选择的方法是将button 和文字分别置于一个<span>中。因为<span>在未设置 display:block的时候是不会想div那样自动换行的，因此button和文字很自然就排成一行了， 而且两个span中的文字会自动对齐。代码如下：
Html代码
<style type="text/css">

.long-btn {
height: 40px;
width: 100px;
text-align:center;
line-height:40px;

background: url(img/mail-tpl-view.gif) no-repeat;
font-size:20px;
}
</style>
Html代码
<div>
<span class="button-span">
<a class="long-btn" href="##">大按钮</a>
</span>
<span class="text">
小文字
</span>
</div>

Answer 2

我们通常选择的方法是将button 和文字分别置于一个中。因为在未设置 display:block的时候是不会想div那样自动换行的，因此button和文字很自然就排成一行了， 而且两个span中的文字会自动对齐。代码如下： Html代码Html代码

大按钮

小文字
我们通常选择的方法是将button 和文字分别置于一个中。因为在未设置 display:block的时候是不会想div那样自动换行的，因此button和文字很自然就排成一行了， 而且两个span中的文字会自动对齐。代码如下： Html代码Html代码

大按钮

小文字