Streaming live at 10am (PST)

Need solution for multiple desktop breakpoints


I’m design a site with default desktop screen at 1920x1080. However when viewing it on larger screen (2560x1440), the text and image on hero section are too small. Is there any way I can add a new breakpoint with min-width at 1920px while keeping the design on smaller desktop size? Thank you.




Here is my site Read-Only:

Hi @MikeDao, thanks for the post. Right now the max breakpoint is 992px and higher for the Desktop viewport and there is no way to natively add a new breakpoint, see the Wishlist here:

It is possible however to alter your styles via custom css and using css media queries, here is a related post: Activate 1200px "Large Screen" media query

I hope this helps


Wouldn’t using em or % for sizing help here, rather than px?


What Sarah and Dave said. Remove the max width from your container so that your image can become larger. Add media query into your custom code for larger than 1920 screens ( @media (min-width: 1920px) { ... }) for example, and increase your fonts at that breakpoint if necessary. That should solve most of your problems.

1 Like

Thank you everyone! I added @media screen and (min-width: 1921px) to custom code then increased font size and adjusted the layout. The site looks great now :+1:

1 Like