Ganze Breite
Nachfolgend sind die Möglichkeiten aufgezeigt, wie man Content-Elemente mit unterschiedlichen Breiten darstellen kann. Es wird das Css-Framework Foundation eingesetzt. Alle Content-Elemente befinden sich in einem Flex-Container.
In den Überschriften sind die gängigen Dimensionen 'large / medium / small' aufgeführt. Indem das Browser-Fenster verkleinert wird, sieht man den Effekt, wie sich die Breiten und die Höhen der einzelnen Content-Elemente je nach Bildschirmgröße verändern.
Breite 6 / 6 / 12
Nunc congue nisi, vitae suscipit tellus mauris.Laoreet sit amet cursus sit amet, dictum sit amet. Sapien pellentesque habitant morbi tristique senectus et netus. Ut venenatis tellus in metus vulputate.
Breite 6 / 6 / 12
Nunc congue nisi, vitae suscipit tellus mauris.Laoreet sit amet cursus sit amet, dictum sit amet. Sapien pellentesque habitant morbi tristique senectus et netus. Ut venenatis tellus in metus vulputate.
Breite 4 / 6 / 6
Cursus sit amet, dictum sit amet. Commodo quis imperdiet massa tincidunt. Mauris rhoncus aenean vel elit scelerisque mauris pellentesque pulvinar.
Breite 4 / 6 / 6
Cursus sit amet, dictum sit amet. Commodo quis imperdiet massa tincidunt. Mauris rhoncus aenean vel elit scelerisque mauris pellentesque pulvinar.
Breite 4 / 12 / 12
Cursus sit amet, dictum sit amet. Commodo quis imperdiet massa tincidunt. Mauris rhoncus aenean vel elit scelerisque mauris pellentesque pulvinar.
Breite 3 / 4 / 6
Amet, mattis vulputate enim nulla aliquet porttitor lacus, luctus. In nisl nisi, scelerisque eu ultrices vitae.
Breite 3 / 4 / 6
Amet, mattis vulputate enim nulla aliquet porttitor lacus, luctus. In nisl nisi, scelerisque eu ultrices vitae.