Настройка кнопок радиосвязи из простой формы

Question

Итак, сейчас я использую Simple Form с ее переключателями в поле. Кнопки небольшие для моего интерфейса, и я хочу настроить их через css. Как увеличить размер кнопок? Что я должен добавить в .scss?

Вот поле в простой форме, содержащих радиокнопок:

<%= f.collection_radio_buttons :shirtsize, [['XXL'], ['XL'], ['Large'] , ['Medium'], ['Small']], :first, :last %> 

HTML выход для каждой кнопки радио это один:

<label for="user_shirtsize_large"> 
 
    <input type="radio" value="Large" name="user[shirtsize]" id="user_shirtsize_large"> 
 
    <label class="collection_radio_buttons" for="user_shirtsize_large">Large</label> 
 
</label>

Answer 1

Я никогда не пробовал это , Давайте взглянем на CSS селекторов: http://www.w3schools.com/css/css_attribute_selectors.asp

теперь давайте выбрать все тип ввода = «радио» и установить ширину и высоту:

input[type="radio"] { //select all input type = "radio" 
    height: 100px; //change these to get correct size 
    width: 100px; 
}