在图像右侧显示文本，并在图像后保持文本保持缩进

Question

我正在寻找一个简单的WordPress页面，它将显示多个图像，以及一些描述。

此页面适用于希望将来自行更新的客户。 她不熟悉HTML或CSS。

我正在使用基于“态度”的儿童主题，虽然我认为这个问题适用于大多数主题。

我希望的布局是一个img被赋予类“alignleft”的布局，我将边缘权限附加到50px。

因此，只要文字在图像旁边，它看起来就很漂亮。但是，一旦文本低于图像，它就会回到页面左侧......就像它应该的那样，我想！ :) 只是，对于我的页面，我希望文本保持“缩进”，甚至超过图像。

踢球者是图像不是全部都是相同的高度或宽度。虽然几乎在每种情况下高度和宽度尺寸都在100px和300px之间。

这是一个视觉效果：

我正在寻求：

---

---

我得到了什么：

---

我已经考虑过的事情......

1. div的。如果只是我更新页面，div将非常容易实现。但我不希望她必须做任何HTML。 （也许我可以制作一个模板。嗯......）

2. 表。我觉得这可能是不理想的，因为图像的宽度可变。我想我可以将“images”列的对齐方式设置为“right”，然后将右侧的单元格填充设置为50px。

3. NextGen Gallery。如果我这样做，那么我就失去了在文本部分中有子弹点的能力（因为NextGen照片的“描述”部分似乎没有处理那种事情。）

4. 在.alignleft类中添加margin-bottom。但是，再次，图像将是不同的高度，段落将是不同的长度。

好的，就是这样。 如果

，请告诉我

• 我错过了我的说明中的任何重要信息

• 我只是采取比我需要的更难的方式

谢谢！ 克里斯

Answer 1

你知道，我想我在这里做点什么。 它可能不是最有说服力的解决方案。但我认为它会起作用。 我和桌子一起去了！

首先，我安装了TinyMCE WordPress插件，因此使用WordPress的可视化编辑器添加表格对任何人来说都很容易。

我已将以下CSS添加到我的子主题style.css文件中（同样，我使用了Attitude的子主题）：

.entry-content table tr td { width:auto;text-align:justify;vertical-align:top;}

.entry-content table tr td:first-child { width: 36%}

.entry-content table tr td:first-child img {width:100%;height:auto;}

我可能会做一些调整。但除此之外，我认为这样做会很好。

图像现在宽度相同。哪个好。我的朋友现在可以上传不同大小的图像（再次，高度和宽度可能介于100px和300px之间），CSS将负责格式化。好哇！