jdillagodzilla 5 Share Posted November 26, 2020 Site URL: https://tuna-ladybug-3hgy.squarespace.com/guide Hi All – Trying to code a button I designed. I've tried a box shadow but I can't find a way to create the lines to connect. password for site is Uhhuh Link to post
0 tuanphan 9,335 Share Posted December 5, 2020 Hi. Have you found the solution yet? If yes, can you share here? Thank you. You can send your question to my email to get faster answer. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 jdillagodzilla 5 Author Share Posted December 14, 2020 No, have not received a solution. Most are suggesting to use an image vs. button which is not what I want to do Link to post
0 tuanphan 9,335 Share Posted December 15, 2020 If you want this button, I can give the code You can send your question to my email to get faster answer. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 tuanphan 9,335 Share Posted December 17, 2020 17 hours ago, jdillagodzilla said: @tuanphan I would love that! Add a Code Block <a class="button tuan" href="#">Press me!</a> <style> .button::before, .button::after { position: absolute; content: ''; -webkit-transition: all .5s; transition: all .5s; } .button { display: inline-block; padding: 20px 40px; color: white; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); vertical-align: middle; font-family: 'Rubik One', sans-serif; text-decoration: none; font-size: 4vw; -webkit-transition: all .5s; transition: all .5s; background-color: #3498db; } .button::before { bottom: -15px; height: 15px; width: 100%; left: 8px; -webkit-transform: skewX(45deg); transform: skewX(45deg); background-color: #196090; } .button::after { right: -15px; height: 100%; width: 15px; bottom: -8px; -webkit-transform: skewY(45deg); transform: skewY(45deg); background-color: #124364; } .button:active { margin-left: 10px; margin-top: 10px; } .button:active::before { bottom: -5px; height: 5px; left: 3px; } .button:active::after { right: -5px; width: 5px; bottom: -3px; } </style> You can send your question to my email to get faster answer. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
Question
jdillagodzilla 5
Site URL: https://tuna-ladybug-3hgy.squarespace.com/guide
Hi All –
Trying to code a button I designed. I've tried a box shadow but I can't find a way to create the lines to connect.
password for site is Uhhuh
Link to post
Top Posters For This Question
3
3
Popular Days
Dec 16
1
Nov 26
1
Dec 17
1
Dec 5
1
Top Posters For This Question
jdillagodzilla 3 posts
tuanphan 3 posts
Popular Days
Dec 16 2020
1 post
Nov 26 2020
1 post
Dec 17 2020
1 post
Dec 5 2020
1 post
Posted Images
5 answers to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment