Hallo,
Google sagte mir, dass ich eine mobile Version bauen soll und nannte mir Vorschläge. Ich habe damit begonnen, jedoch habe ich ein Problem bzw. eine Frage.
Um seitlich (wenig Platz; Hochformat) Platz zu sparen, wollte ich oben einen Balken mit Logo, ein Bild (img) mit Link (a) zum Menü (Link zu menu.php), einbauen. Da es ja verschiedene Telefone und Displays gibt, habe ich nachgesehen, wie man Bilder autom. anpassen kann:
.responsive_menu {
position: fixed;
width: 100%;
height: auto;
}
Das Problem ist nun, dass das Menü sozusagen den Inhalt verdeckt. Wenn ich es zB position: top mache, dann wird der Inhalt passend nach unten geschoben, jedoch verliere ich dann das Menüband, wenn man runter scrollt. Beides (fixed AND top) funktioniert hingegen nicht.
Meine Lösung ist nun 2 gleiche Bilder anzuzeigen - eines mit fixed und eines mit top, um beides zu haben: Der Inhalt schiebt sich nach unten um die Menübandhöh, das Menü bleibt bei scrollen aber trotzdem erhalten.
.responsive_menu {
position: fixed;
width: 100%;
height: auto;
}
.responsive_menu2 {
position: top;
width: 100%;
height: auto;
}
Ich frage mich, ob es eine bessere Möglichkeit gibt, dem mitzuteilen, dass er den Inhalt nicht abdecken soll. Ich kann jedoch auch nicht wissen, wie hoch das Menüband ist, einen Fixwert zu nehmen ist daher schlecht bzw. Glückssache.
Hat jemand dazu eine Idee bitte? Ich habe wirklich schon displa block und float und alles probiert, aber er ignoriert alles was ich mache.
Vielen Dank im Voraus!