A drop down menu on mobile

  • Hello,

    I’ve just noticed that when a drop-down menu on a mobile drops down, it overlaps with the text on the slider and none are visible.

    Would it be possible to display it in a way that it pushes the slider down or to add a background color to it so that these two elements don’t overlap?

    I can see that on the other pages it works fine (a drop-down menu pushes the image down), it only overlaps on the homepage.

    Thank you in advance for your help.

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Theme Author themearile

    (@themearile)

    Hi arthurarti7

    Thanks for contacting us. We are here to help you.

    Kindly add the CSS code below in Additional CSS Box. Please go to the Appearance => Customize => Additional CSS then paste the CSS here and click to Publish button.

    @media only screen and (max-width: 992px) and (min-width: 100px) {
.navbar-header-wrap {
	background: rgb(24, 44, 84);
	background: linear-gradient(90deg, rgb(24, 44, 84) 0%, rgb(10, 77, 122) 53%, rgb(24, 44, 84) 100%);
	position: relative !important;   
}
}

    Let us know if it solved.

    Thanks

    Thread Starter arthurarti7

    (@arthurarti7)

    Hello guys,

    That worked! Thanks so much for your help and a quick response!

    Have a good day!

    Theme Author themearile

    (@themearile)

    Dear arthurarti7,

    Glad to hear it and we are happy to help you. We hope you are enjoying the Business Street theme.

    Please help us improve our customer satisfaction by writing a quick review https://www.ads-software.com/support/theme/arilewp/reviews/#new-post We would be extremely grateful.

    Please let me know if you need any further assistance..!

    Thank you for your time.

    Have a nice day..!

    Thanks

    • This reply was modified 4 years, 4 months ago by themearile.
    Thread Starter arthurarti7

    (@arthurarti7)

    Hi guys,

    Sorry, it’s me again. After fixing the problem of the overlapping drop-down menu, I can see that the text on the slider on the mobile view is pushed down a bit (in a default mode, before we click on the drop-down menu). So if someone lands on the homepage, we can only see only a bit of text. The rest of the text and CTA are pushed down.

    I removed the snippet of CSS code and without it, the text moved up again on the mobile view.

    Do you know how we can move this text up to its original position and still keep the fixed drop-down menu?

    Thank you!

    Theme Author themearile

    (@themearile)

    Hi arthurarti7

    Welcome back again, Don’t worry we are here to help you.
    I have another solution for this, hope it will work for you.

    Kindly add the CSS code below in Additional CSS Box. Please go to the Appearance => Customize => Additional CSS then paste the CSS here and click to Publish button.

    @media only screen and (max-width: 992px) and (min-width: 100px) {
body.home .navbar-header-wrap {
	background: rgb(24, 44, 84);
	background: linear-gradient(90deg, rgb(24, 44, 84) 0%, rgb(10, 77, 122) 53%, rgb(24, 44, 84) 100%);
}
}

    Let us know if it solved.

    Thanks

    • This reply was modified 4 years, 4 months ago by themearile.
    Thread Starter arthurarti7

    (@arthurarti7)

    That worked perfectly!

    Thanks so much for your support!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘A drop down menu on mobile’ is closed to new replies.