relative-float-2-ref.html (1421B)
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 height: 100px; 10 width: 100px 11 } 12 #b { 13 position: relative; 14 top: 20px; 15 left: 20px; 16 height: 100px; 17 width: 100px; 18 background: blue 19 } 20 </style> 21 </head> 22 <body> 23 <div id="a"> 24 <div id="b"> 25 </div> 26 </div> 27 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. 28 <br>Duis odio est, cursus non adipiscing at, fringilla quis eros. 29 <br>Sed volutpat nibh sit amet ante molestie a vehicula nulla gravida. 30 <br>Mauris elementum cursus urna id vestibulum. 31 <br>Etiam volutpat odio tincidunt libero ullamcorper elementum. 32 <br>Suspendisse potenti. 33 <br>Ut ut arcu lorem. 34 <br>Integer mi sapien, porta a pharetra et, varius laoreet eros. 35 <br>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. 36 <br>Sed ut mi at elit consequat aliquam id eu lectus. 37 <br>Etiam tincidunt diam et ante ullamcorper a convallis erat lobortis. 38 <br>Sed blandit ultrices dui et bibendum. 39 <br>Sed condimentum velit eget nibh rutrum cursus. 40 <br>Quisque pretium iaculis gravida. 41 <br>Proin risus eros, iaculis quis fermentum a, adipiscing id mauris. 42 </p> 43 </body> 44 </html>