Jump to content

CSS to make radio buttons in form horizontal

Recommended Posts

  • Replies 7
  • Views 1.9k
  • Created
  • Last Reply

Top Posters In This Topic

On 4/14/2024 at 1:24 PM, holahannah said:

Hi @RuthLJ and @tuanphan

Did you manage to figure out how to do this? I'm trying to achieve the same thing on the website below (form in the footer): 
https://rocketrehab.squarespace.com/
password: rocket

I'm trying to figure out how to make the radio buttons horizontal, as per the screenshot attached. 

Where you about to resolve this?

Screenshot 2024-04-14 at 12.21.28 am.png

You can use this code to Website > Website Tools > Custom CSS

fieldset#radio-702f2676-2a25-4355-8e28-1f26b5271a1b {
    display: grid;
    grid-template-columns: repeat(2,1fr);
}

image.png.b57057d14f7807d48f7eea4fa6ed33a6.png

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!)

Link to comment
  • 2 weeks later...
On 4/26/2024 at 2:07 AM, holahannah said:

Hi @tuanphan

Do you know if it's possible to make the radio button change colour (#ED1651) when it's selected? Like the screenshot attached. I'm not sure if it's possible. 

Also, is there a way to move the 'Feedback' radio button over to the left side a bit more?

https://rocketrehab.squarespace.com/
password: rocket

Many thanks

Screenshot 2024-04-25 at 1.03.27 pm.png

It looks like there is no way to adjust this

https://stackoverflow.com/questions/4253920/how-do-i-change-the-color-of-radio-buttons

but you try posting your question to some SS groups on Facebook, maybe someone has a trick to do this.

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!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.