Menu icon Foundation
Radio Buttons that look like buttons?

Is there any way to create a control that looks like a .button but acts like a radio button, similar to what Bootstrap can do: http://getbootstrap.com/javascript/#buttons?

I have a button group that I would like to behave like a set of radio buttons. Here's the mockup:

Clipboard01

buttonradiotoggle

Is there any way to create a control that looks like a .button but acts like a radio button, similar to what Bootstrap can do: http://getbootstrap.com/javascript/#buttons?

I have a button group that I would like to behave like a set of radio buttons. Here's the mockup:

Clipboard01
Rafi Benkual almost 5 years ago

You can but it's not core. http://codepen.io/rafibomb/pen/Frhmj
They use js to toggle

Agustin Sevilla almost 5 years ago

Here is my take on this one - forked from Rafi's pen: http://codepen.io/auginator/pen/rpgsE

I changed the structure around a bit (I put all the buttons in a nested row with .collapse. For the labels themselves, I went with absolute positioning and the vertical/horizontal center trick using top:50%;left:50% and transform: translate(-50%, -50%).