Full Width Classic Image

[norml]

I have searched but couldn’t find the solution for my site. www.cannabispermits.com

How can I make the image full width at the top of the homepage?

[ruenel]

Hello There,

Thanks for posting in! I have checked the page and I can tell that the image is only 1200 by 450 pixels. In large screens, the maximum width is up to 1200 pixels only. If you want to display it fullwidth, please edit your page back in Cornerstone and insert the following custom css in the settings tab, Settings > Custom CSS

#x-section-1 img{
    width: 100%;
}

Be advised that since your image dimension is smaller, it will be stretched out to become fullwidth. It may not look good in some screens because it will appear blurry or pixelated.

Hope this helps.

[norml]

I added this to CSS and it seems to be the same?

[ruenel]

Hello There,

It works in my end. This is what I am seeing:

Screenshot

Please clear your browser cache or use incognito mode and test again.

[norml]

Ah yes, thank you! It appears to have made it longer horizontally too. Is there a sweet spot for resolution?

[christopher]

Hi @norml,

You can force the height to be limited. For example you can change the CSS to:

#x-section-1 img {
    width: 100%;
    max-height: 350px;
    object-fit: cover;
}

Change 350 to find the best height you like.

Thank you.