Horizontal Radio Buttons

[Robb_Barrett]

I've seen a couple of threads about making radio buttons horizontal but I've yet to get it to work. Can someone point me in the right direction?

[Anonymous]

YAYAYAYAY!!! I have been trying to figure this out for a while and finally googled the right words to get your answer!! yayay!! thank you!

[Diego_Lineros2]

Wrap it in a field set and put that

<style>

fieldset input[type=radio] + label  { display: inline !important; margin-right:1.5em !important; margin-left: 0 !important;

}

fieldset input[type="radio"] {float: none !important;}

</style>

[Robb_Barrett]

Didn't work for me in Chrome.

[SanfordWhiteman]

OK, in this particular case I had done a quick FF check.  Interesting anomaly.

[Robb_Barrett · Accepted solution]

That didn't work, but this did:

.mktoRadioList>label, .mktoRadioList>input {display: inline-block !important; margin-right: 1em !important;margin-left: .5em !important;}

.mktoForm input[type=radio] {float: none;}

[Anonymous]

Rob, big thanks
Your answer helped me perfectly !!!!
Cheers

[Anonymous]

This worked well for setting up the radio buttons horizontally, but do you also know how to have the text appear above the button?

[SanfordWhiteman]

I injected that CSS right into your page:

[SanfordWhiteman]

In the form you sent me:

LABEL[for="USCANHITRADPurchaseTiming"] ~ .mktoRadioList INPUT[type="radio"],
LABEL[for="USCANHITRADInquiryType"] ~ .mktoRadioList INPUT[type="radio"] {
    clear: none !important;
}

[SanfordWhiteman]

Hey Robb --

Set up a form with a few buttons and post the link (so I don't have to create another form in my lab) and I'll show you how.