Need Full Width Image

[szerby]

I followed all the advice here:

Section image full width

The image is still not dynamically full width of the browser.

GamersDigital

top image below the header

[jade]

Hi there,

I have just checked your site and the top image below the header area seems to be responding correctly to the screen width adjustment and it shows fullwidth:

In case we missed what you are trying to point out, kindly provide us more details so that we can give you some suggestions.

Thank you.

[szerby]

Does not do that for me in Chrome OSX 65. Strange. What browser are you using?

[Prasant]

Hello @szerby,

Thanks for updating the thread.

Another support staff here. I tested the website on Mac using Google Chrome and image seems to be adjusting fine. Please see screencast. https://cl.ly/0c3l2r0t1k2N

Thanks.

[szerby]

Is there a maximum width limit? I have a 4k monitor. The image is 1920 wide on the server, but after the browser gets over 1536 px wide the image no longer scales bigger.

[rad]

Hi there,

Responsiveness only applies if the container is resized or getting smaller than the content, and the content respond to that dimension.

If the container is bigger than the content, then there responsive behavior isn’t going to happen.

Plus, the layout max width is just 1200px, if the screen is greater than that, then it’s just going to center. If you wish to override that limit, then please add this CSS to your global custom CSS,

.x-container.max {
    max-width: 100%;
    width: 100%;
}

But it’s not going to be looking good. Again, if your image is smaller than the screen, then it’s not going to fill the entire width. It will only respond as the container or screen gets smaller. OR, you can override that too,

.x-img img, .x-img{
width: 100%;
max-width: 100%;
}

Thanks!