4-Spalter

Schließlich noch den einfachen 4-Spalter (feste 25% breite Spalten)

1. Spalte

Pellentesque facilisis convallis ligula at lobortis. Sed ultricies mattis mauris; in fringilla justo elementum eu. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi eget nibh faucibus, imperdiet lorem eget; efficitur turpis. Nulla blandit massa a leo accumsan, ac scelerisque risus maximus. Mauris ex tellus, porta vel sem sed, gravida consectetur orci. Proin pulvinar justo nunc, vel sagittis sapien porta sit amet. Nunc eu interdum sapien, ut bibendum sem. Quisque tempus posuere mi nec commodo. Curabitur maximus molestie tellus; vitae aliquam justo vestibulum tempus. Ut eget ante id est facilisis pharetra sit amet vitae sapien. Maecenas posuere vehicula feugiat. Donec eu pretium magna. Aenean molestie convallis ante, sed tincidunt massa pellentesque a. Donec in lorem euismod, sollicitudin odio id, tempor est. Vestibulum sed nisi sed felis malesuada fermentum at eu risus.

2. Spalte

Eine Spalte kann wackeln! Integer posuere tortor mauris, in congue felis tempus et. Duis tristique porttitor elementum. Ut id efficitur lectus. Fusce urna magna, accumsan in bibendum ut, porta et nunc. Quisque lacus odio, consectetur sed ante sed, rhoncus consectetur urna. Vestibulum porttitor lorem nec vestibulum consectetur. Etiam molestie velit in mattis vestibulum. Praesent dignissim urna in tortor feugiat, et vehicula mauris tempor. Mauris sed massa at ex tincidunt lacinia! Nam non purus justo. Sed massa velit, euismod a lorem eu, porta elementum dolor. Sed facilisis dui non elementum pretium. Sed id nisi ex. Praesent tempus molestie eros, sit amet molestie eros semper non. Nunc porttitor vestibulum mauris, non sodales est aliquet vel.

3. Spalte

In tempor a arcu vel viverra. Proin consectetur, urna vel tincidunt rutrum, dui magna ultricies elit, a tempor ligula ex id risus. Etiam nec libero feugiat, congue diam et, tempus est. Nam et laoreet felis, sit amet facilisis augue. Donec malesuada euismod porttitor! Mauris nunc nisl, sodales et ex at; mattis facilisis ligula. Proin vitae ligula ut lorem pretium lacinia vitae eu magna. Vestibulum auctor mattis justo, vel vestibulum purus dignissim sit amet. Donec mollis, risus gravida dictum cursus, massa urna maximus libero, et imperdiet mauris erat ut dui!

4. Spalte

Donec ac velit eu ex vestibulum porttitor vel lobortis nibh. Pellentesque augue libero, congue a efficitur quis; convallis ut est. Aliquam erat volutpat. Sed vel dignissim metus. Morbi pulvinar metus sit amet nisl efficitur porta. Aenean efficitur mollis nibh, et convallis quam hendrerit id. Proin tristique neque odio, vitae pulvinar lorem placerat non. Sed venenatis orci sit amet ante posuere convallis. Phasellus bibendum, arcu vel finibus viverra, diam sem placerat dolor, sit amet tempus ligula dui eu neque. In vel magna et nibh ultricies euismod. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sapien quam, tempus ut nulla et, ultrices vestibulum leo.


4-Spalter mit farbigen Spaltenhintergründen und gleich langen Spalten.Die Länge orientiert am "längsten" Inhalte einer Spalte.
– mit begrenzter Gesamtbreite von max. 1200px - mittig –

1. Spalte

Pellentesque facilisis convallis ligula at lobortis. Sed ultricies mattis mauris; in fringilla justo elementum eu. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi eget nibh faucibus, imperdiet lorem eget; efficitur turpis. Nulla blandit massa a leo accumsan, ac scelerisque risus maximus. Mauris ex tellus, porta vel sem sed, gravida consectetur orci. Proin pulvinar justo nunc, vel sagittis sapien porta sit amet. Nunc eu interdum sapien, ut bibendum sem. Quisque tempus posuere mi nec commodo. Curabitur maximus molestie tellus; vitae aliquam justo vestibulum tempus. Ut eget ante id est facilisis pharetra sit amet vitae sapien. Maecenas posuere vehicula feugiat. Donec eu pretium magna. Aenean molestie convallis ante, sed tincidunt massa pellentesque a. Donec in lorem euismod, sollicitudin odio id, tempor est. Vestibulum sed nisi sed felis malesuada fermentum at eu risus.

2. Spalte

Integer posuere tortor mauris, in congue felis tempus et. Duis tristique porttitor elementum. Ut id efficitur lectus. Fusce urna magna, accumsan in bibendum ut, porta et nunc. Quisque lacus odio, consectetur sed ante sed, rhoncus consectetur urna. Vestibulum porttitor lorem nec vestibulum consectetur. Etiam molestie velit in mattis vestibulum. Praesent dignissim urna in tortor feugiat, et vehicula mauris tempor. Mauris sed massa at ex tincidunt lacinia! Nam non purus justo. Sed massa velit, euismod a lorem eu, porta elementum dolor. Sed facilisis dui non elementum pretium. Sed id nisi ex. Praesent tempus molestie eros, sit amet molestie eros semper non. Nunc porttitor vestibulum mauris, non sodales est aliquet vel.

3. Spalte

Mauris nunc nisl, sodales et ex at; mattis facilisis ligula. Proin vitae ligula ut lorem pretium lacinia vitae eu magna. Vestibulum auctor mattis justo, vel vestibulum purus dignissim sit amet. Donec mollis, risus gravida dictum cursus, massa urna maximus libero, et imperdiet mauris erat ut dui!

4. Spalte

Donec ac velit eu ex vestibulum porttitor vel lobortis nibh. Pellentesque augue libero, congue a efficitur quis; convallis ut est. Aliquam erat volutpat. Sed vel dignissim metus. Morbi pulvinar metus sit amet nisl efficitur porta.


Man kann diese Rasterelemente auch schachteln. So entstünde aus einem 2-Spalter ein 4-Spalter, wenn man in der linken und rechten Spalte wiederum jeweils einen 2-Spalter einfügen würde.
Aber darauf wären Sie sicher auch selbst gekommen, oder? wink