-
Posts
-
Hello,
-Question 1
I’m setting up a megamenu with 4 columns.
Each column has a small image (240x135px) and a short paragraph.
It looks good on a 1920×1080 screen, but when I resize the browser window to make it smaller (around 1200px wide), the menu gets cut on the left, showing only 3 columns and half of the 4th column width. If I downsize it even further (around 800px wide), it only shows 2 columns and half of the 3rd column. Below the 800px, it converts to mobile menu.Is there a way to make the megamenu responsive, to it adapts to the viewport?
-Question 2
On a mobile device, or when downsizing the viewport to a smartphone width, the mobile menu shows the megamenu items repeated, I mean, including the Custom item used for description. Can this behavior be changed?
Thanks in advance for your support.
Daniel
Hi danielsami!
Yes, it is responsive until the menu switches over to the mobile menu option. That is what I’m seeing on the site linked right now as well (no menu cutoff).
#2 – Can we log into the sites WordPress admin and take a look how you have the menu setup? I’m not quite sure what the exact settings you have are for the menu. You can add the credentials here as a private reply.
Best regards,
DevinHey Daniel!
Try adding this code to the Quick CSS:
.sub-menu img{ width: 100% !important; }Cheers!
JosueHi Josue,
It worked! Now the images in the megamenu decrease in size as you reduce the viewport size. Thank you.
My second question remains unanswered:
On a mobile device, or when downsizing the viewport to a smartphone width, the mobile menu shows the megamenu items repeated, I mean, including the Custom item used for description. Can this behavior be changed?
In the following private post, I’m including snapshots that explain further my question.
Thanks,
Daniel
Hi Daniel!
Try the following:
Go to Appearance > Menu and enable CSS Classes in “Screen Options”, then set a class of “noMobile” to the menu items you don’t want in the mobile menu.Cheers!
Josue
- You must be logged in to reply to this topic.