css - 移动 div 及其内容

Question

我想做以下事情:

最大的 Box 是一个 div，包含两个由一个小空间分隔的 img，并且在每个 img 正下方有两个小文本 block 。

问题是我已经尝试(不是开玩笑)至少 5 个小时了。

这是我的代码:

CSS:

#divPictures {
    width: 960px;
    position: relative;
    float: left;
    top: 520px;
    left: 200px;
    background:  url("../imgs/bg-body.jpg");
    margin: 0 0 0 -5px;
}

#divPictures img {
    margin: 0 0 0 10px;
}

HTML:

<div id="divPictures">
    <img src="imgs/help-out.jpg" alt="">
    <p>"TEXT HERE</p>
    <img src="imgs/what-we-do.jpg" alt="">
    <p>"AND HERE"</p>
</div>  

---

编辑:

我不能发布图片，但它是一个 block ，其中包含两张图片，一张挨着一张，下面是文字。

Answer 1

是这样的吗？快速示例，您显然可以添加额外的 CSS，或者同时向左浮动和 pad/margin 等...

#divPictures{
width: 100%;
background:  url("../imgs/bg-body.jpg");
}

.left{
width: 45%;
float:left;
}

.right{
width: 45%;
float:right;
}

.left img, .right img{
margin: 0 0 0 10px;
}

HTML:

<div id="divPictures">

<div class="left">
<img src="imgs/help-out.jpg" alt="">
<p>"TEXT HERE</p>
</div>

<div class="right">
<img src="imgs/what-we-do.jpg" alt="">
<p>"AND HERE"</p>
</div>

</div>