Blog post with full screen image

Support
#1

Hi,
I’m using this CSS code to resize and center article text but I would like to have full screen images.

.single-post .x-main.full .entry-wrap .entry-content {
width: 60%;
font-size: 18px;
margin-left: auto;
margin-right: auto;
line-height: 1.5;
}

With this code also the images have a 60% width. How can I maintain the size of the text and obtain a full screen image?

Thanks

#2

Hi Luigi,

Thank you for reaching out to us. Your code will only effect the content of the post and the image should be fullwidth unless you’ve added the image in the content itself. Please make sure to upload the image as a Featured Image to have it fullwidth.

image

Hope this helps!

#3

I’m sorry but that’s what I’m trying to do. I want the images in the content to be fullwidth, not the featured image.

Thank you so much!

#4

Hi Luigi,

Your site seems to be under construction, please provide us a direct post URL and login credentials in a secure note so we can take a closer look.

Thanks,

#5

Thank you!

I’m using this CSS in order to resize the width of the blog posts.
I want only the text to be resized, but with this code the whole blog posts, including the images are resized.

I want the images in the blog posts to be full width and the text to be 60% smaller.

I need to modify this CSS that i’m using in order to do that.

CSS I’m using:
.single-post .x-main.full .entry-wrap .entry-content {
width: 60%;
font-size: 18px;
margin-left: auto;
margin-right: auto;
line-height: 1.5;
}

Sorry and thank you

#6

Hello Luigi,

When you insert an image in the post content, the maximum image width would likely be the same as the width if the entry-wrap container. If you want to override this, you may need to use this code:

.single-post .x-main.full .entry-wrap .entry-content {
  width: 60%;
  font-size: 18px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.5;
}

.single-post .x-main.full .entry-wrap .entry-content img{
  width: 100%;
  margin-left: 20%;
  margin-right: 20%;
}

I am not sure if this will work in the stack that you are currently using. If this does not help, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password
​
To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Regards.

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.