| OLD | NEW |
| (Empty) | |
| 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/x
html1/DTD/xhtml1-strict.dtd"> |
| 2 <html xmlns="http://www.w3.org/1999/xhtml"> |
| 3 <head> |
| 4 <title>CSS Test: Clearance calculations - clear box non-collapsing margi
ns with larger clearance than margins</title> |
| 5 <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> |
| 6 <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#flow-cont
rol" /> |
| 7 <link rel="match" href="clear-clearance-calculation-002-ref.xht" /> |
| 8 |
| 9 <meta name="flags" content="ahem image" /> |
| 10 <meta name="assert" content="If after margin collapsing the position of
the cleared element is above or hypothetically positioned within the layout posi
tion of the float. Then the cleared element is positioned directly below the flo
ated element." /> |
| 11 <!-- C1 = H-M2 --> |
| 12 <!-- C2 = Max(M1, M2) - M1 - M2 --> |
| 13 <style type="text/css"> |
| 14 div |
| 15 { |
| 16 font: 20px/1em Ahem; |
| 17 width: 5em; |
| 18 } |
| 19 #parent |
| 20 { |
| 21 background: url('support/clear-clearance-calculation-002.png'); |
| 22 min-height: 8em; |
| 23 } |
| 24 div div |
| 25 { |
| 26 background: green; |
| 27 height: 1em; |
| 28 } |
| 29 #div1 |
| 30 { |
| 31 margin-bottom: 4em; |
| 32 } |
| 33 #div2 |
| 34 { |
| 35 float: left; |
| 36 height: 2em; |
| 37 margin: 0; |
| 38 } |
| 39 #div3 |
| 40 { |
| 41 clear: left; |
| 42 margin-top: 3em; |
| 43 } |
| 44 </style> |
| 45 </head> |
| 46 <body> |
| 47 <p>Test passes if there is no red.</p> |
| 48 <div id="parent"> |
| 49 <div id="div1"></div> |
| 50 <div id="div2"></div> |
| 51 <div id="div3"></div> |
| 52 </div> |
| 53 </body> |
| 54 </html> |
| OLD | NEW |