JANUARY 30, 2023
Breakpoints For Custom Screen Resolutions In Zero Block
In Zero Block, you can now configure screen resolutions for different devices. The breakpoint range is 320px to 1920px. The new feature allows you to design a perfect layout for virtually any device.
Let's look into some cases when you may need to use breakpoints in Zero Block
1
Your website is often accessed from devices with large screen resolutions such as 1920px, and you want to have full control over the elements' position on such screens.
Add a new breakpoint of 1920px and adjust the design for this specific size. You control each detail: Specify the size of the copy, shapes, and images, and arrange them with respect to the Grid Container.
In such cases, you don't need to use the Autoscale or Window Container. You can create websites for large screens even if you design on a small laptop—you'll know what the website looks like on any screen resolution.
In such cases, you don't need to use the Autoscale or Window Container. You can create websites for large screens even if you design on a small laptop—you'll know what the website looks like on any screen resolution.
2
Your website visitors use devices with non-standard screen resolutions.
You can change the default screen sizes in the settings or add new breakpoints for specific phone or tablet models, for example. You can configure a maximum of 10 breakpoints. If a default resolution—for example, a horizontal phone screen—is not relevant for visitors, it's now possible to delete it.
How You Can Combine Standard Blocks And Zero Blocks With 1920px Resolution
In this case, use fullscreen standard blocks and choose the Container Width values of 100% or 100% with 40px edge paddings. They will look well together as the content width is scaled similarly.
No Need To Use Window Container And Autoscale To Design Projects Anymore?
Technically, the new feature simplifies designing a website in Zero Block—you don't need to figure out how the fluid layout or Autoscale works and attach layouts to the Grid Container instead. But we recommend that you explore all the tools and know how to combine and use them in your work depending on the task. You can learn more in the Complete Guide To Zero Block.
How To Configure The Grid For a Custom Screen Resolution
You can adjust the grid for every new screen resolution you add to Zero Block. Choose the resolution you want → open the Artboard Settings → Zero Block Settings → Grid, and specify your own values.
See also
Page search, sorting, and bulk actions are now available.
Create a course for a large audience or publish lectures for your employees with this new feature.
