Mobile: Text Overlap and Image Overlap
The main page header text overlaps when switching to mobile, and the logo images also overlap farther down the page. How do I resolve this problem?
- Thank you
The main page header text overlaps when switching to mobile, and the logo images also overlap farther down the page. How do I resolve this problem?
Comments
Edit - I was able to fix the images by adding new elements. It appears the image boxes were too small for my images, which was causing the overlap. That said, how do I fix the image box sizes for future updates if this happens again?
Hi,
It is hard to tell anything without seeing this problem live.
If this happens again, please let me know, and we will take a look.
Best regards
I was able to resolve the issues. The first issue was an element used more than once, so global CSS didn't fix it. In this case, any background images I had would overlap. The fix was to set them as regular images rather than background images, or add images to text boxes. The second issue was from the BeTheme update, which on older themes seems to cause some of the boundary boxes on images to resize. In this case I just recreated the images. The third issue was rendering on mobile devices (text overlap due to the bounding boxes being too small to mange the EM fonts). Since the main site was set to EM, some creative CSS reset the EM to 4.5 for mobile, and it fixed the issues.