Сделать кнопки отзывчивыми на PureCSS?

Question

В настоящее время я работаю над плагином для совместного использования WordPress. Я использую PureCSS для создания кнопок совместного доступа, и у меня все получилось. Но я хочу сделать их отзывчивыми, так что «ширина» изменяется в зависимости от размера устройства/дисплея.

P.S: Я пробовал запросы @media, но хотел бы знать, есть ли другой способ сделать его полностью отзывчивым.

Если есть какие-либо другие модули CSS, как purecss или загрузки, который имеет отзывчивые кнопки, пожалуйста, дайте мне знать :)

Пожалуйста gelp.

Answer 1

Если вы говорите о http://purecss.io/buttons/ то все, что вам нужно сделать, это добавить ширина: 100% к .pure-кнопочной CSS

.pure-button {font-family: inherit; font-size: 100%; padding: .5em 1em; color: #444; color:rgba(0,0,0,.8); border: 1px solid #999; border: 0 rgba(0,0,0,0); background-color: #E6E6E6; text-decoration: none; border-radius: 2px; width: 100%; 

}

Это заставит кнопку реагировать, но это будет заполните любой контейнер, в который он помещен, чтобы вы могли обернуть его в другой div для управления полной шириной ala: http://jsfiddle.net/0z6ykw00/

Вам все равно придется использовать мультимедийные запросы для изменения размера шрифта в зависимости от вашего приложения.

Надеюсь, что поможет