Question

我想使用DIV和SPAN将文本对齐如下，但不能：

ABC1 ABC2
XYZ1 XYZ2

我的内部CSS HTML如下：

<html>
<head>
<title> This is Page Title </title>
<style>
 span {display:block;}
 div {display:inline;}
</style>

</head>
<body>

<div class="x">
<span class="a">ABC1</span>
<span class="a">XYZ1</span>
</div>

<div class="y">
<span class="b">ABC2</span>
<span class="b">XYZ2</span>
</div>

</body>
</html>

及其输出如下：
ABC1
XYZ1
ABC2
XYZ2

非常感谢任何帮助，谢谢。

Answer 1

试试 jsFiddle example

.x {
    float:left;
}
span {
    display:block;
}

Answer 2

尝试制作div inline-block like this。

Answer 3

将CSS更改为

<style>
   span {display:block;}
   div {display:inline; float:left}
</style>

Answer 4

jsFiddle

.x{
 width:50px;
float:left;
display:inline:block;
}
.y{
 width:50px;
float:left;
display:inline:block;
}

DIV和SPAN - 阻止和内联qus。请帮忙

4 个答案: