header-logo
Getting started with WixBuild your website and business with Wix. Try using our AI tools to create your website, customize templates, or hire professionals to build or enhance your online presence.
Creating a websiteRead how to use the Wix Editor and manage content on your site. Discover how to protect your visitors' privacy and make your site accessible.
Account & billingReview your account settings, manage your subscriptions and plans and understand your invoices.
Using the Wix mobile appsUse our mobile apps to run your business efficiently on the go and set up a dedicated app for your site members to stay in touch.
Connecting a domainFollow our step-by step guides to learn how to purchase, connect or transfer a domain for your site, and find out how to keep your site’s data secure.
Managing your businessGet tools to grow your business and web presence. Find the right tools for your specific needs, set up online payments and keep track of your site's analytics.
Promoting your siteLearn to make your site more visible promoting it on search engines, sending emails and running paid ads. Improve your online presence with practical tips.
Studio, Partners & EnterpriseGet the most out of your Studio or Enterprise account with advanced features that'll help you work more efficiently.
Need more help?Find solutions for site performance and technical issues, learn about issues we’re working to fix or contact us for help.
placeholder-preview-image
Wix LearnImprove your skills with our courses and tutorials.
Wix BlogGet tips for web design, marketing and more.
SEO Learning HubLearn to increase organic site traffic from search engines.
Website developmentBuild a custom site using our full-stack platform.
Hire a ProfessionalGet matched with a specialist to help you reach your goals.
placeholder-preview-image
In this article
  • Single line of text is split over two lines
  • Text and other elements are overlapping
  • Text is not aligned with other elements
  • Alignment issues with other elements on mobile

Wix Editor: Resolving Alignment Issues on Your Live Mobile Site

In this article
  • Single line of text is split over two lines
  • Text and other elements are overlapping
  • Text is not aligned with other elements
  • Alignment issues with other elements on mobile
Your site's content may not look the same across all mobile devices, as different browsers and devices use different rendering engines. For example, text elements can expand, overlap or become misaligned with other elements on certain mobile screens. 

Single line of text is split over two lines

You may notice that a single line of text in your mobile Editor is split into two lines on the live site. This can depend on the device, and may look different on different screens.
Screenshot showing text on the mobile Editor and a live mobile site.
In order to resolve this issue, simply widen the text box by clicking and dragging the handles. This only makes the text box larger, and does not affect the size of the text itself.
GIF showing the text box being expanded in the mobile Editor.

Text and other elements are overlapping

If you've added a large amount of text to your site in a single text box, and added an element on top of it, the text may overlap with other elements on your live site. This is usually seen in text that has been added to your site in the desktop Editor.
Image of text and a button both in the mobile editor and the live site. The button is overlapping the text on the live site.

To resolve the issue:

  1. Open the desktop Editor.
  2. Break up the text into multiple text boxes - one per paragraph.
  3. Add the elements between the text boxes with some space between them.
  4. Group the elements together to ensure they're aligned. Click here to learn how to group elements
Image of the desktop Editor. The text has been split into different boxes, and the button is between them.

Text is not aligned with other elements

If you have a lot of text in a single text box, it may not align with other elements on your mobile live site.
The same page in the mobile Editor and the live site. The text and vector art are misaligned on the live site.

To align text with other elements:

  1. Open the desktop Editor.
  2. Split the text into multiple text boxes - one for each paragraph.
  3. Group the text with the relevant elements. Click here to learn how to group elements
A screenshot of aligning text with other elements on the mobile editor.

Alignment issues with other elements on mobile

You may find that elements you've arranged horizontally aren't aligning as expected on the mobile version of your site.
To prevent these elements from shifting, group them together and attach them to a transparent container box

Helpmate

Hello

Need a bit more guidance?
Unlock personalized helpLog in to get the most out of Helpmate.