Как задать ширину таблицы в мобильной версии?

Question

[Максим]

Добрый день.
Пытаюсь сделать так, чтобы width у таблицы на пк был 60%, а на мобильных - 100%, сделал по примеру из интернета, но почему-то не срабатывает.

<style type="text/css">
@media only screen and (max-device-width: 480px) {
	TABLE {
	width: 100%;		
		    }		    
	}
        TABLE {
	width: 60%;    
   }
  
  </style>
 <table cellspacing="0" border="0">
   <tr>
    <th>Заголовок 1</th>
    <th>Заголовок 2</th>
   </tr>
   <tr><td>Тест1</td><td>19999</td></tr>
   <tr><td>Тест2</td><td>19998</td></tr>
   <tr><td>Тест3</td><td>1997</td></tr>
	 </table>

Answer 1

[Dies Irae]

Вы проверяли в браузере - уменьшая его ширину?
Разница между max-device-width и max-width: https://stackoverflow.com/questions/6747242/what-i...

Comments

[Максим]

Я проверял в браузере, выбирая мобильные устройства.

[Rustam Bainazarov]

Максим, медиа-запрос поставьте после объявления основных стилей (257-я строка). Сейчас они выше по коду (240-я строка).

P. S. В коде этого ответа — правильный порядок.

[Максим]

Рустам Байназаров, и правда)

[Rustam Bainazarov]

Максим, изучайте правила наследования и порядка стилей. Там несложно.