I have an image with padding and a border.
It looks fine in the cornerstone builder. See here: http://nimb.ws/2oFSXV
But when viewed on a live page the image gets reduced to a really small size. See live page here: https://elementpaints.com/submit-review/
Any ideas what is happening and how to fix it?
It seems like a bug with Cornerstone.
Hey,
Ensure that you set these settings:
All the images must have the same width and height.
Clear your cache after these changes.
If the issue persists, provide to us your WP credentials in a secure note.
The images do not have the same width and height. Padding is provided to each image to make each button look the same size. Why would the image width and height be a problem? It looks fine inside cornerstone so it should look the same on the live page… that’s the whole reason for having a visual editor like cornerstone… the editor should match the live version.
Hi There,
I’ve fixed the issue by added this CSS:
width: 100%;max-width: 250px;
Cheers!
Thanks for that CSS patch.
But why did cornerstone not natch the live site? Is it a bug that will be fixed?
Hi There,
Your padding CSS is based on the content width.
The live site and the cornerstone preview have the different width so it’s not correct.
Regards!
The page width is exactly the same when the editor tray is hidden. So therefore it should match the live site.
The whole point of having a visual editor is so that the editor matches the live preview. There it sounds like a bug that should be fixed.
Hi there,
Sorry for the confusion, yes, the preview and the live page should be equal in terms of display. What we meant is that using percentage as spacing has effect in size when it’s viewed per each device with different sizes, hence, different views.
But I checked and I don’t see any difference from cornerstone preview and the live page at all (except the visible gap element). Maybe it’s just in your end? I don’t see that fix either, have you removed it or moved on another page? Please check the video of what I’m seeing.
And as you can see from the video, for the change I made to take effect, I had to PURGE all cache. Please remember that cache is the opposite of change. Which is why the cache is only recommended once you’re done developing your site.
That’s the reason why you’re seeing it differently and it’s not a bug.
Thanks!
The reason you can’t see a problem now is because I changed the images. I made them all the exact same size and width to avoid this problem. Better to do that then continually tweaking CSS.
It has nothing to do with a cache purge, I am well aware of that.
The bug in cornerstone is still a bug. I just figured out a way around it. I thought you would like to know this to improve your product.
Viewing cornerstone on my latop with the editor or the live version will have the exact same width. I did not change the viewport or decive width. Therefore how it displays on the editor should match the live version.
Hi there,
We love to see the bug and have fixed it, would you mind setting it up again? I could only forward this to our developer if I can gather some information about it. Plus, I can’t reproduce that in my installations.
And I didn’t say you changed your viewport, it’s just our assumption since we don’t know initially what you’re getting. Now that you mentioned that, then please ignore that and let’s move on with the troubleshooting 
Information is very important so we can move forward and enhance the product, hence, which is why I’m very eager to find out what’s you’re getting. Plus, I’m another support so I can’t confirm any of that as you already changed that.
Thanks for understanding.
I’m having a similar issue.
Hey Nathan,
This is a very old thread and the cause of the issue might be different in your case so here’s what we need you to do:
Thanks.