relative-float-2.html (1321B)
1 <!DOCTYPE html> 2 <!-- Any copyright is dedicated to the Public Domain. 3 - http://creativecommons.org/publicdomain/zero/1.0/ --> 4 <html> 5 <head> 6 <style> 7 #a { 8 float: left; 9 position: relative; 10 top: 20px; 11 left: 20px; 12 height: 100px; 13 width: 100px; 14 background: blue 15 } 16 </style> 17 </head> 18 <body> 19 <div id="a"></div> 20 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. 21 <br>Duis odio est, cursus non adipiscing at, fringilla quis eros. 22 <br>Sed volutpat nibh sit amet ante molestie a vehicula nulla gravida. 23 <br>Mauris elementum cursus urna id vestibulum. 24 <br>Etiam volutpat odio tincidunt libero ullamcorper elementum. 25 <br>Suspendisse potenti. 26 <br>Ut ut arcu lorem. 27 <br>Integer mi sapien, porta a pharetra et, varius laoreet eros. 28 <br>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. 29 <br>Sed ut mi at elit consequat aliquam id eu lectus. 30 <br>Etiam tincidunt diam et ante ullamcorper a convallis erat lobortis. 31 <br>Sed blandit ultrices dui et bibendum. 32 <br>Sed condimentum velit eget nibh rutrum cursus. 33 <br>Quisque pretium iaculis gravida. 34 <br>Proin risus eros, iaculis quis fermentum a, adipiscing id mauris. 35 </p> 36 </body> 37 </html>