Archived topic

Different width between text and photos on a blog entry

4 replies · Started by David on November 16, 2018

Viewing posts 1–5 of 5

November 16, 2018 at 1:43 am #728709

Good morning Tom & Co,

Now I have width text customize code and it works very well. This is the code:

.single .inside-article
{
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

But... it will be possible customize only the image width?

For example, text width 700px and photos with 1000px. If it's possible... we can choose the align mode?

I attach a imatge with my idea made with Photoshop.

Example images

Best reggards,

November 16, 2018 at 1:43 am #728710

Ops! Link of images here

November 16, 2018 at 2:20 am #728743

Hi David,

The best way to achieve that is actually to leave the main container width to the width of the photo you want (so like 1000px)

Then wrap your text like this:
<div class="narrow-container>Text Content</div>

Then add this CSS to make it narrow:

.narrow-container {
    max-width: 700px;
}

Let me know if this makes sense :)

November 22, 2018 at 2:22 pm #735070

That is close, but the problem is I have too many articles to code the text. I was looking for a way to automate all of the articles in one setting. I was reading that CSS can't do this.

November 22, 2018 at 2:31 pm #735073

Hi Shaun, can you reply to your own post here?
https://generatepress.com/forums/topic/different-width-for-images-media-versus-text/

Thanks!

This archived topic is closed to new replies.

Start building better websites today.