Skip to main content
A
Anonymous
July 25, 2014
Question

Radio buttons horizontal

  • July 25, 2014
  • 6 replies
  • 2667 views

Is it possible to display radio button lists horizontal?

I couldn't find an option to change the order. So my question, can we change the order through CSS?
And if yes, what is the code?

Thanks!

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

6 replies

A
Anonymous
July 25, 2014
Radio buttons and checkboxes are aligned horizontally by default, as are the labels.
 
One option (which I did not test in full) would be a CSS property
 
input[type="radio"] {
    display:inline-block;
}
 
label {
    display:inline-block;
}
 
A
Anonymous
July 25, 2014

Hi Breno,

Can't get it to work. Can you perhaps send the exact Marketo code?

I have tried:

.mktoForm .mktoRadioList > label,
{
  margin-bottom:0.6em;
  display:inline-block;
}
.mktoForm input[type=radio] {
  width:1em;
  height:1em;
  opacity:0;
  display:inline-block;
}

Thanks.
A
Anonymous
July 25, 2014
This is exactly what I used on one of my forms that I made horizontal.  Hope it helps!

 
.mktoRadioList input, .mktoRadioList label {
    float: left !important;
     margin-right: 2px;
    margin-left: 10px;
    margin: 2px 2px 2px 2px 2px;
  padding: 0px 0px 0px 0px 0px;
    padding-left: 0px;
  padding-right: 3px;
    text-indent: 1px;
    text-align: left;
 
}
A
Anonymous
March 17, 2015
If you cannot edit the the HTML of an individual landing page or a form, where does this HTML go?
A
Anonymous
April 28, 2015
Kristen, you can edit the custom CSS of a form theme. 

Here are step-by-step instructions: https://community.marketo.com/MarketoArticle?id=kA050000000LHXhCAO
Robb_Barrett
Robb_Barrett
Level 10
April 1, 2016

Bumping this thread. I've tried using a couple of types of CSS I've found while searching and nothing is working.

Robb Barrett
Terms & ConditionsAccessibility statement

Loading footer...