position-relative-009

Over-constrained situation with position 'left' property

WeasyPrint

This browser

Assertion
If the 'direction' property of the containing block is 'ltr', the value of 'left' wins and 'right' becomes negative 'left'.

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html>
 3     <head>
 4         <title>CSS Test: Over-constrained situation with position 'left' property</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#positioning-scheme">
 7         <meta name="flags" content="">
 8         <meta name="assert" content="If the 'direction' property of the containing block is 'ltr', the value of 'left' wins and 'right' becomes negative 'left'.">
 9         <style type="text/css">
10             div
11             {
12                 height: 1in;
13                 width: 1in;
14             }
15             #div1
16             {
17                 background: orange;
18             }
19             #div2
20             {
21                 background: blue;
22                 left: 1in;
23                 position: relative;
24                 right: 1in;
25                 top: -1in;
26             }
27         </style>
28     </head>
29     <body>
30         <p>Test passes if the blue box is to the right of the orange box.</p>
31         <div id="div1"></div>
32         <div id="div2"></div>
33     </body>
34 </html>