My website is almost done, however, I’ve noticed that at large screen sizes, everything gets a bit weird.
For example, I’ve set scaling text to be ‘30 - 98’ but it doesn’t stop at 98. So what happens is as the screen size gets bigger, all the text gets monstrously large.
What I’d like to do is make a ‘2100px+’ breakpoint and set everything to a fixed width at that breakpoint so that the website doesn’t scale out of control.
However, when I do that, it immediately makes that breakpoint my ‘primary’ breakpoint, and all the changes then cascade down - which means I’d essentially have to remake my whole website across all breakpoints.
Is there a way to do this without having to redo my entire website?
Yes, I have the same issue. I`m a starter and I just adjusted my screens for the default breakpoints and I added a new one for a higher resolution as I noticed that my laptop is with much higher resolution and when I started resizing the texts font and buttons, etc. everything else became a mess and I have to resize everything from scratch (:
Curious to learn more about what drove the decision to add a larger breakpoint? Is it more you wanted to control the layout on larger screens/stop things growing too large or something else?
Setting a “max-width” for pages is coming soon, and will stop things growing past the max-width
Side note - I guess this is something we all do only once . I know I did this once or twice when working with responsive design. Took me a little while to remember everything cascades down from the largest breakpoint
. I know I did this once or twice when working with responsive design. Took me a little while to remember everything cascades down from the largest breakpoint