Mein Shop sieht auf den Tablets so aus (es wird der Bereich / Slider oberhalb der 1. Artikel abgeschnitten): Jemand eine Idee wie ich das wieder hin bekomme? Kann mir ja das css auf dem Tablet nicht anzeigen lassen..........
Du kannst Dir doch im Desktop-Browser verschiedene Bildschirmgrössen anzeigen lassen (im FF uner Web-Entwickler) und dann kannst Du den Code einsehen.
habe jetzt 2 Stunden nach dem passenden Code gesucht und nix gefunden. Sobald die Breite unter 1200 geht, wird der Bereich oben abgeschnitten . Kann gar nicht glauben, dass ich da mal konnte............. Kann jemand helfen bitte?!
sorry, habe vergessen dass ich den Link zum Shop vor kurzem raus genommen habe . (Link nur für registrierte Nutzer sichtbar.)
Eigentlich ist da ein: Code: @media (min-width: 768px){ body #outer-wrapper { margin-top: 172px; ... }} Du hast aber: Code: @media (max-width: 992px) and (min-width: 767px){ #outer-wrapper { margin: 0 auto !important; ... }} @media (max-width: 1200px) and (min-width: 992px){ #outer-wrapper { margin: 0 auto !important; ... }} und dann bei einer Breite ab 1200px Code: @media (min-width: 1200px){ body #outer-wrapper { margin-top: 172px !important; }} Wenn Du das ändern würdest auf: Code: @media (max-width: 992px) and (min-width: 767px){ #outer-wrapper { margin left: auto !important; margin right: auto !important; ... }} @media (max-width: 1200px) and (min-width: 992px){ #outer-wrapper { margin left: auto !important; margin right: auto !important; ... }} könntest Du Dir den code ab 1200px weg lassen und es müsste überall passen - und sihc auch anpassen, wenn sich an der Header-Höhe etwas ändert.
habe ich gemacht, Caches alle geleert und dann sieht es so aus dass am Desktop oben alles abgeschnitten wird . Nicht wundern: ich teste das im neuen Shop, da ist noch nicht so viel los.
das hier habe ich bei "eigenes css" drin: Code: @media only screen and (min-width:768px){ #header.sticky .custom-container { height: 80px; } } @media (min-width: 1200px){ body #outer-wrapper { margin-top: 172px!important; }}
da habe ich ein: Code: @media (min-width: 767px) and (max-width: 992px) { ... #outer-wrapper {margin:0 auto!important;max-width:750px;-moz-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);-webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);}
Entweder Du änderst das "margin: 0 auto" so wie ich es oben geschrieben habe, oder Du ersetzt die "0" mit "172px". müsste beides gehen. Zurück, dann hast Du auch nach unten einen Abstand von 172px, das wäre nicht so gut, denke ich.
habe jetzt einfach aus 1200 eine 768 gemacht und schein zu funktionieren...... Code: @media (min-width: 768px){ body #outer-wrapper { margin-top: 172px !important; }}
Jetzt hat der Browser einmal "margin-top: 0 !important; und einmal ein "margin-top: 172px !important" und kann sich aussuchen, welches er nimmt. Es sei denn, dass das eigene css im SE immer zuletzt genommen wird, dann geht das.
scheint zu funktionieren; kann aber ja auch mal Deinen Vorschlag testen, damit es nicht zu Probleme führt...