2013-02-15 2 views
0

Это должно быть что-то глупое, простое, и оно работает. Я играю с медиа-вызовами css3, чтобы создать отзывчивый веб-сайт, и не могу на всю жизнь понять, почему следующее не работает.CSS3 медиа-звонки не работают

Здесь код страницы:

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<title>Untitled Document</title> 

<link href="assets/css/layout.css" rel="stylesheet" type="text/css"> 
</head> 

<body> 
</body> 
</html> 

И в layout.css:

body { 
background-color:#FFF; 
} 

@media screen and max-width 980px { 
body { 
background-color:aqua; 
} 
} 

@media screen and max-width 700px { 
body { 
background-color:#ff4500; 
} 
} 

@media screen and max-width 480px { 
body { 
background-color:#ffd700; 
} 
} 

Что случилось с этим?

Спасибо.

ответ

2

Я заметил пару проблем с форматированием в ваших медиа-запросах; попробуйте использовать этот формат вместо:

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

    ... 

} 
+0

OMG. Лучшие Мужчины. Я отключил синтаксис слепым. Работаю как сон. Думал, что сошел с ума. Большое спасибо чувак. –

+0

Эй, это случается с лучшими из нас. Рад, что смог помочь! – Aaron

+0

Черт, я просто редактировал свой ответ. :П –

0

Поместите что-нибудь в теги тела. Поскольку он пуст, он не отображается.

+0

У меня есть. Все такой же. –

Смежные вопросы