Change a set of radio buttons from a vertical list to a horizontal row

This thread is resolved. Here is a description of the problem and solution.

Problem:
Change a set of radio buttons from a vertical list to a horizontal row

Solution:
With the use of some custom CSS to adjust your vertical fields display to horizontal.

You can find proposed solution, in this case, with the following reply:
https://toolset.com/forums/topic/change-a-set-of-radio-buttons-from-a-vertical-list-to-a-horizontal-row/#post-908317

Relevant Documentation:

This support ticket is created 6 years, 7 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun	Mon	Tue	Wed	Thu	Fri	Sat
-	10:00 – 13:00	10:00 – 13:00	10:00 – 13:00	10:00 – 13:00	10:00 – 13:00	-
-	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	-

Supporter timezone: Asia/Kolkata (GMT+05:30)

Tagged: Custom search, Views plugin

This topic contains 1 reply, has 2 voices.

Last updated by Minesh 6 years, 7 months ago.

Assisted by: Minesh.

Author

Posts

June 3, 2018 at 4:21 am #907833

BarbaraD9652

Screen Shot 2018-06-03 at 12.19.11 AM.png

Screen Shot 2018-06-03 at 12.19.38 AM.png

Hi,

Is there a setting to change a set of radio buttons from a vertical list to a horizontal one?

Example here: hidden link

I would like to be able to make the buttons into a horizontal row, but each button is wrapped in it's own div. Is there a setting to change this so I can control the display of the buttons using CSS?

Thanks,
Barbara

June 4, 2018 at 10:35 am #908317

Minesh

Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hello. Thank you for contacting the Toolset support.

Well - it needs some custom CSS to adjust your vertical fields display to horizontal. Please try to add following CSS to your view's Filter section's CSS box and try to resolve your issue.:

.form-group .radio {
    display: inline-block;
    padding-right: 5px;
}