Hey,
Habe heute mal eine kleine Nav-bar geschrieben.
Wenn man den browser kleiner zieht funktioniert es,
versucht man es aber über ein handy oder tablet auf
die seite zu gehen, wird das normale css ausgegeben und
nicht die Query, woran liegt das?
Habe die seite mal auf einen Free-Hoster gepackt:
om-test.epizy.com
LG
Felix 
Versuche es mal mit
@media all and (max-width : 768px) {und noch ein Tipp.
um eine Webseite Handy gerecht zu machen darf das eigentlich auch nicht mehr fehlen
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>Um vieleicht noch Quer und Hoch format zu beachten kann man noch
/* Portrait */
@media all and (max-device-width: 768px) and (orientation: portrait) {
body{
background:blue;
}
}
/* Landscape */
@media all and (max-device-width: 768px) and (orientation: landscape) {
body{
background:green;
}
}benutzen.So kann man zb Bilder breiter anzeigen wenn einer sein Handy Quer hält
Hey,
danke für die Antwort und deine Hilfe. Nun klappt es perfekt.
Wenn du mir vielleicht noch kurz erklären könntest was die Codezeilen "bedeuten" und "bewirken"? 
Gruß
Felix
Zitat@media all and (max-width : 768px) {
Bedeutet das alle Geräte angesprochen werden,
die im Browser gerade mindestens 768 Pixel Breit sind.
Es gibt noch andere Werte wie
Zitat
- all: alle Geräte
- handheld: PDAs oder Mobiltelefone mit kleinen Bildschirmen
- print: Drucker
- tv: Fernseher oder ähnliche Geräte
- aural: Sprachbrowser, die den Text der Webseite vorlesen (Es gibt auch Befehle für Blindenschrift bzw. Brailledrucker)
- projection: Projektoren und ähnliche Geräte
- screen: Herkömmlicher Computer Bildschirm
Dann dies, das zählt wohl nur bei Handys und Tablets
(orientation: portrait)
(orientation: landscape)Da werden nur die Geräte angesprochen die Hochkant stehen oder quer liegen, üblicherweise beim Handy.
und das
<meta name="viewport" content="width=device-width, initial-scale=1.0">kann ich nicht vernünftig erklären.Aber hier steht alles was man darüber wissen sollte
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!