unaligned images and text
我已尝试输入之前问题的建议,但似乎我已经能够成功找到将这些图像与其下方的文本对齐的正确方法。
<section id="boxes">
<div class="container">
<div class="box">
<img src="./images/dayporter2.jpeg">
<h3>DAYPORT</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed
do eiusmod
tempor incididunt ut labore et dolore magna aliqua.
</p>
</div>
<div class="box">
<img src="./images/floorcare1.jpeg">
<div class="box">
<h3>FLOOR CARE</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed
do eiusmod
tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
<div class="box">
<img src="./images/janitor2.jpeg">
</div>
</section>
/* boxes */
#boxes{
margin-top: 20px;
}
#boxes .box{
float: left;
text-align: center;
width: 30%;
padding: 10px;
}
#boxes .box img{
width: 90px;
}`
你似乎有一个不必要的 div 标签。
删除'floorcare1.jpeg' img 后的 div 标签,在这里:
<img src="./images/floorcare1.jpeg">
<div class="box"> //remove this
我是一名优秀的程序员,十分优秀!