Change Menu Height For Devices - Question | JoomShaper
🎃 Halloween Sale is Live! Get 35% OFF on all plans. Sale ends soon! Get Offer
Back to the questions

Change Menu Height For Devices

PG

Phillip Gailinas

Helix Framework 4 years ago

I have a menu set to 60px in height with a background image and looks fine on desktop.

When I go to mobile, the background image resizes very nicely but the menu height stays at 60px. On the desktop, the image gets the menu buttons which is good. On the mobile device, the background image is now blank (as the menu items are in the off-canvas menu) so the image needs some text over it. Hence, a different image...

So, two problems:

  1. How do I get the menu height to change for the different devices?
  2. How can I select a different image for the different devices?

Thanks!

0
2 Answers
Order by
Oldest Newest Votes
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 4 years ago #14917

Hi there!

Thanks for your query.

You need to use media query for your different breakpoints.

The following may help you with media queries:

https://www.w3schools.com/css/css_rwd_mediaqueries.asp

And the following will help you with selector finding:

https://www.joomshaper.com/blog/which-line-of-css-i-have-to-edit-code-inspector-in-action

Best Regards

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 1 year ago #160350

Thanks for accepting the answer after such a long time :)

Have a nice day!

0