Improve tests background-size-013~015,022,023

Mon, 15 Oct 2012 17:34:15 +0800

author
Zhiqiang Zhang <zhiqiang.zhang@intel.com>
date
Mon, 15 Oct 2012 17:34:15 +0800
changeset 4305
bef4eaa706ca
parent 4304
398ddb20d051
child 4306
30bf5aec5d08

Improve tests background-size-013~015,022,023

contributors/intel/submitted/css3-background/background-size-013.html file | annotate | diff | comparison | revisions
contributors/intel/submitted/css3-background/background-size-014.html file | annotate | diff | comparison | revisions
contributors/intel/submitted/css3-background/background-size-015.html file | annotate | diff | comparison | revisions
contributors/intel/submitted/css3-background/background-size-022.html file | annotate | diff | comparison | revisions
contributors/intel/submitted/css3-background/background-size-023.html file | annotate | diff | comparison | revisions
     1.1 --- a/contributors/intel/submitted/css3-background/background-size-013.html	Mon Oct 15 16:48:11 2012 +0800
     1.2 +++ b/contributors/intel/submitted/css3-background/background-size-013.html	Mon Oct 15 17:34:15 2012 +0800
     1.3 @@ -5,29 +5,26 @@
     1.4      <link rel="author" title="Intel" href="http://www.intel.com" />
     1.5      <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
     1.6      <meta name="flags" content="image" />
     1.7 -    <meta name="assert" content="Check if 'background-size' is 'auto 45px' and 'background-repeat' is 'no-repeat' that the background is shown with a height of 100px and its width is scaled proportionally to keep the original aspect ratio" />
     1.8 +    <meta name="assert" content="Check if 'background-size' is 'auto 100px' and 'background-repeat' is 'no-repeat' that the background is shown with a height of 100px and its width is scaled proportionally to keep the original aspect ratio" />
     1.9      <style>
    1.10 -        #container {
    1.11 +        div {
    1.12              position: absolute;
    1.13          }
    1.14          #ref {
    1.15 -            position: absolute;
    1.16 +            background-color: red;
    1.17 +            height: 98px;
    1.18 +            left: 1px;
    1.19              top: 1px;
    1.20 -            left: 1px;
    1.21 -            width: 43px;
    1.22 -            height: 43px;
    1.23 -            background: red;
    1.24 +            width: 98px;
    1.25          }
    1.26          #test {
    1.27 -            position: absolute;
    1.28 +            background-image: url(support/60x60-green.png);
    1.29 +            background-repeat: no-repeat;
    1.30 +            background-size: auto 100px;
    1.31 +            height: 200px;
    1.32 +            left: 0px;
    1.33              top: 0px;
    1.34 -            left: 0px;
    1.35 -            width: 100px;
    1.36 -            height: 100px;
    1.37 -
    1.38 -            background-image: url(support/60x60-green.png);
    1.39 -            background-size: auto 45px;
    1.40 -            background-repeat: no-repeat;
    1.41 +            width: 200px;
    1.42          }
    1.43      </style>
    1.44    </head>
    1.45 @@ -38,4 +35,4 @@
    1.46        <div id="test"></div>
    1.47      </div>
    1.48    </body>
    1.49 -</html>
    1.50 \ No newline at end of file
    1.51 +</html>
     2.1 --- a/contributors/intel/submitted/css3-background/background-size-014.html	Mon Oct 15 16:48:11 2012 +0800
     2.2 +++ b/contributors/intel/submitted/css3-background/background-size-014.html	Mon Oct 15 17:34:15 2012 +0800
     2.3 @@ -7,35 +7,28 @@
     2.4      <meta name="flags" content="image" />
     2.5      <meta name="assert" content="Check if 'background-size' is 'auto 45%' and 'background-repeat' is 'no-repeat' that the background is shown with a height is scaled by the percentage relative to the background positioning area and its width is resolved by using the image's intrinsic ratio and the size of the height" />
     2.6      <style>
     2.7 -        #container {
     2.8 +        div {
     2.9              position: absolute;
    2.10          }
    2.11          #ref {
    2.12 -            position: absolute;
    2.13 -            top: 1px;
    2.14 -            left: 1px;
    2.15 -            width: 43px;
    2.16 -            height: 43px;
    2.17 -            background: red;
    2.18 +            background-color: green;
    2.19 +            height: 46px;
    2.20 +            width: 46px;
    2.21          }
    2.22          #test {
    2.23 -            position: absolute;
    2.24 -            top: 0px;
    2.25 -            left: 0px;
    2.26 +            background-image: url(support/60x60-red.png);
    2.27 +            background-repeat: no-repeat;
    2.28 +            background-size: auto 45%;
    2.29 +            height: 100px;
    2.30              width: 100px;
    2.31 -            height: 100px;
    2.32 -
    2.33 -            background-image: url(support/60x60-green.png);
    2.34 -            background-size: auto 45%;
    2.35 -            background-repeat: no-repeat;
    2.36          }
    2.37      </style>
    2.38    </head>
    2.39    <body>
    2.40      <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
    2.41      <div id="container">
    2.42 +      <div id="test"></div>
    2.43        <div id="ref"></div>
    2.44 -      <div id="test"></div>
    2.45      </div>
    2.46    </body>
    2.47 -</html>
    2.48 \ No newline at end of file
    2.49 +</html>
     3.1 --- a/contributors/intel/submitted/css3-background/background-size-015.html	Mon Oct 15 16:48:11 2012 +0800
     3.2 +++ b/contributors/intel/submitted/css3-background/background-size-015.html	Mon Oct 15 17:34:15 2012 +0800
     3.3 @@ -7,27 +7,24 @@
     3.4      <meta name="flags" content="image" />
     3.5      <meta name="assert" content="Check if 'background-size' is '100px auto' and 'background-repeat' is 'no-repeat' that the background is shown with a width of 100px and its height is scaled proportionally to keep the original aspect ratio" />
     3.6      <style>
     3.7 -        #container {
     3.8 +        div {
     3.9              position: absolute;
    3.10          }
    3.11          #ref {
    3.12 -            position: absolute;
    3.13 +            background-color: red;
    3.14 +            height: 98px;
    3.15 +            left: 1px;
    3.16              top: 1px;
    3.17 -            left: 1px;
    3.18              width: 98px;
    3.19 -            height: 98px;
    3.20 -            background: red;
    3.21          }
    3.22          #test {
    3.23 -            position: absolute;
    3.24 +            background-image: url(support/60x60-green.png);
    3.25 +            background-repeat: no-repeat;
    3.26 +            background-size: 100px auto;
    3.27 +            height: 200px;
    3.28 +            left: 0px;
    3.29              top: 0px;
    3.30 -            left: 0px;
    3.31              width: 200px;
    3.32 -            height: 200px;
    3.33 -
    3.34 -            background-image: url(support/60x60-green.png);
    3.35 -            background-size: 100px auto;
    3.36 -            background-repeat: no-repeat;
    3.37          }
    3.38      </style>
    3.39    </head>
    3.40 @@ -38,4 +35,4 @@
    3.41        <div id="test"></div>
    3.42      </div>
    3.43    </body>
    3.44 -</html>
    3.45 \ No newline at end of file
    3.46 +</html>
     4.1 --- a/contributors/intel/submitted/css3-background/background-size-022.html	Mon Oct 15 16:48:11 2012 +0800
     4.2 +++ b/contributors/intel/submitted/css3-background/background-size-022.html	Mon Oct 15 17:34:15 2012 +0800
     4.3 @@ -12,7 +12,7 @@
     4.4              position: absolute;
     4.5          }
     4.6          #ref {
     4.7 -            background: red;
     4.8 +            background-color: red;
     4.9              height: 158px;
    4.10              left: 1px;
    4.11              top: 1px;
    4.12 @@ -33,7 +33,9 @@
    4.13    </head>
    4.14    <body>
    4.15      <p>Test passes if there is a 2x2 cat image behind blue dotted borders and <strong>no red</strong>.</p>
    4.16 -    <div id="ref"></div>
    4.17 -    <div id="test"></div>
    4.18 +    <div id="container">
    4.19 +      <div id="ref"></div>
    4.20 +      <div id="test"></div>
    4.21 +    </div>
    4.22    </body>
    4.23  </html>
     5.1 --- a/contributors/intel/submitted/css3-background/background-size-023.html	Mon Oct 15 16:48:11 2012 +0800
     5.2 +++ b/contributors/intel/submitted/css3-background/background-size-023.html	Mon Oct 15 17:34:15 2012 +0800
     5.3 @@ -12,7 +12,7 @@
     5.4              position: absolute;
     5.5          }
     5.6          #ref {
     5.7 -            background: red;
     5.8 +            background-color: red;
     5.9              height: 148px;
    5.10              left: 6px;
    5.11              top: 6px;
    5.12 @@ -33,7 +33,9 @@
    5.13    </head>
    5.14    <body>
    5.15      <p>Test passes if there is a 2x2 cat image with blue dotted borders and <strong>no red</strong>.</p>
    5.16 -    <div id="ref"></div>
    5.17 -    <div id="test"></div>
    5.18 +    <div id="container">
    5.19 +      <div id="ref"></div>
    5.20 +      <div id="test"></div>
    5.21 +    </div>
    5.22    </body>
    5.23  </html>

mercurial