Структура сетки Framework7, чтобы включить представление рабочего стола

Я знаю, что framework7 предназначен для телефонов и планшетов, но есть ли способ включить или каким-то образом настроить CSS, чтобы сделать его совместимым для настольных компьютеров? Мой сценарий - у меня есть два элемента div, которые я хочу просматривать рядом на рабочем столе.

  <div class="row">
      <div class="col-50">panel-1</div>
      <div class="col-50">panel-2</div>
    </div>

Но на планшете / телефоне я хочу, чтобы они оба рассматривались как 100%

 <div class="row">
      <div class="tablet-100">panel-1</div>
      <div class="tablet-100">panel-2</div>
    </div>

Я попробовал ниже, но в документации сказано, что класс планшета предназначен для ширины окна>= 768 пикселей, поэтому ширина равна 100% даже при просмотре на рабочем столе.

<div class="row">
      <div class="col-50 tablet-100">panel-1</div>
      <div class="col-50 tablet-100">panel-2</div>
    </div>

Я думаю о добавлении пользовательского CSS, такого как desktop-XX, но как я могу добавить его и перезаписать текущую систему сетки? Любое предложение было бы здорово, спасибо заранее!

Источник

1 ответ

Решение
@media (min-width:768px){
.col-50{
width:50%;
}
}

это должно работать

Источник
Другие вопросы по тегам