Почему не работает @media когда @import стоит в конце?

Question

[Роман Серков]

Когда импортирую медиазапросы в конце основного css кода, то они не работают , а когда перед основным кодом , то все работает.
Насколько я знаю медиазапросы должны быть в конце(возможно я ошибаюсь).

вот сами media запросы

/* Extra Small */
@media(max-width:767px){

}

/* Small */
@media(min-width:768px) and (max-width:991px){

}

/* Medium */
@media(min-width:992px) and (max-width:1199px){

}

/* Large */
@media(min-width:1200px){

}

Вот иерархия папок

Comments

[Сергей Попов]

Нет желания показать пример рабочий и не рабочий.

[Модератор]

Вставьте код текстом в тег code в вопрос

[Сергей Попов]

И проверь консоль в нерабочем состоянии.

[Роман Серков]

Не рабочий вариант

@import "font.css";

/*@import "http://fonts.fontstorage.com/import/opensans.css";*/


*::-webkit-input-placeholder{
	color: #666;
	opacity: 1;
}

*:-moz-placeholder{
	color: #666;
	opacity: 1;
}

*::-moz-placeholder{
	color: #666;
	opacity: 1;
}

*:-ms-input-placeholder{
	color: #666;
	opacity: 1;
}

body input:focus:required:invalid,
body textarea:focus:required:invalid{
	color: #666;
}

body input:required:valid,
body textarea:required:valid{
	color: #666;
}

body{
	font-size: 13px;
	min-width: 320px;
	position: relative;
	line-height: 1.6;
	font-family: "Open Sans" , "Times New Roman";
	overflow-x: hidden;
	opacity: 1;
	background: #000 url(../img/bg.jpg) no-repeat center top;
	background-size: 100% ;
}



......

@import "media.css";

Рабочий вариант

@import "font.css";
@import "media.css";

/*@import "http://fonts.fontstorage.com/import/opensans.css";*/


*::-webkit-input-placeholder{
	color: #666;
	opacity: 1;
}

*:-moz-placeholder{
	color: #666;
	opacity: 1;
}

*::-moz-placeholder{
	color: #666;
	opacity: 1;
}

*:-ms-input-placeholder{
	color: #666;
	opacity: 1;
}

body input:focus:required:invalid,
body textarea:focus:required:invalid{
	color: #666;
}

body input:required:valid,
body textarea:required:valid{
	color: #666;
}

body{
	font-size: 13px;
	min-width: 320px;
	position: relative;
	line-height: 1.6;
	font-family: "Open Sans" , "Times New Roman";
	overflow-x: hidden;
	opacity: 1;
	background: #000 url(../img/bg.jpg) no-repeat center top;
	background-size: 100% ;
}



......

[Роман Серков]

Сергей Попов, консоль пуста.

[Роман Серков]

Модератор, вставил часть кода.

Answer 1

[St1myL]

@import не будет работать в конце кода, лишь в самом его начале, попробуйте импортировать что-либо еще таким же образом, но ничего не выйдет. Медиа-запросы должны находится в конце, это верно

Comments

[Роман Серков]

понял,спасибо)