Viewport sizes

Support
#1

website showing too big on 15" screens that are retina, but ok on desktop. Viewport doesn’t help as retina is well over 1200px which is large.

Please look at whatsnext.budgyt.com it is our staging site. thank you

#2

Hi @zpac,

Thank you for writing in, but please clarify the issue and perhaps provide us screenshot showing the issue as the site looks fine on our end.

Cheers!

#3

Apologies. Here is a side by side that shows what comes up on my 16inch retina laptop (3072x1920) vs a 15 inch 2880x1800

Screen-Shot-2020-08-12-at-9.34.25-PM
Screen-Shot-2020-08-12-at-9.34.25-PM1920×1200 97.7 KB

#4

Hi @zpac,

Can you confirm that the laptop is set to its highest screen resolution and its browser is not zoom-in?

Thanks,

#5

yes and its happening across Macs, pcs, etc… happening on multiple computers. I had to create a an alternate version of the global block with the text on the right column that was lowered in size so it was viewable. Now the view is better on the laptop but on a higher resolution laptop like mine or large desktop - its super small.

Screen Shot 2020-08-13 at 2.42.21 PM2
Screen Shot 2020-08-13 at 2.42.21 PM2960×600 405 KB
you can the difference in the text sizes between the text in the right column and the centered column in section 2. They were the same size before.

#6

Hello @zpac,

Please apply the Responsive Typography and set the Root Font Size Mode to “Stepped”. You can then set the font size in pixels for the large screen size to 14 pixels only. In your individual elements, you will have to use 1em for the texts in your column. For more details about the Typography, kindly check this out:

Hope this helps.

#7

I did it and it helped a bit but still doesn’t work 100%.Is it possible to change the default amount of the break points in the viewport sizes? Or ideally add another, 4k size within screens?

#8

Hey @zpac,

You can add a custom break-point using CSS media queries for large screens, here’s a thread Responsive breakpoints regarding breakpoints used in the theme. You can follow this thread as a guide to create your own custom break-point and adjust elements accordingly.

Here are some related links for further reading, this could help you in finding and implementing some CSS fixes:

Hope this helps!

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.