Ik ben bezig met een layout die responsive moet worden en gebruik daarvoor deze CSS: 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
@media screen and (max-width: 600px) {
#menu {
visibility: hidden;
clear: both;
display: none;
}
#logotxt b {
font-size: 20pt;
}
#logotxt {
float: left;
margin-left: 0px;
}
.popup {
width: 310px;
margin: 0px;
}
#footerinner {
width: 300px;
}
}
Maar wanneer ik hem open op mijn telefoon is bijvoorbeeld het #menu nog niet verdwenen etc.
Gebruik ik verkeerde afmetingen?
Spoiler tonen
Codeblok (voorbeeld.php):
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
@media screen and (max-width: 600px) {
#menu {
visibility: hidden;
clear: both;
display: none;
}
#logotxt b {
font-size: 20pt;
}
#logotxt {
float: left;
margin-left: 0px;
}
.popup {
width: 310px;
margin: 0px;
}
#footerinner {
width: 300px;
}
}
Maar wanneer ik hem open op mijn telefoon is bijvoorbeeld het #menu nog niet verdwenen etc.
Gebruik ik verkeerde afmetingen?

Kan iemand mij vertellen hoe?
Ik zal het toepassen wanneer ik er tijd voor heb 
Bedankt!