Behind Horizon
| innovative
| modern
| dynamic

Dynamische Boxen

Ab einer Bildschirmbreite von 940 Pixel sehen Sie oberhalb eine Boxen-Reihe mit 3 Boxen nebeneinander sowie unterhalb eine Boxen-Reihe mit 2 Boxen nebeneinander. Diese Boxen sind dynamisch und flexibel, denn sie passen sich automatisch bezgl. der Höhe an, so das alle Boxen auf einer Linie gleich abschließen, egal wieviel Inhalt die einzelne Box hat. Die Box mit dem meisten Inhalt bestimmt also die Höhe aller Boxen in einer Reihe, d.h. die anderen Boxen mit weniger Inhalt passen sich automatisch an.

Das funktioniert deshalb, weil wir diese div-Container nicht mit "float" belegen. Statt dessen bekommt der entsprechende äußere div-Container den Wert display:table sowie der innere div-Container den Wert display:table-cell. Das bewirkt, das sich die Boxen wie normale HTML-Tabellen verhalten. Ein weiterer Vorteil ist die vertikale Anordnung des Inhalts (oben, mitte, unten) welche jetzt ganz leicht mit dem Befehl "vertical-align: top/middle/bottom" funktioniert. Auf den verlinkten Seiten "Information 1-4" zeigen wir die vertikale (sowie horizontale) Ausrichtung im Beispiel.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores es.

Responsive Webdesign

Ein Layout für viele Auflösungen

Dies ist ein Responsive Webdesign (RWD). Mit der RWD-Technik wird versucht, das Layout an verschiedene Bildschirmgrößen anzupassen. Es gibt nur eine einziges Layout, das sich aber flexibel den unterschiedlich großen Displays wie Desktop-PCs, Laptops, Notebooks, Tablets, Smartphones, E-Book-Reader usw. anpaßt. In der Regel geschieht dies durch Layouts, welche in Prozent statt absoluten Pixelgrößen angelegt sind und insbesondere durch die Verwendung von CSS3-Media Queries.


Icons Social Media

Hinweis: Die Social Media Icons im Fussbereich stammen von iconsandcoffee.com


Warum Responsive?

Warum ist "Responsive Webdesign" eigentlich so wichtig?

Weil es mehr als nur ein Trend ist! Vielmehr ist es eine Entwicklung, eine Technik-Schraube, welche sich nicht mehr zurückdrehen läßt. Denn die Nachfrage mittels mobiler Geräte wird sich immer weiter steigern, mittlerweile ist "Responsive" gar ein wichtiges Merkmal für das Google-Suchmaschinen-Ranking.


Schon verlinkt.

Klicken Sie die Links "Information 1-4", welche wir als Beispiel im Hauptmenü bereits verlinkt haben und dort weitere Hinweise für Sie bereitstellen.

Weiter zu Information 01.
© 2020 DESIGN Behind Horizon