Mobile version issues

Support
#1

Hello, most of the site is looking okay when I view on mobile, however there are a couple issues.

Hompage: https://chicholidayboutique.com

-The 2nd text in the header doesn’t resize for mobile.
-The footer menu get cut off.

https://chicholidayboutique.com/discount-luxury-hotels/

  • The headline (Luxurious Resorts & Accommodations) doesn’t resize for mobile view.
  • Some of the placement of images and text are a bit off.

Could you advise as to how I can fix this?

#2

I was able to fix the header text on the homepage, so it now resizes for mobile. However I do have another question. In the footer menu you can see the page “Charity Certificate” is a drop-down from the Accommodations tab in the menu. I can’t seem to figure out how to drop down from the top menu. Help please! :slight_smile:

#3

Hey @TantraFitness,

Glad you’ve figured out the header text.

Regarding the Footer Dropdown, it’s not possible to drop it down because there’s no more space at the bottom. You will need to add space at the bottom by adding a bottom margin to your Navigation Inline or Container. Just take caution that your container’s height must not exceed your footer bar’s height to avoid a double scrollbar in your page. You can also set your bar’s height to auto.

Hope that helps.

#4

Hi I don’t think I was clear. Let me clarify.

Header Menu issue: The page “Charity Certificates” is not showing as a drop down from the Accommodations tab. How do I get this page to show up. I went to Appearance>Menu and place Charity Certificates as a sub menu under Accommodations. It IS showing up on the Footer Menu, but ISN"T showing up on the menu at the top.

Footer menu: on mobile it gets cut off and doesn’t scroll left or right or resize. How can I optimize the footer menu for mobile?

And for this page, how do I optimize the images and text for mobile? https://chicholidayboutique.com/discount-luxury-hotels/
Specifically…

  • The headline (Luxurious Resorts & Accommodations) doesn’t resize for mobile view.
  • Some of the placement of images and text are a bit off.
    Please see the images I sent in the first note.
#5

Hello @TantraFitness,

For your header menu issue, please make sure that your top margin of the dropdown is not a negative margin.

For your footer menu, please insert navigation inline which is you already have right now and a navigation collapse element. The navigation inline should only be displayed for desktop screens and the navigation collapse with be for smaller screens. You can simply hide/show element for specific screens by utilizing the “Hide During Breakpoints” option which you can find in the “Customize” tab in the element settings. For more details, please check this out: https://theme.co/apex/forum/t/hide-during-breakpoint-explained/17378

And to make sure that you headlines will resize in smaller screens, please make use of the responsive textand manage it in Settings > Responsive Text. To know more about responsive text, please check it from our knowledge base here:
https://community.theme.co/kb/shortcode-walkthrough-responsive-text/
http://demo.theme.co/integrity-1/shortcodes/responsive-text/

Hope this helps.

#6

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