bottom-offset-003

Position 'bottom' property defines the offset from the bottom padding edge of the containing block for absolute positioning

WeasyPrint

This browser

Assertion
The 'bottom' property, for absolute positioning, specifies the offset of the element in relation to the containing block's bottom padding edge.

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: Position 'bottom' property defines the offset from the bottom padding edge of the containing block for absolute positioning</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#propdef-bottom">
 7         <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#position-props">
 8         <meta name="flags" content="">
 9         <meta name="assert" content="The 'bottom' property, for absolute positioning, specifies the offset of the element in relation to the containing block's bottom padding edge.">
10         <style type="text/css">
11             #div1
12             {
13                 padding-bottom: 0.5in;
14                 position: relative;
15             }
16             #div2
17             {
18                 background: white;
19                 height: 0.5in;
20                 position: absolute;
21                 bottom: 0.5in;
22                 width: 0.5in;
23             }
24             #div3
25             {
26                 background: blue;
27                 height: 1in;
28                 width: 1in;
29             }
30         </style>
31     </head>
32     <body>
33         <p>Test passes if there is a box below with its bottom-left corner missing.</p>
34         <div id="div1">
35             <div id="div2"></div>
36             <div id="div3"></div>
37         </div>
38     </body>
39 </html>