Horizontal Radio Buttons | Community
Skip to main content
Robb_Barrett
Robb_Barrett
New Participant
April 4, 2016
Solved

Horizontal Radio Buttons

  • April 4, 2016
  • 6 replies
  • 12902 views

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?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Robb_Barrett

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;}

6 replies

A
Anonymous
August 15, 2017

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
    Diego_Lineros2
    New Participant
    November 16, 2016

    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
    Robb_BarrettAuthor
    New Participant
    April 4, 2016

    Didn't work for me in Chrome.

    Robb Barrett
    SanfordWhiteman
    SanfordWhiteman
    New Participant
    April 4, 2016

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

    Robb_Barrett
    Robb_BarrettAuthorAccepted solution
    New Participant
    April 4, 2016

    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;}

    Robb Barrett
    SanfordWhiteman
    SanfordWhiteman
    New Participant
    April 4, 2016

    I injected that CSS right into your page:

    SanfordWhiteman
    SanfordWhiteman
    New Participant
    April 4, 2016

    In the form you sent me:

    LABEL[for="USCANHITRADPurchaseTiming"] ~ .mktoRadioList INPUT[type="radio"],
    LABEL[for="USCANHITRADInquiryType"] ~ .mktoRadioList INPUT[type="radio"] {
        clear: none !important;
    }
    SanfordWhiteman
    SanfordWhiteman
    New Participant
    April 4, 2016

    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.

      Terms & ConditionsAccessibility statement

      Loading footer...