Есть ли способ заменить один класс css на другой на мобильном устройстве?

Question

[Александра Нев]

Можно ли сделать так, чтобы на мобильном устройстве один класс css заменялся на другой? Например
<div class="icon-right">
заменялся на

<div class="icon-top">

Comments

[shmatuan]

Вообще через js запросто (отлавливая ресайз и получая screen.width), но лучше через @media screen and (max-width: 768px) { } заменять сам стиль, а не название

[Александра Нев]

Это я умею) Просто думала css сократить.

Answer 1

[Антон Спирин]

Варианты:
1. Определять user agent и в зависимости от него рендерить нужный html.
2. Использовать общий класс и медиазапрос:

.some-icon {}

@media screen and (min-width: 600px) {
  .some-icon {}
}

3. Использовать js костыль. Самый плохой вариант.