| <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
| <html> |
| <head> |
| <title>CSS Test: Avoid nested floats in previous siblings</title> |
| <link rel="author" title="WebKit" href="http://www.webkit.org/"> |
| <style type="text/css"> |
| #container |
| { |
| background-color:green; |
| width: 400px; |
| overflow: hidden; |
| height:40px |
| } |
| #div1 |
| { |
| height: 40px; |
| } |
| #float-right |
| { |
| float: right; |
| height: 40px; |
| width: 400px; |
| background-color: green; |
| } |
| #div2 |
| { |
| /*'overflow: hidden' forces the div to avoid floats*/ |
| overflow: hidden; |
| margin-top: -30px; |
| font: 20px Ahem; |
| color: red; |
| } |
| </style> |
| </head> |
| <body> |
| <p>There should be no red below.</p> |
| <div id="container"> |
| <div id="div1"> |
| <div id="float-right"></div> |
| </div> |
| <div id="div2">Text</div> |
| </div> |
| </body> |
| </html> |
