| <!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> |
| <title>CSS Reftest Reference</title> |
| <link rel="author" title="Opera Software ASA" href="http://www.opera.com/" /> |
| <link rel="reviewer" title="GĂ©rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2013-08-09 --> |
| <meta name="flags" content="" /> |
| <style type="text/css"><![CDATA[ |
| div#rel-pos-wrapper |
| { |
| background-color: yellow; |
| font: 1.25em/1 serif; |
| height: 2em; |
| position: relative; |
| width: 32em; |
| } |
| |
| div > div |
| { |
| font-size: 1em; |
| height: 2em; |
| position: absolute; |
| top: 0; |
| width: 2em; |
| } |
| |
| div#black1 |
| { |
| background-color: black; |
| left: 1em; |
| } |
| |
| div#black2 |
| { |
| background-color: black; |
| left: 4em; |
| } |
| |
| div#black3 |
| { |
| background-color: black; |
| left: 7em; |
| } |
| |
| div#black4 |
| { |
| background-color: black; |
| height: 1em; |
| left: 12em; |
| } |
| |
| div#black5 |
| { |
| background-color: black; |
| height: 1em; |
| left: 15em; |
| } |
| |
| div#blue1 |
| { |
| background-color: blue; |
| left: 23em; |
| } |
| |
| div#blue2 |
| { |
| background-color: blue; |
| left: 26em; |
| } |
| |
| div#blue3 |
| { |
| background-color: blue; |
| left: 29em; |
| } |
| |
| div#blue4 |
| { |
| background-color: blue; |
| height: 1em; |
| left: 34em; |
| } |
| |
| div#yellow1 |
| { |
| background-color: yellow; |
| height: 1em; |
| left: 36em; |
| width: 1em; |
| } |
| |
| div#blue5 |
| { |
| background-color: blue; |
| height: 1em; |
| left: 37em; |
| } |
| |
| div#yellow2 |
| { |
| background-color: yellow; |
| height: 1em; |
| left: 39em; |
| width: 3em; |
| } |
| |
| div#pink1 |
| { |
| background-color: pink; |
| left: 45em; |
| } |
| |
| div#yellow3 |
| { |
| background-color: yellow; |
| left: 47em; |
| width: 1em; |
| } |
| |
| div#pink2 |
| { |
| background-color: pink; |
| left: 48em; |
| } |
| |
| div#yellow4 |
| { |
| background-color: yellow; |
| left: 50em; |
| width: 1em; |
| } |
| |
| div#pink3 |
| { |
| background-color: pink; |
| left: 51em; |
| } |
| |
| div#pink4 |
| { |
| background-color: pink; |
| height: 1em; |
| left: 56em; |
| } |
| |
| div#yellow5 |
| { |
| background-color: yellow; |
| height: 1em; |
| left: 58em; |
| width: 1em; |
| } |
| |
| div#pink5 |
| { |
| background-color: pink; |
| height: 1em; |
| left: 59em; |
| } |
| |
| div#yellow6 |
| { |
| background-color: yellow; |
| height: 1em; |
| left: 61em; |
| width: 3em; |
| } |
| |
| div#margin-right |
| { |
| background-color: transparent; |
| height: 1em; |
| left: 64em; |
| width: 1em; |
| } |
| ]]></style> |
| </head> |
| <body> |
| |
| <div id="rel-pos-wrapper"> |
| <div id="black1"></div> |
| <div id="black2"></div> |
| <div id="black3"></div> |
| <div id="black4"></div> |
| <div id="black5"></div> |
| |
| <div id="blue1"></div> |
| <div id="blue2"></div> |
| <div id="blue3"></div> |
| <div id="blue4"></div> |
| <div id="yellow1"></div> |
| <div id="blue5"></div> |
| <div id="yellow2"></div> |
| |
| <div id="pink1"></div> |
| <div id="yellow3"></div> |
| <div id="pink2"></div> |
| <div id="yellow4"></div> |
| <div id="pink3"></div> |
| <div id="pink4"></div> |
| <div id="yellow5"></div> |
| <div id="pink5"></div> |
| <div id="yellow6"></div> |
| <div id="margin-right"></div> |
| |
| </div> |
| |
| </body> |
| </html> |