Radio Buttons for dummies

Like myself, I gess, there are many designers who are using Webflow without clear idea about Radio Button styles and settings.
There’s not much information on the Forum/Help.

Webflow radio Button (WRB) = Radio button field (div) + Radio button (circle) + Radio label (text)

As I know from some of the works met here, you can add Divs, Images into the the Radio button field. (It was on the Josh Overton’s demosite, but now I’ve lost the link).
Supposedly, you can delete the radio circe from the WRB and it will continue to work.

My task is to put an image on every radio button so that the button borders/backcolor would change after selection.

The current state of each radio button Circle is Opacity=0%.
I got problems with selection. How do I Apply bg color or radio button field border to the checked box?

Another problem is that in published mode even if the checker is not transparent, the checkboxes do not get selected after shifting between options.

2 Likes

I would also love to see this addressed. I’m currently designing a site with a donation form and in order to keep things mobile friendly, I’m hoping to use full size, thumb friendly buttons rather than radio buttons to let users select an amount to give. My most recent thought was to use the labels instead of the buttons themselves, (Hiding the actual button since clicking on the label has the same selecting effect), but I can’t figure out a way to style the label based on whether or not the radio button was selected. It would be great if there was a way to style the radio button labels based on whether the radio button is selected or not. Thanks!

3 Likes

This topic was automatically closed after 60 days. New replies are no longer allowed.