[Resolved] Border around full width images on posts

[Joey]

I’m not sure if this is something that can be controlled via Generatepress, but just in case. I already have a border around my post texts and images using the following code:

.single .inside-article {
    max-width: 700px;
    margin: 0 auto;

Wordpress has an option to do full-width images on posts, that go all the way to the edges of the screen regardless of my max-width. It’s good, except that the slider cuts off the right side of the image. Is there a way I can update the above code (or add another code) so that there is a slight margin around those full width images? When I put a number for the margin in the above code, it puts all text and image to the left instead of centering it. I’m not sure why. Thank you.

I can post an example tomorrow if you need to see the page.

[David]

Hi there,

can you link me to a post where i can see the Full Width image ?

[Joey]

Sorry for not posting this earlier:

https://simipress.com/pulp-fiction-and-frank-frazetta/

On this post I have the gallery images set at full width, but it has the same effect whether it’s a gallery or not. It looks fine on mobile, but desktop is a little off.

[David]

Frank Franzetta – now thats a blast from the past – i have some of his art in books somewhere 🙂

Try this CSS:

.no-sidebar .entry-content .alignfull {
    border: 10px solid transparent;
}

[Joey]

Very cool, a lot of people know Frazetta’s art but don’t know who he is.

Hey, that CSS worked well, thank you very much. Stupid mistake, the image was getting cut because I was cropping the gallery not because of the scroll. It still looks much better with the border though, I’d been trying to figure that out for a while.

There’s a little issue with gallery captions but I’ll open another topic in case someone else has the question.

[David]

You’re welcome

[Author]

Posts