nicht angemeldet
Der Martin
Matthias Scharwies
Henry
Rolf B
Henry
Der Martin
Rolf B
Matthias Scharwies
Gunnar Bittersmann
Rolf B
Hallo,
ich habe folgendes gefunden:
body {
max-width: 60em;
....
}
Was passiert, wenn die Viewportbreite größer ist?
Links und rechts schwarze Flächen?
Sind die 60 em typisch für ein bestimmtes Gerät?
Hi,
body { max-width: 60em; .... }Was passiert, wenn die Viewportbreite größer ist?
Links und rechts schwarze Flächen?
nur wenn Schwarz die Hintergrundfarbe für das html-Element oder die Default-Hintergrundfarbe in deinem Browser ist.
Sind die 60 em typisch für ein bestimmtes Gerät?
Das erscheint mir realistisch für Desktop-Systeme. Vielleicht ist in dem Beispiel, das du gefunden hast, die Breite auch bewusst eingeschränkt worden. Die Angabe von max-width lässt das vermuten - es ist eine Obergrenze.
Live long and pros healthy,
Martin
Servus!
Hi,
body { max-width: 60em; .... }Was passiert, wenn die Viewportbreite größer ist?
Links und rechts schwarze Flächen?nur wenn Schwarz die Hintergrundfarbe für das html-Element oder die Default-Hintergrundfarbe in deinem Browser ist.
Bei uns im SELF-Wiki ist die Höchstbreite für den Inhalt 60em (Die Breite von 60 "M"s, also von etwa 90 „Normal“-Buchstaben).
Der rechte Rand bleibt weiß. Die Begrenzung der Breite erfolgt, damit das Auge beim Erreichen eines Zeilenendes nicht zu weit zurück gehen muss.
Negativbeispiel ist die Wikipedia, bei der man z.B. bei dieser Seite sehen kann, dass die Zeilenlänge auf großen Monitoren zu breit ist.
Sind die 60 em typisch für ein bestimmtes Gerät?
Das erscheint mir realistisch für Desktop-Systeme. Vielleicht ist in dem Beispiel, das du gefunden hast, die Breite auch bewusst eingeschränkt worden. Die Angabe von max-width lässt das vermuten - es ist eine Obergrenze.
Herzliche Grüße
Matthias Scharwies
Hallo Matthias,
Negativbeispiel ist die Wikipedia, bei der man z.B. bei dieser Seite sehen kann, dass die Zeilenlänge auf großen Monitoren zu breit ist.
das liegt aber daran, dass die Schrifgrösse nicht proportional gross genug. Sonst wäre das m.M.n. richtig, weil je grösser der Monitor umso weiter entfernt davon und dann würde es perfekt passen.
Gruss
Henry
Hallo Henry,
weil je grösser der Monitor umso weiter entfernt davon
Nein.
Meine Augen sind von meinem Monitor die üblichen 80cm entfernt.
Er ist 100cm breit (43" 32:10 Format). Selbst im halben Vollbild (was einem 24" Fullscreen entspricht) ist der Wikipedia Inhalt viel zu breit.
Rolf
Hallo Rolf,
Hallo Henry,
Meine Augen sind von meinem Monitor die üblichen 80cm entfernt.
aber schon sehr nah bei den Abmessungen oder?
Er ist 100cm breit (43" 32:10 Format). Selbst im halben Vollbild (was einem 24" Fullscreen entspricht) ist der Wikipedia Inhalt viel zu breit.
Bei welcher ZoomStufe des Browsers ensteht bei dir dann die optimale Lesemöglichkeit? Würde mich mal interessieren.
Gruss
Henry
Hallo,
weil je grösser der Monitor umso weiter entfernt davon
Nein.
Meine Augen sind von meinem Monitor die üblichen 80cm entfernt.
oh. Aus der Entfernung könnte ich auf meinen Monitoren nicht mehr viel lesen (2 Stück à 22" mit 1600x1200). Die typische Entfernung ist daher eher 40..50cm.
Er ist 100cm breit (43" 32:10 Format). Selbst im halben Vollbild (was einem 24" Fullscreen entspricht) ist der Wikipedia Inhalt viel zu breit.
Das zeigt mir mal wieder: Widescreen-Formate sind Mist. Beim Fernsehen ebenso wie beim Computer. Ich fand das jahrelang übliche 4:3-Format optimal. Gern auch zwei getrennte Monitore in diesem Format nebeneinander (das ist mein Setup).
Live long and pros healthy,
Martin
Hallo Martin,
nein, ich habe bewusst von 2x24" auf 1x43" gewechselt. Man gewinnt dadurch deutlich an Flexibilität, wo man die Trennlinie zieht, und hey, wenn ein Videostream im Cinemascope-Format die schwarzen Balken nicht mehr oben und unten hat, sondern nur je 13cm links und rechts, ist das sowas von boah ey… 😀
Ich habe als erstes die Windows-Taste + Pfeil Shortcuts reaktiviert. Bei normalen Bildschirmen nerven die, beim Ultrawide-Screen sind sie praktisch. Win+Links: Fenster füllt die linke Bildschirmhälfte und Windows fragt, womit es die rechte Hälfte füllen soll (was man aber nicht muss). Aber, wenn man es tut (oder mit Win+Rechts die rechte Seite füllt, kann man die Trennlinie beliebig verschieben und hat dann nach Wunsch eine 50/50 Teilung, oder 60/40. Das ist praktisch beim Entwickeln. Und Visual Studio im 32:10 Format hat auch was.
Ich habe übrigens bewusst einen 32:10 curved Bildschirm gekauft (3840x1200). Diese 120 Pixel mehr machen sich deutlich bemerkbar. Die Krümmung auch; wäre das Ding flach, wären die Seiten zu weit weg.
Rolf
Servus!
Hallo Henry,
weil je grösser der Monitor umso weiter entfernt davon
Nein.
Meine Augen sind von meinem Monitor die üblichen 80cm entfernt.
mich grad gewundert, wie weit das ist und nachgemessen: bei mir ca. 75cm.
Er ist 100cm breit (43" 32:10 Format).
haben will. (Meine Frau würd mich umbringen!)
Herzliche Grüße
Matthias Scharwies
@@Konrad
body { max-width: 60em; .... }
Das bedeutet, dass das body-Element maximal so breit ist wie das 60fache der Schriftgröße.
Was passiert, wenn die Viewportbreite größer ist?
Dann erreicht die Breite des body-Elements diesen Maximalwert.
Links und rechts schwarze Flächen?
Das hängt vom übrigen CSS-Code ab.
Sind die 60 em typisch für ein bestimmtes Gerät?
Nein.
Responsive web design (= web design[1]) ist niemals auf ein bestimmtes Gerät gemünzt.
😷 LLAP
Hallo Konrad,
Links und rechts schwarze Flächen?
Solange Du nur max-width angibst, nein. Weil der Body linksbündig sein wird.
Eine Zentrierung erreichst Du mit margin: auto;, das verteilt nach links und rechts den freien Platz. Nach oben hin hast Du dann keinen Rand mehr. Die Browser setzen normalerweise einen kleinen margin für den Body, wenn Du den oben und unten behalten willst, nimm margin: 8px auto;
Wie die freien Flächen aussehen, hängt von der Hintergrundfarbe oder dem Hintergrundbild des body ab. Diese füllen das Fenster immer aus.
Rolf