Вот мой медиа-запрос:

@media screen and (min-device-width: 768px) and (max-device-width: 1824px) and (orientation : portrait){
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important ;
  }
  .visible-tablet {
    display: inherit !important;
  }
  .hidden-tablet {
    display: none !important;
  }
}

@media screen and (min-device-width: 768px) and (max-device-width: 1824px) and (orientation : landscape){
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important ;
  }
  .visible-tablet {
    display: inherit !important;
  }
  .hidden-tablet {
    display: none !important;
  }
}
@media screen and (max-device-width: 767px) and (orientation: portrait) {
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important;
  }
  .visible-phone {
    display: inherit !important;
  }
  .hidden-phone {
    display: none !important;
  }
}
@media screen and (max-device-width: 767px) and (orientation: landscape) {
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important;
  }
  .visible-phone {
    display: inherit !important;
  }
  .hidden-phone {
    display: none !important;
  }
} 

Но в планшете, если он в альбомном режиме, этот div показывает

 .visible-tablet {
    display: inherit !important;
  }

Если это в портретном режиме, этот div показывает

.visible-phone {
    display: inherit !important;
  }

Я хочу этот div.visible-tablet показывать всегда, когда я переключаю свой планшет в режим автоповорота (который будет для портрета и пейзажа)

Но я использовал портретные и ландшафтные условия, но все же я сталкиваюсь с этой проблемой. Любые комментарии?