[peacefulbirderParticipant]

How do I make an image full-width in Cornerstone? I tried both of the following codes in the Style field for the image in the Inspector:
width=”100%”
width:100%

I want the image to go completely from side to side without showing any of the background.

[CharliePryorParticipant]

Make sure you have the following conditions as true:

1) Page Template: Blank – No Container…

2) Row settings: Column Container = OFF

Hope that helps,

– Charlie

[peacefulbirderParticipant]

Thank you, Charlie.

Where do I find the row settings in Cornerstone?

[peacefulbirderParticipant]

Never mind, I found it!

Thank you again for your speedy help.

[RubinKeymaster]

You’re welcome!

[Mark CParticipant]

I have checked all of those options/items and cannot get a full width picture. Any other tips?

[Mark CParticipant]

Something is causing images that I bring in that should be full width to be smaller than their native size, but I sure can’t find anything. The original pictures are 1920×1080, so they are plenty big enough and they look correct in Cornerstone, but when I look at the published site, they are much smaller and don’t span the entire width. I can even see when I inspect the element that it is smaller, but I can’t find the cause. Any ideas?

[Trevis BParticipant]

I’m having the same issue Mark. It’s either displaying 2/3s of the length of the actual image or I have to add it into a slider and then, the image is blurry.

[Mark CParticipant]

Just to add a bit more clarity (no pun intended), when I look at the images in Cornerstone, they are sharp and clear and span the entire width – but when I save and look at the live side, things are reduced in size and clarity.

[FriechModerator]

Hi There,

I could not replicate the issue on my end. I can make the image full-width by turning off the Column Container option of the ROW where the image is. Please provide us the site URL so we could take a closer look.

Thanks!

[tomraffeltParticipant]

Regarding full width. My image is 1250px wide but I want it to go 100%. I have done all of the above on this thread but it still crops on my monitor at 1250px. Smaller monitors are full width fine because they are less than 1250 wide. How can I get it to go 100% so on a large TV monitor it still
stretches the entire width ?
Thank you.

[Nabeel AModerator]

Hi Tom,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[tomraffeltParticipant]

Thank you so much.
http://newenglandstudio.com/drone-photography-nh-2/

[John EzraMember]

Hi there,

Thanks for updating the thread! Upon checking your site, we can add a width: 100% on the image but there are containers restricting it to go 100% of the way. We can add CSS to those, but it will also affect your other items on the page to go full-width flush to both sides. We’re assuming you don’t want that. Would yo mind separating the image to its own section/content-band so we can use CSS to help you achieve full width on larger screens. Thanks!

[tomraffeltParticipant]

Thank you so much.
Perhaps using Rev Slider might be a cleaner way to accomplish this?
Thoughts ?
Thank you.

[Author]

Posts