My Site Looks Different on Other Devices and Screens

Elements on your live site align with other elements. Each web browser renders text differently, which can sometimes cause elements below a text box to align higher or lower depending on the browser. 

To resolve this issue, you can set the height of your text boxes so that elements below them align the same way on different browsers.

Learn More

Different browsers and devices use a variety of rendering engines which may result in minor differences in the way your font appears.

If you have text that appears on multiple lines (instead of one) in some browsers, expand your text box so that it's wider than needed. This provides room for the text to expand without rendering on the next line. See below:

Your browser displays a horizontal scroll bar if it detects an element on your site is located to the left or right of your browser window. 

To remove the horizontal scroll bar, move all your content within the vertical gridlines in your Editor or use responsive elements.

Tip: If you cannot find the element, click within your Editor and press Ctrl + M on your keyboard (Cmd + M on Mac) until you've selected it. 

Elements placed outside the vertical gridlines will be cut off on tablets and smaller screens. We recommend placing important content inside the vertical gridlines to make sure they're visible on all screens.

You can also use responsive full-width elements on your site (e.g., strips, columns, galleries) to make sure your content remains within view.

Learn More