Issues with the menu, and aligning text with images

Hi, I ran into a few issues and was hoping to get your support on them.

  1. On ( learn.mobileodt.com/welcome ) page on the mobile’s browser, the top of the menu is partially hidden as you can see from the attached photo / same issue appear on some other pages

  2. On ( https://learn.mobileodt.com/eva-for-cervical-cancer-screening/ ) page on the mobile’s browser, the whole header and menu seem very messy or broken, as you can see from the attached photo.

  3. On ( https://learn.mobileodt.com/eva-for-cervical-cancer-screening/ ) page on the mobile’s browser, The text isn’t aligned properly with the check mark photos. you can see from the attached photo. I want the text to be indented, and not under the check mark and with large space from the first row!

Hello There,

Thanks for writing in with a very detailed information.

1.) This issue happened because the z-index of the 3rd bar is the same as the second bar. The 2nd bar should have a higher z-index than the 3rd bar. It means that the 3rd bar must have a z-index of 9997 instead of the default which is 9999.

2.) This is because of your caching. You have Cache Enabler and W3 Total Cache which is an overkill. Please clear your plugin caches or temporarily deactivate caching plugins. They are best to turn on when you are finish developing your site.

3.) This is because you have 4   and a space character. If you remove the 4  , then it should resolve the issue.

Hope this helps.

Thank you so much for your help and detailed answer, just one last question regarding the third point?
How do I delete the &nbsp and make the text indented, and not under the check mark and with large space from the first row ?

HJi,

You can add a margin using inline style to your span tag.

eg.

<span style="display:inline-block;margin-left:10px;">Did your users receive an email to activate their account and choose a password?</span>

Hope that helps

Hi, Thank you but it didn’t really work ? Is there anything else I can do ?

Hi there,

Instead of separating each line in a different text element, try using the Classic Feature List element instead and set the Graphic to Image then set it as the check mark image then set the Connector Color to #fff.

Leave the list item title blank then set the text to the content field.

Hope this helps.

Hi, thank you so much
it’s all good now

You are most welcome!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.