Probleme mit dem Design bei Drehen auf Handy oder Tablet

Diskutiere Probleme mit dem Design bei Drehen auf Handy oder Tablet im CSS Forum im Bereich Programmierung; Geb dir nachher Feedback wenn ich zuhause bin! Werde alle drei testen. DANKE! Ich blick das mit den Viewports auch nur bedingt. Trotzdem vielen...
S

Snake20x

Member
Beiträge
15
Punkte Reaktionen
0
Geb dir nachher Feedback wenn ich zuhause bin! Werde alle drei testen.
DANKE! Ich blick das mit den Viewports auch nur bedingt. Trotzdem vielen lieben DANK
 
S

Snake20x

Member
Beiträge
15
Punkte Reaktionen
0
Hey @basti1012 Also die "Contain" und "auto" belassen es als Container mit weißen Balken!
Cover scheint es zwar nach außen aber dann halt mit der Schrift.

Werd mich dem CSS mal wenden ;-) Hast mir ja genug Lernstoff gegeben!
Meld mich später wenn ich mehr infos habe.
 
S

Snake20x

Member
Beiträge
15
Punkte Reaktionen
0
@basti1012 hey...
Erstmal danke für die ganze Lektüre! Aber irgendwie stell ich mich grad doof an!
Die beste Variante ist aus meiner Sicht diese.

Du machst ins HTML das
Vor die Navbar das!
<main class="shrink center">

und unter den Footer
</main>

Und ins CSS machst das , damit er es verkleinert.

@media only screen and (orientation: portrait) {
body {
.shrink {
width: 95%;
}
}
}

@media only screen and (orientation: landscape) {
body {
.shrink {
width: 90%; /* Shrink a little more to avoid the notch. */
}
}
}


.center {
text-align: center;
margin: 0 auto;
}


Aus meiner Sicht, wenig Code, sehr effizient und sollte das Prob lösen! Aber er macht NIX!
Mach ich was falsch?

Im Viewport hab ich natürlich das:
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">

damit er es ganz nach außen zieht.

Und Cache natürlich auch geleert!


Danke schonmal im voraus
 
Thema:

Probleme mit dem Design bei Drehen auf Handy oder Tablet

Oben Unten