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
Iusto vulputate dolor et lorem ut iusto sadipscing soluta. At elitr accusam ut elitr elit et et stet tincidunt rebum gubergren magna possim stet exerci sea justo ipsum. Elitr et duo et elitr no eum diam. Amet sed lorem consetetur diam kasd diam sed gubergren voluptua justo. At eirmod nibh invidunt kasd sanctus nonumy. Gubergren te esse diam diam commodo tation eum nonumy nulla eos amet diam invidunt at consequat kasd praesent. Vero invidunt aliquyam lorem dolor et ea ut et sed diam ea dolore placerat amet duo. Sea stet sit eos eos dolor accusam consequat eos et autem dignissim dolor aliquyam no amet. Nulla et erat dolore sanctus takimata kasd invidunt et soluta at stet kasd sadipscing diam et. Nonumy ipsum molestie duo est commodo eos dolore vero rebum dolores amet tempor clita tempor invidunt accusam. Aliquyam accusam velit commodo.
Column 2
Tempor lorem amet rebum assum clita voluptua accusam ipsum ut diam aliquyam euismod rebum. Tempor exerci sit dolore consetetur iriure diam lorem lorem in voluptua in. Sed ut amet est sadipscing amet aliquyam accusam dolores sea sit duis tempor aliquyam ut. Accusam nibh nibh elitr lobortis vero erat sadipscing vel amet id sit et. Autem exerci lorem at vero stet sed tempor eirmod sit et invidunt qui duis sit accusam facilisi. Nulla no ut kasd justo ipsum clita et lorem tation. Dolor qui labore gubergren lobortis magna dolor sanctus. Et nisl justo dolores nonumy sed no duo elitr ad elitr. Esse kasd nonumy eirmod sadipscing amet tempor diam dolore diam. Ipsum et diam ea.
Column 3
Clita dolor duo ea ea dolore diam diam erat placerat diam nonumy clita sed sanctus et et. Nulla amet accusam ipsum ipsum at vel te aliquip id lorem dolor ea diam. Elitr aliquyam ipsum takimata labore. Duo lorem lorem at sed amet eirmod nonumy exerci dolore sanctus clita. At ipsum diam eu. Consetetur ipsum hendrerit sanctus quis accumsan dolores diam amet diam accusam dolore. Nulla iusto ipsum diam dolor eos ut sanctus at suscipit aliquyam sit vero sadipscing velit dolor ut takimata dolor. Sadipscing consectetuer dolor ut veniam lorem sea feugait dolore blandit. Ut vero minim ipsum sed consetetur invidunt takimata dolores no congue invidunt. Amet gubergren vulputate magna. At veniam consequat justo duo et diam at duo eum diam.
And this paragraph would appear after the floats. It has "clear" both to clear the floats.