Articles on: Pages

What Is the Safe Margin and Why Is It Important?

When creating pages in GreatPages, you may have noticed a blue line in the editor. That line isn't there by chance — it is called the Safe Margin and it plays a key role in creating layouts that work properly on different devices, such as computers and mobile phones.

What Is the Safe Margin?
The safe margin defines the visible limits of the page content, taking standard screen sizes into account. Here on the platform, we work with two main sizes:

॰ Desktop: 1200px wide.
॰ Mobile: 360px wide.

The blue line that appears in the editor represents what we call the "safe margin". Everything you place inside this margin will be visible on most devices, such as mobile phones and computers with standard-sized screens.

Why Is the Safe Margin Important?
Making sure all the elements of your site are within the safe margin prevents them from being cut off or falling outside the screen on smaller devices. If you go beyond this margin, it may happen that only people with larger screens are able to see those extra elements.

How to Use the Safe Margin Correctly?
॰ Adjust the elements according to the screen size: When creating your pages, position the elements (images, buttons, texts, etc.) inside the blue line. This ensures they will be visible on different devices, especially on mobile phones and tablets, which have smaller screens.

॰ Avoid cutting off important elements: Whenever possible, keep important elements, such as headlines and call-to-action buttons, well aligned within the safe margin. You can even go a little bit beyond this blue line, but be careful — the further you go outside this margin, the greater the chance that the content will be cut off on some screens.

Align the elements correctly: It is not enough to simply place the elements inside the safe margin; they must also be well aligned. This helps create a more pleasant visual experience for the user and ensures that the page layout stays organized, regardless of the device it is accessed on.

What Happens If You Go Beyond the Safe Margin?
If you place elements outside the safe margin, they may be cut off or simply not appear on devices with smaller screens. This can harm the user experience, especially if essential elements, such as purchase buttons or important information, are not displayed correctly.

Respecting the safe margin is one of the best practices when creating pages in GreatPages. It ensures that your site is accessible and functional on a wide variety of devices, providing a consistent user experience.

Whenever you are creating a page, remember to check the position of the elements in relation to the safe margin and adjust everything so that it stays within the limits. This way, you ensure that the layout works perfectly on any screen, whether on a phone, tablet or computer.

Updated on: 08/01/2026

Was this article helpful?

Thank you!