我正在尝试获得以下结果,但无法获得正确的 css - 我总是在新行上获得一个跨度,或者跨度的所有内联。
我试过弄乱 display、clear、float 等,但似乎无法让它对齐?
我可以使用 table
来做到这一点,而且效果很好......但是我认为必须有一种 css 方法来实现同样的目的吗?
<div>
<span class="button">
<button type="button">
CLICK!</button>
</span>
<span class="field">
<span>
Field 1
</span>
<span>
Field 2
</span>
</span>
</div>
.button
{
margin: 1em 10px 0px 0px;
width: 250px;
text-align: right;
display: inline-block;
}
.field
{
margin: 0.5em 0px 0px;
color: #002c5a;
}
最佳答案
您的新 CSS:在两个类(按钮和字段)和 添加 display:block;
到.field span {}
。
.button
{
margin: 1em 10px 0px 0px;
width: 250px;
text-align: right;
float:left;
}
.field
{
float:left;
margin: 0.5em 0px 0px;
color: #002c5a;
}
.field span { display:block;}
Demo 2 有更多的 css,看起来像您的示例!
关于html - 有两个跨度在一个跨度旁边排列吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20465418/