stephenhay · October 7, 2011 11:48
diff --git a/index.html b/index.html
 <!DOCTYPE html>

 <html lang="en">

    <head>
        <meta charset="utf-8">
        <title>Regions test</title>

        <style>
            /* A section is a slide. It's size is 800x600, and this will never change */
            section {
                padding: 0 10%;
                display: -webkit-box;
                display: -moz-box;
                -webkit-box-orient: vertical;
                -webkit-box-pack: center;
                -moz-box-orient: vertical;
                -moz-box-pack: center;
            }
            /* embedded examples */
            .example {
                background-color: white;
            }
            .example h1 {
                font-family: sans-serif;
                text-transform:capitalize;
                margin-top: 1em;
                text-align: left;
            }
            .example p {
                font-family: serif;
                margin-top: 1.5em;
                margin-bottom: 1.5em;
                line-height: 1.5;
            }
            .story {
            }
            #simple .src {
                -webkit-flow: "simple";
            }
            #one, #two, #three{
                float: left;
                margin: 0 10px;
            }
            #one, #two, #three {
                content: -webkit-from-flow("simple");
            }
            .one {
                width: 100%;
                height: 9em;
            }
            .two,
            .three {
                width: 45%;
                height: 400px;
            }
            @media only screen and (max-width: 800px) {
            .two,
            .three {
                width: 100%;
                height: 400px;
            }
            }
            .lead { font-style:italic; color: red; }
            .show { border: 1px solid red; }
        </style>
    </head>

    <body>


        <section>
        <div id="simple" class="example">
            <div class="src">
                <h1>The world of print is upon us</h1>
                <p class="lead">'Yes, we went to school in the sea, though you mayn't believe it&mdash;' 'I never said I didn't!' interrupted Alice. 'You did,' said the Mock Turtle. 'Hold your tongue!' added the Gryphon, before Alice could speak again.</p>
                <p class="story">"What's a lady?" Hoo-Hoo demanded. "A lady 's a Chauffeur squaw," was the quick reply of Hare-Lip. "The first Chauffeur was Bill, a common fellow, as I said before," the  old man expounded; "but his wife was a lady, a great lady. Before the  Scarlet Death she was the wife of Van Worden. He was President of the  Board of Industrial Magnates, and was one of the dozen men who  ruled America. He was worth one billion, eight hundred millions of  dollars&mdash;coins like you have there in your pouch, Edwin. And then came  the Scarlet Death, and his wife became the wife of Bill, the first  Chauffeur. He used to beat her, too.</p>
                <p>"No chance there," thought he. The worthy fellow had certainly taken
                good care to eat as hearty a breakfast as possible before leaving the
                Carnatic; but, as he had been walking about all day, the demands of
                hunger were becoming importunate. He observed that the butchers stalls
                contained neither mutton, goat, nor pork; and, knowing also that it is
                a sacrilege to kill cattle, which are preserved solely for farming, he
                made up his mind that meat was far from plentiful in Yokohama&mdash;nor
                was he mistaken; and, in default of butcher's meat, he could have
                wished for a quarter of wild boar or deer, a partridge, or some quails,
                some game or fish, which, with rice, the Japanese eat almost
                exclusively. </p>
                <p>Lacus tempor faucibus. In hac habitasse platea dictumst. Vivamus a orci at
                nulla tristique condimentum. Donec arcu quam, dictum accumsan, convallis
                accumsan, cursus sit amet, ipsum. In pharetra sagittis nunc. Donec consequat mi. Quisque vitae dolor. Integer lobortis. Maecenas id
                nulla. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed volutpat
                felis vitae dui. Vestibulum et est ac ligula dapibus elementum. Nunc suscipit
                nisl eu felis. Duis nec tortor. Nullam diam libero, semper id, consequat in,
                consectetuer ut, metus. Phasellus dui purus, vehicula sed, venenatis a, rutrum
                at, nunc. Pellentesque interdum sapien nec neque.</p>

                <p>Vivamus sagittis, sem sit amet porttitor lobortis, turpis sapien consequat
                orci, sed commodo nulla pede eget sem. Phasellus sollicitudin. Proin orci erat,
                blandit ut, molestie sed, fringilla non, odio. Nulla porta, tortor non suscipit
                gravida, velit enim aliquam quam, nec condimentum orci augue vel magna. Nulla
                facilisi. Donec ipsum enim, congue in, tempus id, pulvinar sagittis, leo. Donec
                et elit in nunc blandit auctor. Nulla congue urna quis lorem. Nam rhoncus pede
                sed nunc. Etiam vitae quam. Fusce feugiat.</p>

            </div>
            <div id="one" class="one"></div>
            <div id="two" class="two"></div>
            <div id="three" class="three"></div>
        </div>
        </section>


    </body>
 </html>
	<!DOCTYPE html>

	<html lang="en">

	<head>
	<meta charset="utf-8">
	<title>Regions test</title>

	<style>
	/* A section is a slide. It's size is 800x600, and this will never change */
	section {
	padding: 0 10%;
	display: -webkit-box;
	display: -moz-box;
	-webkit-box-orient: vertical;
	-webkit-box-pack: center;
	-moz-box-orient: vertical;
	-moz-box-pack: center;
	}
	/* embedded examples */
	.example {
	background-color: white;
	}
	.example h1 {
	font-family: sans-serif;
	text-transform:capitalize;
	margin-top: 1em;
	text-align: left;
	}
	.example p {
	font-family: serif;
	margin-top: 1.5em;
	margin-bottom: 1.5em;
	line-height: 1.5;
	}
	.story {
	}
	#simple .src {
	-webkit-flow: "simple";
	}
	#one, #two, #three{
	float: left;
	margin: 0 10px;
	}
	#one, #two, #three {
	content: -webkit-from-flow("simple");
	}
	.one {
	width: 100%;
	height: 9em;
	}
	.two,
	.three {
	width: 45%;
	height: 400px;
	}
	@media only screen and (max-width: 800px) {
	.two,
	.three {
	width: 100%;
	height: 400px;
	}
	}
	.lead { font-style:italic; color: red; }
	.show { border: 1px solid red; }
	</style>
	</head>

	<body>


	<section>
	<div id="simple" class="example">
	<div class="src">
	<h1>The world of print is upon us</h1>
	<p class="lead">'Yes, we went to school in the sea, though you mayn't believe it—' 'I never said I didn't!' interrupted Alice. 'You did,' said the Mock Turtle. 'Hold your tongue!' added the Gryphon, before Alice could speak again.</p>
	<p class="story">"What's a lady?" Hoo-Hoo demanded. "A lady 's a Chauffeur squaw," was the quick reply of Hare-Lip. "The first Chauffeur was Bill, a common fellow, as I said before," the old man expounded; "but his wife was a lady, a great lady. Before the Scarlet Death she was the wife of Van Worden. He was President of the Board of Industrial Magnates, and was one of the dozen men who ruled America. He was worth one billion, eight hundred millions of dollars—coins like you have there in your pouch, Edwin. And then came the Scarlet Death, and his wife became the wife of Bill, the first Chauffeur. He used to beat her, too.</p>
	<p>"No chance there," thought he. The worthy fellow had certainly taken
	good care to eat as hearty a breakfast as possible before leaving the
	Carnatic; but, as he had been walking about all day, the demands of
	hunger were becoming importunate. He observed that the butchers stalls
	contained neither mutton, goat, nor pork; and, knowing also that it is
	a sacrilege to kill cattle, which are preserved solely for farming, he
	made up his mind that meat was far from plentiful in Yokohama—nor
	was he mistaken; and, in default of butcher's meat, he could have
	wished for a quarter of wild boar or deer, a partridge, or some quails,
	some game or fish, which, with rice, the Japanese eat almost
	exclusively. </p>
	<p>Lacus tempor faucibus. In hac habitasse platea dictumst. Vivamus a orci at
	nulla tristique condimentum. Donec arcu quam, dictum accumsan, convallis
	accumsan, cursus sit amet, ipsum. In pharetra sagittis nunc. Donec consequat mi. Quisque vitae dolor. Integer lobortis. Maecenas id
	nulla. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed volutpat
	felis vitae dui. Vestibulum et est ac ligula dapibus elementum. Nunc suscipit
	nisl eu felis. Duis nec tortor. Nullam diam libero, semper id, consequat in,
	consectetuer ut, metus. Phasellus dui purus, vehicula sed, venenatis a, rutrum
	at, nunc. Pellentesque interdum sapien nec neque.</p>

	<p>Vivamus sagittis, sem sit amet porttitor lobortis, turpis sapien consequat
	orci, sed commodo nulla pede eget sem. Phasellus sollicitudin. Proin orci erat,
	blandit ut, molestie sed, fringilla non, odio. Nulla porta, tortor non suscipit
	gravida, velit enim aliquam quam, nec condimentum orci augue vel magna. Nulla
	facilisi. Donec ipsum enim, congue in, tempus id, pulvinar sagittis, leo. Donec
	et elit in nunc blandit auctor. Nulla congue urna quis lorem. Nam rhoncus pede
	sed nunc. Etiam vitae quam. Fusce feugiat.</p>

	</div>
	<div id="one" class="one"></div>
	<div id="two" class="two"></div>
	<div id="three" class="three"></div>
	</div>
	</section>


	</body>
	</html>