<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>CSS Test: Containing Blocks - Inline-level elements position based on left-to-right direction and parent element is fixed</title> <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> <link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#containing-block-details" /> <meta name="flags" content="" /> <meta name="assert" content="If the ancestor is inline-level, positioned absolute, and direction is left-to-right, the top/left of the containing block determines the top/left padding edges of the first box generated by the ancestor." /> <style type="text/css"> div { border: solid black; padding: 1in; position: fixed; width: 0; } #span1 { direction: ltr; } span span { background: blue; height: 1in; position: absolute; width: 1in; } </style> </head> <body> <p>Test passes if the filled blue square is in the <strong>lower-right corner</strong> of the hollow black square.</p> <div> <span id="span1"> <span></span> </span> </div> </body> </html>