css - 在wordpress的列中显示图像和文本

Question

我正在尝试在 wordpress 中创建一个 2 列布局，左侧是图像，右侧是文本。这需要最大宽度为 600 像素，图像将全部固定为 250 像素宽和 142 像素高，我将在下面重复图像/文本，如本网站中所示 http://housemusicpodcasts.co.uk/latest-podcasts/

我所有的尝试都导致文本刚好出现在图像下方。我希望能够在不需要更改核心文件的情况下使用 html/css。

编辑:好的，我有这段代码，但它没有正确对齐，有什么我需要更改的想法吗？

<div class="pod">
<div class="singleblock">
<div class="wp-caption align:left;" style="width: 250px;"><img title="TEST" alt=""       src="http://www.djdavestewart.com/site/wp-content/uploads/2013/04/test.jpg" width="250" height="142" hspace="5" vspace="5" />
<p class="wp-caption-text">TEST CAPTION</p>

</div>
<p>TEXT HERE</p>
<p style="text-align:right;">Read More....</p>
</div>
</div>

<div class="pod">
<div class="singleblock">
<div class="wp-caption align:left;" style="width: 250px;"><img title="TEST" alt="TEST" src="http://www.djdavestewart.com/site/wp-content/uploads/2013/04/test.jpg" width="250" height="142" hspace="5" vspace="5" />
<p class="wp-caption-text">TEST CAPTION</p>

</div>
<p style="text-align: left;">TEXT HERE</p>
<p style="text-align: right;">Read More....</p>
</div>
</div>

CSS

.pod p {
margin: 0px;
padding: 0px;
float: left;
clear: right;
}

.singleblock {
float:left;
clear:left;
margin-bottom: 10px;
}

任何指导将不胜感激。

加里

Answer 1

对于每对图像/文本，将它们放在一个 div 中。在这个 div 上放一个类，然后使用这个 CSS

.yourdive img{
  float : left;
}