Knowledgebase

What to do if the layout looks 'broken' on mobile devices?

Official answer from us 1 min read 18 Users Found This Useful
FAQ Bild

Sometimes very long words or extremely large images cause responsive design to reach its limits. This often manifests as horizontal scrolling or overlapping text.

Fixing the error:
  • Check word hyphenation: Long words should be manually hyphenated or the font size for mobile devices should be reduced.
  • Column settings: In AI Web Studio, check if you have activated the 'Stack on mobile' option.
  • Avoid fixed widths: Ensure blocks are set to '100% width' and do not have fixed pixel values (e.g., 1200px) that are wider than a mobile display.

Was this answer helpful?

Related Articles

What should I do if changes in the editor don't appear on the live site?

It can happen that you publish a change in AI Web Studio, but it is not visible when accessing the domain. Usually, this is due to caching...
KI Web Studio / Fehlerbehebung & Fortgeschrittene Tipps

How can I restore a previous version of my page?

Mistakes happen – maybe you accidentally deleted an important section. AI Web Studio uses the integrated WordPress revisions feature to protect...
KI Web Studio / Fehlerbehebung & Fortgeschrittene Tipps

How do I fix issues with font rendering?

If fonts don't load correctly or suddenly look like standard system fonts, there is usually a problem with the connection to the web...
KI Web Studio / Fehlerbehebung & Fortgeschrittene Tipps

Why are my images appearing blurry?

Blurry images usually occur when the selected resolution is too low for the container in which the image is displayed.Optimizing image...
KI Web Studio / Fehlerbehebung & Fortgeschrittene Tipps

How do I integrate custom CSS code for advanced designs?

Although AI Web Studio allows almost everything visually, pros sometimes want to use custom CSS to achieve very specific effects.Adding CSS:You can...
KI Web Studio / Fehlerbehebung & Fortgeschrittene Tipps