レスポンシブ対応：メディアクエリが全然効かない！

レスポンシブ対応でPCファーストでCSSを書いてるんですが、
全然びっくりするほどメディアクエリが効かなくて、コードはこちらなのですが、、

HTML5
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4	<meta charset="UTF-8">
5	<meta name="viewport" content="width=device-width,initial-scale=1">
6	<title>テスト</title>
7	<link rel="stylesheet" href="css/reset.css">
8   	<link rel="stylesheet" href="style.css">
9</head>
10<body>
11	<header>
12	</header>
13	<section id="hero">
14	</section>
15</body>
16</html>

css3
1header {
2	width: 380px;
3	background: #fff;
4	box-sizing: border-box;
5	height: 837px;
6	position: fixed;
7	box-shadow: 0 5px 10px -3px rgba(0,0,0,0.5);
8}
9
10#hero {
11	width: calc(100% - 380);
12	margin-left: 380px;
13	height: 0;
14	padding-top: 56.25%;
15	position: relative;
16	background: url(img/main_pc.png) 0 0 no-repeat;
17    background-size: contain;
18}
19
20
21
22
23@media screen and(max-width: 750px){
24
25header {
26	width: 100%;
27	height: 100px;
28	position: absolute;
29	top:0;
30	left:0;
31}
32
33#hero {
34    width: 100%;
35    height: 90vh;
36    background-image: url(img/main_sp.png);
37}
38}

何がダメなんでしょうかー >< ?!?!?!?

行動規範の内容に同意します

回答1件

ベストアンサー

and の後にスペースを入れては？

css
1@media screen and (max-width: 750px)

投稿2019/06/07 06:52

編集2019/06/07 06:54

foobar810

総合スコア217

ems

2019/06/07 06:56

スペース！！効きました!!!!!ありがとうございました。

行動規範の内容に同意します

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう！

レスポンシブ対応：メディアクエリが全然効かない！

関連した質問