AndrewDurand Posted July 30, 2022 Share Posted July 30, 2022 Site URL: https://oriole-panda-2fhm.squarespace.com/ Hi, I am trying to have a hover box effect in my mega menu that is similar to the effect of the regular navigation section. The mega menu is pulling a regular section, so the items are not ''navigation items'' but regular text box items. I have gotten part of the effect using the code below, but I would like the background box to be a bit wider top to bottom around the lettering WITHOUT it displacing the text top-bottom. The links from the text should be clickable anywhere on the background box. site url: https://oriole-panda-2fhm.squarespace.com/ PW: dialogue CODE: .sqsrte-small:hover{ a { color: white !important; padding-left: .5em; padding-top: 0; padding-bottom: 0; } } .sqsrte-small:hover { background: #112742 !important; } any help is appreciated 🙂 Andrew Link to comment
Beyondspace Posted July 30, 2022 Share Posted July 30, 2022 6 hours ago, AndrewDurand said: Site URL: https://oriole-panda-2fhm.squarespace.com/ Hi, I am trying to have a hover box effect in my mega menu that is similar to the effect of the regular navigation section. The mega menu is pulling a regular section, so the items are not ''navigation items'' but regular text box items. I have gotten part of the effect using the code below, but I would like the background box to be a bit wider top to bottom around the lettering WITHOUT it displacing the text top-bottom. The links from the text should be clickable anywhere on the background box. site url: https://oriole-panda-2fhm.squarespace.com/ PW: dialogue CODE: .sqsrte-small:hover{ a { color: white !important; padding-left: .5em; padding-top: 0; padding-bottom: 0; } } .sqsrte-small:hover { background: #112742 !important; } any help is appreciated 🙂 Andrew Do you mean increasing this space for each item? Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio pluginIf you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you Link to comment
AndrewDurand Posted July 30, 2022 Author Share Posted July 30, 2022 yes, I would like the dark background to be increased, but not displace the text around it. Is that possible? Thanks. Link to comment
Solution tuanphan Posted July 31, 2022 Solution Share Posted July 31, 2022 14 hours ago, AndrewDurand said: yes, I would like the dark background to be increased, but not displace the text around it. Is that possible? Thanks. Try adding to Design > Custom CSS .wm-mega-menu-item p { padding-top: 5px; padding-bottom: 5px; padding-left: 5px !important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment