Happy Codings - Programming Code Examples
Html Css Web Design Sample Codes CPlusPlus Programming Sample Codes JavaScript Programming Sample Codes C Programming Sample Codes CSharp Programming Sample Codes Java Programming Sample Codes Php Programming Sample Codes Visual Basic Programming Sample Codes


HTML & CSS Web Design

Html Css > Code Examples

Right-extended and Top-extended Float

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54
Right-extended and Top-extended Float <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Right Extended And Top Extended Float</title> <style type="text/css" media="Screen"> .parent{ width: 900px; height: 600px; background: pink; } * .float-right { float: right; background: red; } * .widened { width: 200px; background: green; } * .top-extended { margin-top: 25px; background: purple; } * .right-extended { margin-right: 130px; background: aqua; } </style> </head> <body> <div class="parent" > <p class="float-right widened right-extended top-extended"> Right-extended and Top-extended Float<br><br> Love works in miracles every day:<br> such as weakening the strong, and stretching the weak;<br> making fools of the wise, and wise men of fools;<br> favouring the passions, destroying reason, and in a word,<br> turning everything topsy-turvy.<br><br> Marguerite De Valois </p> </div> </body> </html>