Материализация всегда показывает отзывчивый контент - PullRequest
0 голосов
/ 06 февраля 2019

Я создаю пользовательский интерфейс, который должен быть отзывчивым.У меня есть три кнопки, которые я хотел бы переместить в раскрывающемся списке, когда размер экрана пользователя диктует.

Моя проблема заключается в том, что помощник "show-on-med-and-down", который я использую для отображенияраскрывающееся меню всегда отображается независимо от размера экрана.

Работает помощник по материализации "hide-on-med-and-down", и содержимое скрыто правильно, но я не могу получить раскрывающийся списокотображать только , когда экран средний и вниз.

<div class="entry">
     <div class="icon> icon for  user </div>
     <div class="name"> user name </div>


     <ul class="hide-on-med-and-down">
         <div class="button>yes</div>
         <div class="button>no</div>
         <div class="button>maybe</div>
     </ul>



     <ul class="show-on-med-and-down">
        <div class="dropdown"> dropdown menu</div>
     </ul>


</div>

Я ожидаю, что этот код покажет эксклюзивность кнопки выпадающего меню или трех кнопок в любом случае.Но, как вы можете видеть из моего прикрепленного снимка экрана, всегда отображается заполнитель раскрывающегося меню.

большой вид

маленький вид

Спасибо, что уделили время.

1 Ответ

0 голосов
/ 06 февраля 2019

Класс "show-on-med-and-down" css просто устанавливает свойство display, когда ширина экрана> 600px.

Вам нужно установить стиль элемента как style = "display: none;"

ИЛИ измените класс на «Hide-on-Large-Only» (рекомендуется).

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...