Работа с @Media запросами

[Maus]

 Ребята - при верстке появилась такая проблема: У меня не работает @Media запросы - они просто перечеркиваются! 

 Но если их вручную включить а ненужные выключить - все выглядит отлично! (Картинка сжимается и в общем все работает) 

 

Так как же мне сделать что-бы оно само отключало обычный тег и включало @Media при условии (max-width: 1000px)??? 

 

Вот код: 

 

HTML:

 

<div id="Menu">

<a href="http://blackhoggames.clan.su/" ><img src="/Black_Hog_Games/images/BottonHome.png" id="Home" class="Botton"></a> 

 </div>

 </Menu>

 

CSS: 

 

@media only screen and (max-width: 1000px){

#Home {                  

 display: block;

 width: 130px; 

 height: 30px; 

 float:left;

 padding-top: 2px;

 padding-left: 10px; 

}

}

 

 

#Home {

  display: block;

 width: 160px; 

 height: 45px; 

 float:left;

 padding-top: 2px;

 padding-left: 10px;

}

 

[satantx]

У вас меда запрос стоит выше, чем css самого блока, переместите @media в самый низ css документа

[Maus]

У вас меда запрос стоит выше, чем css самого блока, переместите @media в самый низ css документа

 

 Действительно - поменял их местами вот так :

 

#Home {

 display: block;

 width: 160px; 

 height: 45px; 

 float:left;

 padding-top: 2px;

 padding-left: 30px; 

}

 

@media only screen and (max-width: 1000px){

#Home {                  

 display: block;

 width: 130px; 

 height: 30px; 

 float:left;

 padding-top: 2px;

 padding-left: 10px; 

}

}

 

И все работает - спасибо вам большое!