Inkdave Posted June 6 Share Posted June 6 Hi All How can you disable hover effect on buttons? At the present it fills in black and looks terrible. I would like it to do nothing. The cursor change to a hand is enough. Secondly is there a way to set a maximum size for buttons? Again currently if I scale browser on a large screen the buttons end up huge! Any help greatly appreciated site: www.studioyoung.com Link to comment
Lesum Posted June 6 Share Posted June 6 @Inkdave To disable the hover effect and set a maximum size on the button, you can add this code in Website > Pages > Website Tools > Custom CSS #siteWrapper.site-wrapper .sqs-button-element--primary{ max-width: 220px !important; } #siteWrapper.site-wrapper .sqs-button-element--primary:hover { background: transparent !important; color: black !important; } If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. Sam Web Developer & Digital Designer ☕ Did you find my contribution helpful? Buy me a coffee? Link to comment
Inkdave Posted June 6 Author Share Posted June 6 Hey @Lesum Thanks for the reply. Disable hover works perfectly thanks! However button scaling doesn't work. If I adjust max width it just makes the button shorter. But it still scales... Any other ideas? Link to comment
Solution Lesum Posted June 6 Solution Share Posted June 6 @Inkdave If you don't want the button to scale, you can set a fixed width with this code: #siteWrapper.site-wrapper .sqs-button-element--primary{ width: 220px !important; } Switching the button design from 'Fill' to 'Fit' in the Squarespace editor should improve the button's scaling as the screen size changes. Daniel-92 and tuanphan 2 If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. Sam Web Developer & Digital Designer ☕ Did you find my contribution helpful? Buy me a coffee? Link to comment
Inkdave Posted June 7 Author Share Posted June 7 Legend thanks so much. You will see I have this animation wiggle on buttons, this unfortunately is applied universally. Is there CSS I can use to disable on "More: button? Thanks Again 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