Support for larger/custom media queries/breakpoints

@thesergie any ideas guys?

1 Like

The div should cascade down automatically if set to a hard pixel number. What are you editing in the tablet that affects the laptop? The class for the div that you added 1140px to? That seems odd. Are you trying have the website stay 1140px for all devices?

1 Like

@thesergie the div cascades down from laptop version fine. Laptop version is set to a 1140px div. When I go to tablet & phone from laptop view 1140px cascades correctly. When I modify the 1140px div in tablet & phone (obviously to make it look good on those devices) the changes cascade up - changing the laptop view. Is there a way to have 1140px on laptop, but accurate responsive design for other devices?

1 Like

Todd that seems really odd. Can you post your troubleshooting link or subdomain so I can see what is going on? I just can’t see how that can be happening.

1 Like

@thesergie sure - (redacted for now :slight_smile:
Site is still in flux, so most obvious place to view 1140px is on the “events” tab and events > view event button > rsvp page.

1 Like

Seems to work as expected for me. I set the Div 1140px class to width:100% in the tablet and it stays like that in the tablet. It doesn’t affect the 1140px width in the laptop.

Tablet:

Laptop:

I personally think it’s not a great idea to use this 1140px div method. You make it more spacious for bigger screens but there’s a window of screens that cut off the content (like 960px). I recommend using this method to “activate” that media query:

1 Like

@thesergie thanks for that - I didn’t know about changing the tablet class to width:100% - I will play around with the 1200px “large screen” media query and see if I can get that to work s a better solution.

1 Like

Hi guys is there any update on wide sites and when we’ll get that functionality?

1 Like

It’s one of the next features we’ll be working on this month. Thanks for your patience!

6 Likes

This still coming? @thesergie I know this month now means 8 months ago :slight_smile:

1 Like

@jaidenraleach Have you tried what @pingram3541 suggested with defining your own div size and using that as a container?
I just did a project using 1200 px width.

Created a section, added a div with class 100% width auto each side, max width 1200.

Then you just work inside the div as if it’s a container. I managed to get everything inside the div to cascade down the screen sizes. I tried @thesergie 's suggestion with adding a code to make everything appear wider on screens 1200+. But it’s hard to design this way, as just making it larger doesn’t alway make your site look the way you want it to look.

It would be great to have the 1200 px container width made available soon.

3 Likes

@angela thanks! I have done that in the past when needed and it’s a great work around :smiley: would just be nice to have it built into webflow natively, as you mentioned.

2 Likes

Adding that I would love to see a breakpoint for desktop monitors.

– We have one website that is 92% desktop users
– I want to prototype a web application that will only be run on desktops and needs to use a lot of screen real estate

You guys rock!

1 Like

It’s been almost 3 years, and we still have to hack 940px width. Guys?

2 Likes

I’d be more than happy to see an additional viewport added. I understand there’s a few problems to solve but you guys managed to keep the UI clean and user friendly so far, so I am confident it will still be the case. One thing that is somehow related to this is that in order to have more control on responsive designs, I’d really like to be able to set the font size to a percentage relative to the size of the container (and not to the font size in the body), otherwise it’s practically impossible to maintain the proportion when you have a two columns layout with text on one column and image on the other one. The same way that the image is scaled up/down depending on the space available, so should the text (not just the text container but the text size, otherwise proportions are lost). That would also allow to make copy more readable, having control on the amount of characters per line: FlowType.JS — Responsive web typography at its finest: font-size and line-height based on element width. | Simple Focus

1 Like

Is this ever going to happen? It has supposedly been in the works since 2013.

2 Likes

Hey, guys, so what about that? I really need more resolutions than 940px for my job to make websites accuratly.
It is time now to make websites up to 2560px or more, 940px is not enough at all

1 Like

Just want to put in my vote for this being added as soon as possible. It is a must have for me!

2 Likes

I don’t really know if this is necessary as much with the handles on the side of each media query that allow you to change the width to all sizes in between each major media query.

1 Like

If you’re making website using vw units at 2560 it looks too big, or if on 2560 it looks ok then on 1280px it looks too small.

Anyway there are much more popular screen resolutions then 3 years ago, and it is OK to have an opportunity to customize website look on every resolution you need and want.

1 Like