# Radio Button Options Orientation?

**URL:** <https://community.weweb.io/t/radio-button-options-orientation/868>\
**Category:** How do I?\
**Created:** [July 25, 2022, 6:34pm UTC](https://community.weweb.io/t/radio-button-options-orientation/868 "2022-07-25T18:34:43Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![dorilama](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/dorilama/32/10403_2.png) [@dorilama](https://community.weweb.io/u/dorilama)\
**Post date:** [July 26, 2022, 8:20am UTC](https://community.weweb.io/t/radio-button-options-orientation/868/2 "2022-07-26T08:20:50Z")

</div>

adding custom css can do the trick but you can also create your own radio button layout:

- create a variable to store the selected option, let’s call it `radio-value`
- add a column element, set the layout you prefer and bind the items with an array containing the radio options (someting like `[{label: 'option 1', value: 'opt1'},{label: 'option 2', value: 'opt2'}]`)
- in the column add a signle radio element
- set the initial value of the radio to a formula  
 ![image](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/6/6ec161d2ca3ded62f83b07aa31fbc663ba0e6ff6.png)
- add a workflow on the change event for the radio  
 ![image](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/e/ec2876277fb601acc0798c65321103a7e4a448d4.png)

result:  
 ![chrome_Hmc470iwrF](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/f/f7044f0a7d70e3540608d68a490a62e333cf2b22.gif)

This way you have full control over the layout

---

_[View the full topic](https://community.weweb.io/t/radio-button-options-orientation/868)._