我想并排对齐这三个图像,并使用带有 id 菜单的 div。
HTML
<div id="menu">...</div>
<div class="l-grid">
<ul>
<li class="l-col l-size1of4">
<div id="location">
<img alt="Tell us your locaiton" src="images\location.jpeg" />
</div>
</li>
<li class="l-col l-size1of4">
<div id="delivery">
<img alt="Choose menu to be delivered" src="images\dial\location.jpeg" />
</div>
</li>
<li class="l-col l-size1of4">
<div id="payment">
<img alt="Payment mode" src="images\dial\payment.jpeg" />
</div>
</li>
</ul>
</div>
CSS
.l-col {
float: left;
}
.l-size1of4 {
width: 166px;
}
相邻的图片必须在页面中和 div id main 之后。
最佳答案
将ul li.l-col
设置为display:inline-block
:
.l-col{
display: inline-block;
}
JS fiddle : http://jsfiddle.net/mR64t/
关于css - 如何使用 CSS 并排对齐三个图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20678031/