图片外的帖子内容Wordpress Post

Question

我尝试修复，以便我在帖子中上传的图片位于帖子内容宽度之外。

实际上我不知道是否有解决方案，但我已经看过几个拥有它的wordpress博客。

以下是我想要的示例： http://demo.themefuse.com/aesthetic/garance-dore-is-launching-a-podcast-in-partnership-with-the-outnet/

如果您在帖子中看到第一个图片，则其比帖子内容更宽。

有没有解决方案？

Answer 1

我认为这不是一个特别的WP问题，但它可能会影响解决方案的细节。您提供的示例中的方法在非图像区域上使用左右填充。默认的WP编辑器不会像在示例中那样将区域拆分为多个div。

你没有提供你的HTML，但是，我会接近像......

.post-content {
    box-sizing: border-box; // so that padding is part of the box area.
}
.post-content > * { // select all elements within your content area, or specifically things like p, h1, h2, etc.
    display: block;
    padding: 0 150px; // you could use padding using px, vw, etc.
    width: 70%; // OR use width. compare this with to the image below
}
.post-content > img:first-of-type { // this might need to change to something to select the first image, or all images
    width: 100%; // unlike the other elements, the image goes full width
    height: auto;
    padding: 0;
}