Question

怎么设置css,把放在一个div中的图片横着排列

.counter {
padding-top: 0px;
min-width: 315px;
}
.digital {
font-size: 36px;
font-weight: bold;
font-family: Verdana, Arial, Helvetica, sans-serif;
width:67px;
height:67px;
background:#000;
border:1px solid #888888;
}上面的为CSS样式，
<div class="counter">
<div class="digital">
<span style="height:67px; line-height:67px; display:block; color:#FFF; text-align:center">1</span></div>
<div class="digital">
<span style="height:67px; line-height:67px; display:block; color:#FFF; text-align:center">2</span></div>
<div class="digital">
<span style="height:67px; line-height:67px; display:block; color:#FFF; text-align:center">3</span></div>
<div class="digital">
<span style="height:67px; line-height:67px; display:block; color:#FFF; text-align:center">4</span></div>
</div>
现在的显示为竖着的，怎么改为横着呢？

Answer 1

在digital类名里面加个 float:left;

追问

谢谢，不过我还想问一下，我的图片现在是在横着的一行的最左边，你知道怎么设置，一起移到中间或者右边吗？

Answer 2

div img {
position:absolute;

top:0px;

}

Answer 3

span 加 float:left;

这种情况你应该用 ul 而不是 div：

<ul class="counter ">
<li class="digital">图片或文字</li>
</ul>

追问

为什么用ul和li更好呢？

追答

一言难尽，百度：html语义