Source code file: app/views/position/page1.html.erb:
<h3>Position Example</h3> <div id="a"> Content: a<br /> Position: static </div> <div id="b"> Content: b<br /> Position: absolute </div> <div id="c"> Content: c<br /> Position: relative </div> <div id="d"> Content: d<br /> Position: fixed </div> <div id="e"> Content: e<br /> Position: static </div> <div id="f"> <p>Position: relative<br /> Content: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vitae nibh id ligula ornare tempus. Aenean at leo eu odio consectetur finibus eget ut justo. Etiam neque massa, tempus sed consequat nec, euismod in augue. Morbi vel lectus varius, vestibulum sem et, vestibulum odio. Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec auctor lacus et porttitor porta. Etiam vitae pellentesque sem. Praesent a cursus diam. Donec sollicitudin vulputate metus dapibus laoreet. Mauris lectus urna, malesuada pellentesque tortor et, gravida suscipit ex.</p> <p>Maecenas scelerisque tellus id sapien vestibulum rutrum. Duis accumsan turpis at sem suscipit scelerisque. Sed non eleifend sapien. Proin mauris leo, malesuada at aliquam vel, commodo nec ante. Proin commodo tellus ultricies venenatis faucibus. Aliquam feugiat magna sit amet libero gravida tempus. Mauris hendrerit lectus sed placerat dignissim. Vivamus sagittis urna et odio venenatis, ut ultricies dolor volutpat. Nunc vel dolor fringilla, efficitur diam aliquam, viverra magna. Vivamus semper condimentum ligula, quis lacinia elit venenatis at. Duis hendrerit, ligula vitae malesuada interdum, purus nibh vestibulum mi, eu dictum quam tortor et mauris. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.</p> <p>Donec volutpat maximus porta. In dictum scelerisque quam. Donec ac sapien placerat, eleifend erat vitae, fermentum nisi. Vestibulum vulputate, metus eget tempor posuere, orci lacus viverra ex, vel tempus dui diam eget nunc. Aliquam facilisis neque in lacus finibus mollis. Suspendisse velit mauris, blandit id tincidunt nec, lacinia ornare ex. Vestibulum pretium mi eu mattis semper. Vivamus id sagittis eros. Pellentesque ut pretium ipsum. Vestibulum dapibus egestas turpis, nec porta felis cursus vitae. Aenean et quam at purus laoreet feugiat ac ac diam. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin id eros vel ipsum tincidunt commodo in vitae quam. In ac ornare libero.</p> <p>Proin sit amet augue in neque viverra venenatis non et risus. Aenean vel vestibulum quam, quis sagittis quam. Fusce metus felis, mollis sit amet eros sed, gravida cursus dui. Donec ullamcorper non odio quis sagittis. Sed pulvinar congue neque ut varius. Sed mattis non urna nec gravida. Vestibulum varius libero eget nunc venenatis vulputate. Nunc vehicula ornare nisi eu ultrices.</p> <p>Sed porta vel nisi vel posuere. Pellentesque porttitor mauris risus, a lacinia purus blandit in. Curabitur eu venenatis risus, id varius dolor. Sed quam nisl, rhoncus eget molestie nec, ultricies at est. Pellentesque malesuada est turpis, ac tristique diam placerat sed. Vestibulum viverra lorem vel dolor blandit scelerisque. Praesent tempor, odio sit amet tincidunt euismod, sem ex semper lorem, at blandit lorem est ut augue. Vivamus sed porta metus. Aliquam erat volutpat. Curabitur maximus quis arcu vitae suscipit. Sed velit orci, interdum ac condimentum eu, finibus at nisl. In non turpis laoreet, feugiat enim consequat, posuere nulla. Donec imperdiet iaculis pharetra.</p> </div>