The Tor Browser: layout/reftests/w3c-css/submitted/ui3/box-sizing-border-box-004-ref.xht@fc2d59ddac77 (annotated)

layout/reftests/w3c-css/submitted/ui3/box-sizing-border-box-004-ref.xht@fc2d59ddac77 (annotated)

Wed, 31 Dec 2014 07:22:50 +0100

Correct previous dual key logic pending first delivery installment.

 <!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 Reference: Box Sizing - Border-Box with min/max width/height</title>
   <link rel="author" title="Scott Johnson" href="mailto:sjohnson@mozilla.com" />
   <style type="text/css"><![CDATA[
     .container {
       min-width: 500px;
       max-width: 700px;
       min-height: 70px;
       max-height: 90px;
       border: 2px solid black;
       position: absolute;
       left: 25px;
       top: 25px;
       background-color: red;
     }
     .box-sized {
       min-width: 240px;
       max-width: 340px;
       min-height: 60px;
       max-height: 80px;
       z-index: 1;
       float: left;
       border: 5px solid black;
     }
     #one {
       background-color: green;
     }
     #two {
       background-color: blue;
     }
   ]]></style>
  </head>
  <body>
    The two divs should be side-by-side, not one on top of another. No red should be visible.
    <br />
    <div class="container">
      <div class="box-sized" id="one">LEFT HALF</div>
      <div class="box-sized" id="two">RIGHT HALF</div>
    </div>
  </body>
 </html>