Smartyart Posted September 4, 2020 Posted September 4, 2020 Site URL: https://cat-wedge-xh9c.squarespace.com/programs I'm trying to create a list of the programs and services that we offer at the Community Center where I work. We're a small non-profit which is why I am doing 20 jobs and learning them as I go. I want two buttons to appear inside each accordion drop-down. One that says "Learn More" and one that says "Volunteer". I've figured out how to get the button in there. I've even figured out how to make it look decent, but it is changing EVERY link/button on my page when I do that and making them all look crazy. Here is the code I was using. I don't even remember where I found it. (The button won't link to google, obv, I just haven't gotten very far yet.) The password to the website is: bft2020 <style> a:link, a:visited { background-color: #00B0B9; color: white; padding: 14px 25px; text-align: center; text-decoration: none; display: inline-block;} </style> <a href="https://google.com" target="_blank">Volunteer</a> laura-doval 1
tuanphan Posted September 4, 2020 Posted September 4, 2020 Add to Home > Design > Custom CSS div#block-yui_3_17_2_1_1599105038088_23671 a { background-color: #00B0B9; color: white; padding: 14px 25px; text-align: center; text-decoration: none; display: inline-block; } Takis and Smartyart 1 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Smartyart Posted September 8, 2020 Author Posted September 8, 2020 This worked perfectly! Thank you SO much!
Phil84vaive Posted December 9, 2021 Posted December 9, 2021 This worked perfectly for me too! I have styled mine to look exactly like the rest of my buttons, but I have one question - Can I add a hover colour as well, just like a normal button? Specifically, I would like to hover to be the same colour as the border #block-yui_3_17_2_1_1638482498070_17084{a:link, a:visited { background-color: black; font-size: 14px; color: rgb(220,255,32); padding: 12px 25px; border: 2px solid rgb(220,255,32); text-align: center; text-decoration: none; display: inline-block; }}
tuanphan Posted December 12, 2021 Posted December 12, 2021 On 12/10/2021 at 2:12 AM, Phil84vaive said: This worked perfectly for me too! I have styled mine to look exactly like the rest of my buttons, but I have one question - Can I add a hover colour as well, just like a normal button? Specifically, I would like to hover to be the same colour as the border #block-yui_3_17_2_1_1638482498070_17084{a:link, a:visited { background-color: black; font-size: 14px; color: rgb(220,255,32); padding: 12px 25px; border: 2px solid rgb(220,255,32); text-align: center; text-decoration: none; display: inline-block; }} Just add :hover div#block-yui_3_17_2_1_1599105038088_23671 a { background-color: #00B0B9; color: white; padding: 14px 25px; text-align: center; text-decoration: none; display: inline-block; } div#block-yui_3_17_2_1_1599105038088_23671 a:hover { background-color: white !important; color: #00B0B9 !important; } Replace with your block id laura-doval 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
laura-doval Posted September 26, 2022 Posted September 26, 2022 Hi! I am not sure if anyone is still getting notifications for this thread, but I was wondering if it would be possible to do something like this, but allowing for buttons inside the accordion. Many thanks!
tuanphan Posted September 27, 2022 Posted September 27, 2022 17 hours ago, laura-doval said: Hi! I am not sure if anyone is still getting notifications for this thread, but I was wondering if it would be possible to do something like this, but allowing for buttons inside the accordion. Many thanks! You can add link into accordion content, then we can give code to turn link to button laura-doval 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
laura-doval Posted September 27, 2022 Posted September 27, 2022 Thanks!! Is there another forum discussion that explains how to turn the link into a button?
tuanphan Posted September 28, 2022 Posted September 28, 2022 On 9/26/2022 at 10:31 PM, laura-doval said: Hi! I am not sure if anyone is still getting notifications for this thread, but I was wondering if it would be possible to do something like this, but allowing for buttons inside the accordion. Many thanks! You can add a link then share link to page where you use accordion, we can give code to turn link to button. Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment