Hallo,

während meinem ersten responsive Projekt stehe ich hier leider gerade vor folgendem Problem:

Ich möchte gerne einen mobile Header verwenden, sprich auf mobilen Endgeräten eine andere .png Grafik anzeigen, als auf einem Desktop.

Mein vorgehen war bisher wie folgt, beide Grafikenin der HTML verlinkt,
im Stylesheet Größe und Werte des Desktop headers, definiert. Den Mobile Header mit diplay:none; aus der Desktop Version eliminiert.

Der Plan war nun im Media Querie für das mobile Endgerät genau umgekehrt vorzugehen sprich #mobileheader{max-width:100%; height: auto; } und den desktop header mit display:none; auszuschalten.

Leider haut das so nicht hin, da er mir sobald das media Querie aktiv wird KEINE der beiden Grafiken anzeigt. In der Desktop version klappts wie ich mir das vorstelle.

Jemand ne idee wie man das lösen könnte? Vielen lieben Dank und beste Grüße!

Hast du mal einen Link zur Seite, damit man sich da mal ansehen kann.

__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..."
Aus einem Forum.

Allerdings ist der mobile header gerade nicht einsehbar bzw. eben auf display:none; und der desktop header wird kleiner, weils ja anders nicht hingehauen hat :/

Bitte erst mal den Vaildator benutzen und die angezeigten Fehler beheben. Danach, wenn es immer noch Probleme gibt hier einfach noch mal nachfragen.

Vaildator: 12 Fehler anzeigen

__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..."
Aus einem Forum.