[RadModerator]

Hi Janih,

I just checked and it’s full-width on mobile, confirmed it by checking the CSS compared to what’s discussed above. Would you mind providing a screenshot of what you’re currently getting?

And please clear your mobile browser’s cache.

Thanks!

[janihParticipant]

Hi Rad,

I meant same kind of scaling than on wptavern.com. If you check that on a desktop browser and start resizing the window narrower you can see how the background image disappears first on both sides and only after that it starts to scale the content and sidebar. That way the content area keeps maximum width as long as possible.

Currently on my site it starts to scale down the content area while there is still background visible on both sides.

[JoaoModerator]

Hi Janih,

I believe I understood what you mean, but I really don´t see your website behaving any difference from wptavern.

On Both websites your background image is the first to scale down then the content and sidebar.

Can you explain in details where you are noticing the differences? Maybe provide us a screenshot?

Thanks,

Joao

[janihParticipant]

Hi Joao,

yes, if the browser window is very wide then it scales the background first. You can measure the content width when browser is 1400 px wide and then again when browser window is 1280 px wide. Then you can see that the content area is narrower than originally and there is still background visible on both sides.

[RupokMember]

Hi there,

Thanks for updating. Currently fullwidth is triggering in 1170px on your site. DO you want to make it on 1280px or another? Let’s add this CSS under Customize > Custom > CSS :

@media (max-width: 1280px)
.site, .x-navbar.x-navbar-fixed-top.x-container-fluid.max.width {
    width: 100%;
}

Let’s change the value to another if needed.

Cheers!

[janihParticipant]

Hi Rupok,

thanks for your help. I know how to change that full width triggering value. I would have liked to achieve same kind of responsive scaling than on wptavern.com. But if it’s difficult I can live with the current full width implementation

[Rue NelModerator]

Hello There,

Thanks for the updates! Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your post. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (a link to a similar example site would be very helpful, or perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

Thank you.

[janihParticipant]

Hi,

If you check wptavern.com on a desktop browser and start narrowing the window you can see that the content and sidebar doesn’t scale until the background is gone from both sides. I would like to achieve the same effect. So, no scaling of content area as long as there is background image visible on the sides.

On my site the content area is 1174 pixels wide. If you look at it on a browser window that is 1200 pixels wide then the content area isn’t anymore 1174 pixels. However, it could be because 1200px > 1174px. There is the background image that is wasting space. I don’t want to make the content area wider but to achieve same effect than on wptavern.com

Thank you!”

[RadModerator]

Hi there,

I understand that, but that’s how your current box layout works. It only starts responding if your layout width is the same as browser width when resizing. Then the columns (content, sidebar) began collapsing at 979px width of the browser. Which is, the standard breakpoints of X theme and any theme that utilize breakpoint for tablets.

Your ideal website has different breakpoints.

Thanks!

[Author]

Posts