@a16a

Как убрать заголовок, чтобы блок стал адаптивным?

Всем привет.
Я не очень опытен в верстке, и столкнулся с такой проблемой: нужно сделать этот блок адаптивным.
https://codepen.io/iremlopsum/pen/OVMxzp?editors=1100
Самый логический на мой взгляд это убрать тексты в заголовок вкладках. Например на мобильном была только иконки слева.
Как это можно реализовать?
  • Вопрос задан
  • 280 просмотров
Решения вопроса 1
Обернуть заголовки в дополнительный блок и скрывать его если ширина экрана, например, 600.
<li class="choose active">
   <div class="icon active">
      <svg viewBox="0 0 32 32">
        <g filter="">
           <use xlink:href="#shopping-cart"></use>
         </g>
       </svg>
      </div>
     <span class="block"> Choose </span>
    </li>

@media screen and  (max-width: 600px) {
  .block{
   display:none;
  }
}
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы