Floating Content
Many current implementations in HTML make use of responsive designs. The challenge is to try and replicate this HTML into the printed page. The trigger here is the float element. We will start with an easy example, how about replicating a drop-cap.
Now, a slightly more complex design that one would expect from a javascript solution like Twitter Bootstrap would appear like this.
Column 1
No est erat amet nulla takimata no sed esse clita gubergren veniam at. Ipsum diam dolor dolor invidunt. Diam sit sit sed iriure ea nonumy sit vel. Delenit ut delenit imperdiet dolor dolor sed ipsum labore lorem accusam ut tempor at dolores invidunt. Eros lorem vulputate labore odio no dignissim justo diam lorem amet lorem labore dolores nulla. Ut lorem sed ea sed nulla. Clita eirmod consequat tempor nisl nibh luptatum at consetetur te elitr feugiat dolor sea amet diam. Consetetur sed clita sed sea eirmod aliquam. Nostrud sit molestie vero te et sit lorem sit at amet et.
Column 2
Exerci tincidunt vel et sed sadipscing est at voluptua ut accusam ut accusam erat magna consectetuer. Sanctus dolore vero sed dolore erat delenit. In veniam consequat delenit eleifend lorem. Accusam hendrerit praesent nisl invidunt ut accusam diam diam molestie at accusam sanctus amet lorem diam dolores. Lorem diam nonumy lorem amet invidunt doming lorem iriure odio quis accusam amet amet elit ea amet. Dolores in duis amet ut est dolor nonumy consequat eros takimata velit at dolor zzril quod. Rebum sit et et nulla. Tempor veniam et adipiscing diam et rebum diam sed illum et gubergren sadipscing tincidunt sanctus lorem et invidunt.
Column 3
Duo sed qui lorem voluptua sed dolor labore zzril vel nonumy sit eirmod adipiscing. Vero dignissim elitr takimata sit sit dolor et sanctus accusam tincidunt sanctus ea lorem. Duo ea gubergren sadipscing sadipscing amet sea labore ut ea tincidunt ipsum sadipscing nonummy sed at et dolore dolor. Dolor nostrud erat sed lobortis dolores at augue. Et justo invidunt dolore nam ea ipsum volutpat nostrud nonumy magna commodo consequat molestie ut diam accusam nonummy sea. Sit nisl dolor consectetuer est laoreet sea accusam et nonumy voluptua. Amet sanctus eos nonumy molestie duo erat minim eros et diam at tempor justo luptatum esse labore et. Suscipit vel eirmod et doming consetetur eos at aliquyam takimata eu dolor velit stet clita lorem nonummy eos magna. Ut est amet duo vero rebum. Sit ipsum at et duo rebum takimata diam nisl sed sed sed invidunt lorem.
And this paragraph would appear after the floats. It has "clear" both to clear the floats.