Texts on the site are superimposed on each other
The problem arises because different devices and different browsers may render text slightly differently, which can affect the height of the text (and, as a result, the overlap of the text). To resolve this issue, you can follow these guidelines:
1. Do not use 0 for Line Height for fonts in the Styles menu. Here "0" means "normal" and may be interpreted differently on different devices and different browsers. For example, if you use a font size of "16", then the line height could be around "19-20", which would make the text more readable.
2. Don't forget to set the text style in the text widget. Double click to edit the text, select the text and see what is selected in the text editor's left dropdown.
3. Avoid creating very large text widgets (containing a lot of text). If you have one, just try splitting it into multiple text widgets. Even though you have followed recommendations (1) and (2), some devices and browsers may continue to display text slightly differently. You probably won't see the difference in small texts, but when there are large text blocks on the site, the problem can become more obvious.
4. Use standard Google fonts which are supported on most devices:
- Roboto
- Open Sans
- lato
- Slabo
- Oswald
- Source Sans Pro
- Montserrat
- Raleway
Some default fonts may not be supported on different devices. They automatically change the font to a different one when you browse the site.