The White Box Of Menu Sub-items Appears Choppy.
Fernando Bautista
Greetings
I have this code, which you provided in another inquiry, that fixes a menu issue on my website https://portalnews.co
/ Menu height /
div#sp-menu { position: relative !important; bottom: 13px;
}
div#sp-logo { position: relative; bottom: 13px;
}
sp-header {
background: #FFFFFF !important; height: 40px !important;
}
.sp-megamenu-parent>li>a, .sp-megamenu-parent>li>span{ line-height: 0px !important;
}
However, under the "People" separator, I have a menu item called "What to do in San Francisco, Cundinamarca?" And on a PC, it appears choppy (see image).
https://drive.google.com/file/d/1wUXmLVJNFyxPdFwOMxq37UnwFQ7pal1z/view?usp=sharing
Could you please tell me how to fix it so that when the "People" menu item is displayed, the sub-items are displayed correctly and not choppy in that white box?
Thank you in advance for your kind assistance.
Atick Eashrak Shuvo
Accepted AnswerApologies for the inconvenience.
The issue you’re experiencing is likely due to the dropdown width being too narrow, which causes the menu item text to wrap and appear choppy within the white box.
To resolve this, you can increase the dropdown width by following these steps:
- Navigate to Site Template Styles → Your Template → Template Options → Menu → Mega Menu
- Locate the Dropdown Width option
- Adjust the width according to your preference until the menu items display properly
You can refer to this screenshot for guidance: https://prnt.sc/a95P8MGkoDRY
After increasing the width, the submenu items should render smoothly without breaking into multiple lines.
Best regards
Fernando Bautista
Accepted AnswerHi Atick.
The solution worked perfectly.
Thank you so much for your kind assistance; as always, you are true professionals.
Have a great day.