-3

我想使用 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

将不胜感激任何帮助，谢谢。

4

4 回答 4

1

试试这个jsFiddle 例子

.x {
    float:left;
}
span {
    display:block;
}
​
于 2012-10-02T14:31:19.447 回答
0

尝试像这样制作 div 内联块。

于 2012-10-02T14:29:53.170 回答
0

将 CSS 更改为

<style>
   span {display:block;}
   div {display:inline; float:left}
</style>
于 2012-10-02T14:32:20.400 回答
0

jsFiddle

.x{
 width:50px;
float:left;
display:inline:block;
}
.y{
 width:50px;
float:left;
display:inline:block;
}
于 2012-10-02T14:36:05.723 回答