Skip to content

Instantly share code, notes, and snippets.

@gsnedders

gsnedders/8793.diff

Created December 28, 2017 18:58
Show Gist options
  • Save gsnedders/8e81bf29ded7935efd81125b0c789be6 to your computer and use it in GitHub Desktop.
Save gsnedders/8e81bf29ded7935efd81125b0c789be6 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
8793.diff
diff --git a/css/css-backgrounds/border-radius-001-ref.xht b/css/css-backgrounds/border-radius-001-ref.html
similarity index 39%
rename from css/css-backgrounds/border-radius-001-ref.xht
rename to css/css-backgrounds/border-radius-001-ref.html
index 9c7bc4bd5f..b3f0f45264 100644
--- a/css/css-backgrounds/border-radius-001-ref.xht
+++ b/css/css-backgrounds/border-radius-001-ref.html
@@ -1,23 +1,19 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Border radius reference</title>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border:2px solid #a1a1a1;
background:#dddddd;
width:200px;
height: 100px;
}
- /* ]]> */
</style>
</head>
<body>
- <p>
- There should be two boxes with no rounded corners.</p>
+ <p>There should be two boxes with no rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same.</li>
<li>FAIL if the output is not as expected.</li>
diff --git a/css/css-backgrounds/border-radius-001.xht b/css/css-backgrounds/border-radius-001.html
similarity index 23%
rename from css/css-backgrounds/border-radius-001.xht
rename to css/css-backgrounds/border-radius-001.html
index 7536df1dc5..ec5f322082 100644
--- a/css/css-backgrounds/border-radius-001.xht
+++ b/css/css-backgrounds/border-radius-001.html
@@ -1,39 +1,26 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Borders. border&ndash;radius set to zero</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <meta http-equiv="Content-Style-Type" content="text/css"/>
- <meta http-equiv="Content-Script-Type" content="text/javascript"/>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius" />
- <link rel="match" href="border-radius-001-ref.xht" />
- <meta name="flags" content="" />
+ <link rel="match" href="border-radius-001-ref.html" />
<meta name="assert" content="To verify when border-radius property, when set to zero, works as expected." />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
}
- #test
- {
+ #test {
border-radius: 0;
}
- /* ]]> */
</style>
-<!--
- <script type="text/javascript" src="js/css3_test_helper.js"></script>
--->
</head>
<body>
- <p>
- There should be two boxes with no rounded corners.
- </p>
- <!-- PASS AND FAIL CRITERIA ARE IN THE LIST BELOW -->
+ <p>There should be two boxes with no rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same.</li>
<li>FAIL if the output is not as expected.</li>
@@ -43,25 +30,6 @@
<div id="test"></div>
<p><br/></p>
<div id="reference"></div>
-<!--
- <script type="text/javascript">
- /* <![CDATA[ */
- var borders = new Array("border-top-left-radius", "border-top-right-radius",
- "border-bottom-right-radius", "border-bottom-left-radius");
- var expectedValues = new Array("0px", "0px", "0px", "0px");
-
- var testResult = check_Multiple_CSS_property(borders, expectedValues);
-
- /* if (testResult.pass)
- // This portion of the code has been removed to ensure that the test case is not automated
- else {
- // This portion of the code has been removed to ensure that the test case is not automated
- } */
-
- if (top.FrameEnabled) top.fnLog(testResult);
- /* ]]> */
- </script>
--->
</body>
</html>
diff --git a/css/css-backgrounds/border-radius-002-ref.html b/css/css-backgrounds/border-radius-002-ref.html
new file mode 100644
index 0000000000..99e8e93cfa
--- /dev/null
+++ b/css/css-backgrounds/border-radius-002-ref.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: Border radius reference</title>
+ <link rel="author" title="Nokia" href="http://www.nokia.com/" />
+ <style>
+ div {
+ border: 2px solid #a1a1a1;
+ background: #dddddd;
+ width: 200px;
+ height: 100px;
+ border-top-left-radius: 25px;
+ border-top-right-radius: 25px;
+ border-bottom-right-radius: 25px;
+ border-bottom-left-radius: 25px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
+ <ul>
+ <li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
+ <li>FAIL if the output is not as expected.</li>
+ </ul>
+
+ <div id="test"></div>
+ <p><br/></p>
+ <div id="reference"></div>
+ </body>
+</html>
diff --git a/css/css-backgrounds/border-radius-002.xht b/css/css-backgrounds/border-radius-002.html
similarity index 29%
rename from css/css-backgrounds/border-radius-002.xht
rename to css/css-backgrounds/border-radius-002.html
index 1877e082fb..5ef9df4a58 100644
--- a/css/css-backgrounds/border-radius-002.xht
+++ b/css/css-backgrounds/border-radius-002.html
@@ -1,42 +1,30 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Borders. border&ndash;radius using one length value 25px</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <meta http-equiv="Content-Style-Type" content="text/css"/>
- <meta http-equiv="Content-Script-Type" content="text/javascript"/>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius" />
- <link rel="match" href="border-radius-002-ref.xht" />
- <meta name="flags" content="" />
+ <link rel="match" href="border-radius-002-ref.html" />
<meta name="assert" content="To verify border-radius property set with one length value, works as expected" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
border-radius: 25px;
}
- #reference
- {
+ #reference {
border-top-left-radius: 25px;
border-top-right-radius: 25px;
border-bottom-right-radius: 25px;
border-bottom-left-radius: 25px;
}
- /* ]]> */
</style>
-<!--
- <script type="text/javascript" src="js/css3_test_helper.js"></script>
--->
</head>
<body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
@@ -46,25 +34,5 @@
<div id="test"></div>
<p><br/></p>
<div id="reference"></div>
-<!--
- <script type="text/javascript">
- /* <![CDATA[ */
- var borders = new Array("border-top-left-radius", "border-top-right-radius",
- "border-bottom-right-radius", "border-bottom-left-radius");
- var expectedValues = new Array("25px", "25px", "25px", "25px");
-
- var testResult = check_Multiple_CSS_property(borders, expectedValues);
-
- /* if (testResult.pass)
- // This portion of the code has been removed to ensure that the test case is not automated
- else {
- // This portion of the code has been removed to ensure that the test case is not automated
- } */
-
- if (top.FrameEnabled) top.fnLog(testResult);
- /* ]]> */
- </script>
--->
</body>
</html>
-
diff --git a/css/css-backgrounds/border-radius-010-ref.xht b/css/css-backgrounds/border-radius-003-ref.html
similarity index 35%
rename from css/css-backgrounds/border-radius-010-ref.xht
rename to css/css-backgrounds/border-radius-003-ref.html
index 7cb553e7ed..de1d4bccd1 100644
--- a/css/css-backgrounds/border-radius-010-ref.xht
+++ b/css/css-backgrounds/border-radius-003-ref.html
@@ -1,28 +1,23 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Border radius reference</title>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
- border-top-left-radius: 20% 25px;
+ border-top-left-radius: 50px;
border-top-right-radius: 0;
- border-bottom-right-radius: 20pt 3em;
+ border-bottom-right-radius: 50px;
border-bottom-left-radius: 0;
}
- /* ]]> */
</style>
</head>
<body>
- <p>
- There should be two identical boxes, each with rounded corners at the top left and bottom right only.
- </p>
+ <p>There should be two identical boxes, each with rounded corners at the top left and bottom right only.</p>
<ul>
<li>PASS if the two boxes below are the same and only top left and bottom right corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
@@ -33,4 +28,3 @@
<div id="reference"></div>
</body>
</html>
-
diff --git a/css/css-backgrounds/border-radius-003.xht b/css/css-backgrounds/border-radius-003.html
similarity index 29%
rename from css/css-backgrounds/border-radius-003.xht
rename to css/css-backgrounds/border-radius-003.html
index cfe4d74268..5137045c49 100644
--- a/css/css-backgrounds/border-radius-003.xht
+++ b/css/css-backgrounds/border-radius-003.html
@@ -1,42 +1,30 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Borders. border&ndash;radius set to value: 50px 0</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <meta http-equiv="Content-Style-Type" content="text/css"/>
- <meta http-equiv="Content-Script-Type" content="text/javascript"/>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius" />
- <link rel="match" href="border-radius-003-ref.xht" />
- <meta name="flags" content="" />
+ <link rel="match" href="border-radius-003-ref.html" />
<meta name="assert" content="To verify border-radius property set with one length value along with a zero, works as expected" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
border-radius: 50px 0;
}
- #reference
- {
+ #reference {
border-top-left-radius: 50px;
border-top-right-radius: 0;
border-bottom-right-radius: 50px;
border-bottom-left-radius: 0;
}
- /* ]]> */
</style>
-<!--
- <script type="text/javascript" src="js/css3_test_helper.js"></script>
--->
</head>
<body>
- <p>
- There should be two identical boxes, each with rounded corners at the top left and bottom right only.
- </p>
+ <p>There should be two identical boxes, each with rounded corners at the top left and bottom right only.</p>
<ul>
<li>PASS if the two boxes below are the same and only top left and bottom right corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
@@ -46,25 +34,5 @@
<div id="test"></div>
<p><br/></p>
<div id="reference"></div>
-<!--
- <script type="text/javascript">
- /* <![CDATA[ */
- var borders = new Array("border-top-left-radius", "border-top-right-radius",
- "border-bottom-right-radius", "border-bottom-left-radius");
- var expectedValues = new Array("50px", "0px", "50px", "0px");
-
- var testResult = check_Multiple_CSS_property(borders, expectedValues);
-
- /* if (testResult.pass)
- // This portion of the code has been removed to ensure that the test case is not automated
- else {
- // This portion of the code has been removed to ensure that the test case is not automated
- } */
-
- if (top.FrameEnabled) top.fnLog(testResult);
- /* ]]> */
- </script>
--->
</body>
</html>
-
diff --git a/css/css-backgrounds/border-radius-009-ref.xht b/css/css-backgrounds/border-radius-004-ref.html
similarity index 35%
rename from css/css-backgrounds/border-radius-009-ref.xht
rename to css/css-backgrounds/border-radius-004-ref.html
index 99064998e9..ec42983c24 100644
--- a/css/css-backgrounds/border-radius-009-ref.xht
+++ b/css/css-backgrounds/border-radius-004-ref.html
@@ -1,28 +1,23 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Border radius reference</title>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
- border-top-left-radius: 20%;
- border-top-right-radius: 25px;
- border-bottom-right-radius: 20%;
- border-bottom-left-radius: 25px;
+ border-top-left-radius: 50px 25px;
+ border-top-right-radius: 50px 25px;
+ border-bottom-right-radius: 50px 25px;
+ border-bottom-left-radius: 50px 25px;
}
- /* ]]> */
</style>
</head>
<body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
diff --git a/css/css-backgrounds/border-radius-004-ref.xht b/css/css-backgrounds/border-radius-004-ref.xht
deleted file mode 100644
index 74e70ab491..0000000000
--- a/css/css-backgrounds/border-radius-004-ref.xht
+++ /dev/null
@@ -1,36 +0,0 @@
-<!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 Test: Border radius reference</title>
- <link rel="author" title="Nokia" href="http://www.nokia.com/" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
- border:2px solid #a1a1a1;
- background:#dddddd;
- width:200px;
- height: 100px;
- border-top-left-radius: 50px 25px;
- border-top-right-radius: 50px 25px;
- border-bottom-right-radius: 50px 25px;
- border-bottom-left-radius: 50px 25px;
- }
- /* ]]> */
- </style>
- </head>
- <body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
- <ul>
- <li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
- <li>FAIL if the output is not as expected.</li>
- </ul>
-
- <div id="test"></div>
- <p><br/></p>
- <div id="reference"></div>
- </body>
-</html>
-
diff --git a/css/css-backgrounds/border-radius-004.xht b/css/css-backgrounds/border-radius-004.html
similarity index 28%
rename from css/css-backgrounds/border-radius-004.xht
rename to css/css-backgrounds/border-radius-004.html
index cfd57e29d9..bd3d3459b5 100644
--- a/css/css-backgrounds/border-radius-004.xht
+++ b/css/css-backgrounds/border-radius-004.html
@@ -1,42 +1,30 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Borders. border&ndash;radius using slash: 50px / 25px</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <meta http-equiv="Content-Style-Type" content="text/css"/>
- <meta http-equiv="Content-Script-Type" content="text/javascript"/>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius" />
- <link rel="match" href="border-radius-004-ref.xht" />
- <meta name="flags" content="" />
+ <link rel="match" href="border-radius-004-ref.html" />
<meta name="assert" content="To verify border-radius property set with value using slash, works as expected" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
border-radius: 50px / 25px;
}
- #reference
- {
+ #reference {
border-top-left-radius: 50px 25px;
border-top-right-radius: 50px 25px;
border-bottom-right-radius: 50px 25px;
border-bottom-left-radius: 50px 25px;
}
- /* ]]> */
</style>
-<!--
- <script type="text/javascript" src="js/css3_test_helper.js"></script>
--->
</head>
<body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
@@ -46,25 +34,6 @@
<div id="test"></div>
<p><br/></p>
<div id="reference"></div>
-<!--
- <script type="text/javascript">
- /* <![CDATA[ */
- var borders = new Array("border-top-left-radius", "border-top-right-radius",
- "border-bottom-right-radius", "border-bottom-left-radius");
- var expectedValues = new Array("50px 25px", "50px 25px", "50px 25px", "50px 25px");
-
- var testResult = check_Multiple_CSS_property(borders, expectedValues);
-
- /* if (testResult.pass)
- // This portion of the code has been removed to ensure that the test case is not automated
- else {
- // This portion of the code has been removed to ensure that the test case is not automated
- } */
-
- if (top.FrameEnabled) top.fnLog(testResult);
- /* ]]> */
- </script>
--->
</body>
</html>
diff --git a/css/css-backgrounds/border-radius-002-ref.xht b/css/css-backgrounds/border-radius-005-ref.html
similarity index 35%
rename from css/css-backgrounds/border-radius-002-ref.xht
rename to css/css-backgrounds/border-radius-005-ref.html
index 104c1e1512..8dea873781 100644
--- a/css/css-backgrounds/border-radius-002-ref.xht
+++ b/css/css-backgrounds/border-radius-005-ref.html
@@ -1,28 +1,23 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Border radius reference</title>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
- border-top-left-radius: 25px;
- border-top-right-radius: 25px;
- border-bottom-right-radius: 25px;
- border-bottom-left-radius: 25px;
+ border-top-left-radius: 50px 20px;
+ border-top-right-radius: 15px 25px;
+ border-bottom-right-radius: 40px 20px;
+ border-bottom-left-radius: 15px 25px;
}
- /* ]]> */
</style>
</head>
<body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
diff --git a/css/css-backgrounds/border-radius-005-ref.xht b/css/css-backgrounds/border-radius-005-ref.xht
deleted file mode 100644
index 378b40ec20..0000000000
--- a/css/css-backgrounds/border-radius-005-ref.xht
+++ /dev/null
@@ -1,36 +0,0 @@
-<!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 Test: Border radius reference</title>
- <link rel="author" title="Nokia" href="http://www.nokia.com/" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
- border:2px solid #a1a1a1;
- background:#dddddd;
- width:200px;
- height: 100px;
- border-top-left-radius: 50px 20px;
- border-top-right-radius: 15px 25px;
- border-bottom-right-radius: 40px 20px;
- border-bottom-left-radius: 15px 25px;
- }
- /* ]]> */
- </style>
- </head>
- <body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
- <ul>
- <li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
- <li>FAIL if the output is not as expected.</li>
- </ul>
-
- <div id="test"></div>
- <p><br/></p>
- <div id="reference"></div>
- </body>
-</html>
-
diff --git a/css/css-backgrounds/border-radius-005.xht b/css/css-backgrounds/border-radius-005.html
similarity index 28%
rename from css/css-backgrounds/border-radius-005.xht
rename to css/css-backgrounds/border-radius-005.html
index 839d48f91e..8ede22d0db 100644
--- a/css/css-backgrounds/border-radius-005.xht
+++ b/css/css-backgrounds/border-radius-005.html
@@ -1,42 +1,30 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Borders. border&ndash;radius using slash: 50px 15px 40px / 20px 25px</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <meta http-equiv="Content-Style-Type" content="text/css"/>
- <meta http-equiv="Content-Script-Type" content="text/javascript"/>
<link rel="author" title="Nokia" href="http://www.nokia.com/"/>
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius" />
- <link rel="match" href="border-radius-005-ref.xht" />
- <meta name="flags" content="" />
+ <link rel="match" href="border-radius-005-ref.html" />
<meta name="assert" content="To verify border-radius property set with value using slash, works as expected" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
border-radius: 50px 15px 40px / 20px 25px;
}
- #reference
- {
+ #reference {
border-top-left-radius: 50px 20px;
border-top-right-radius: 15px 25px;
border-bottom-right-radius: 40px 20px;
border-bottom-left-radius: 15px 25px;
}
- /* ]]> */
</style>
-<!--
- <script type="text/javascript" src="js/css3_test_helper.js"></script>
--->
</head>
<body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
@@ -46,23 +34,5 @@
<div id="test"></div>
<p><br/></p>
<div id="reference"></div>
-<!--
- <script type="text/javascript">
- /* <![CDATA[ */
- var borders = new Array("border-top-left-radius", "border-top-right-radius",
- "border-bottom-right-radius", "border-bottom-left-radius");
- var expectedValues = new Array("50px 20px", "15px 25px", "40px 20px", "15px 25px");
- var testResult = check_Multiple_CSS_property(borders, expectedValues);
- /* if (testResult.pass)
- // This portion of the code has been removed to ensure that the test case is not automated
- else {
- // This portion of the code has been removed to ensure that the test case is not automated
- } */
-
- if (top.FrameEnabled) top.fnLog(testResult);
- /* ]]> */
- </script>
--->
</body>
</html>
-
diff --git a/css/css-backgrounds/border-radius-006-ref.xht b/css/css-backgrounds/border-radius-006-ref.html
similarity index 34%
rename from css/css-backgrounds/border-radius-006-ref.xht
rename to css/css-backgrounds/border-radius-006-ref.html
index 730a19bf12..a921e50727 100644
--- a/css/css-backgrounds/border-radius-006-ref.xht
+++ b/css/css-backgrounds/border-radius-006-ref.html
@@ -1,12 +1,10 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Border radius reference</title>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
@@ -16,13 +14,10 @@
border-bottom-right-radius: 50px 10%;
border-bottom-left-radius: 15px 25px;
}
- /* ]]> */
</style>
</head>
<body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
@@ -33,4 +28,3 @@
<div id="reference"></div>
</body>
</html>
-
diff --git a/css/css-backgrounds/border-radius-006.xht b/css/css-backgrounds/border-radius-006.html
similarity index 28%
rename from css/css-backgrounds/border-radius-006.xht
rename to css/css-backgrounds/border-radius-006.html
index e2426d02bb..62d8c21fc5 100644
--- a/css/css-backgrounds/border-radius-006.xht
+++ b/css/css-backgrounds/border-radius-006.html
@@ -1,42 +1,30 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Borders. border&ndash;radius using slash: 50px 15px / 20px 25px 10%</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <meta http-equiv="Content-Style-Type" content="text/css"/>
- <meta http-equiv="Content-Script-Type" content="text/javascript"/>
<link rel="author" title="Nokia" href="http://www.nokia.com/"/>
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius" />
- <link rel="match" href="border-radius-006-ref.xht" />
- <meta name="flags" content="" />
+ <link rel="match" href="border-radius-006-ref.html" />
<meta name="assert" content="To verify border-radius property set with values using slash, works as expected" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
border-radius: 50px 15px / 20px 25px 10%;
}
- #reference
- {
+ #reference {
border-top-left-radius: 50px 20px;
border-top-right-radius: 15px 25px;
border-bottom-right-radius: 50px 10%;
border-bottom-left-radius: 15px 25px;
}
- /* ]]> */
</style>
-<!--
- <script type="text/javascript" src="js/css3_test_helper.js"></script>
--->
</head>
<body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
@@ -46,25 +34,5 @@
<div id="test"></div>
<p><br/></p>
<div id="reference"></div>
-<!--
- <script type="text/javascript">
- /* <![CDATA[ */
- var borders = new Array("border-top-left-radius", "border-top-right-radius",
- "border-bottom-right-radius", "border-bottom-left-radius");
- var expectedValues = new Array("50px 20px", "15px 25px", "50px 10%", "15px 25px");
-
- var testResult = check_Multiple_CSS_property(borders, expectedValues);
-
- /* if (testResult.pass)
- // This portion of the code has been removed to ensure that the test case is not automated
- else {
- // This portion of the code has been removed to ensure that the test case is not automated
- } */
-
- if (top.FrameEnabled) top.fnLog(testResult);
- /* ]]> */
- </script>
--->
</body>
</html>
-
diff --git a/css/css-backgrounds/border-radius-007-ref.html b/css/css-backgrounds/border-radius-007-ref.html
new file mode 100644
index 0000000000..64c9576f0d
--- /dev/null
+++ b/css/css-backgrounds/border-radius-007-ref.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: Border radius reference</title>
+ <link rel="author" title="Nokia" href="http://www.nokia.com/" />
+ <style>
+ div {
+ border: 2px solid #a1a1a1;
+ background: #dddddd;
+ width: 200px;
+ height: 100px;
+ border-top-left-radius: 50px 0.5in;
+ border-top-right-radius: 10mm 25px;
+ border-bottom-right-radius: 6pc 30%;
+ border-bottom-left-radius: 15% 70pt;
+ }
+ </style>
+ </head>
+ <body>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
+ <ul>
+ <li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
+ <li>FAIL if the output is not as expected.</li>
+ </ul>
+
+ <div id="test"></div>
+ <p><br/></p>
+ <div id="reference"></div>
+ </body>
+</html>
diff --git a/css/css-backgrounds/border-radius-007.xht b/css/css-backgrounds/border-radius-007.html
similarity index 29%
rename from css/css-backgrounds/border-radius-007.xht
rename to css/css-backgrounds/border-radius-007.html
index ab0bdf2ee9..52a30097a5 100644
--- a/css/css-backgrounds/border-radius-007.xht
+++ b/css/css-backgrounds/border-radius-007.html
@@ -1,42 +1,30 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Borders. border&ndash;radius using slash: 50px 10mm 3pc 15% / 0.5in 25px 10% 70pt</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <meta http-equiv="Content-Style-Type" content="text/css"/>
- <meta http-equiv="Content-Script-Type" content="text/javascript"/>
<link rel="author" title="Nokia" href="http://www.nokia.com/"/>
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius" />
- <link rel="match" href="border-radius-007-ref.xht" />
- <meta name="flags" content="" />
+ <link rel="match" href="border-radius-007-ref.html" />
<meta name="assert" content="To verify border-radius property set with values (in different units) using slash, works as expected" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
border-radius: 50px 10mm 6pc 15% / 0.5in 25px 30% 70pt;
}
- #reference
- {
+ #reference {
border-top-left-radius: 50px 0.5in;
border-top-right-radius: 10mm 25px;
border-bottom-right-radius: 6pc 30%;
border-bottom-left-radius: 15% 70pt;
}
- /* ]]> */
</style>
-<!--
- <script type="text/javascript" src="js/css3_test_helper.js"></script>
--->
</head>
<body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
@@ -46,25 +34,5 @@
<div id="test"></div>
<p><br/></p>
<div id="reference"></div>
-<!--
- <script type="text/javascript">
- /* <![CDATA[ */
- var borders = new Array("border-top-left-radius", "border-top-right-radius",
- "border-bottom-right-radius", "border-bottom-left-radius");
- var expectedValues = new Array("50px 48px", "37px 25px", "96px 30%", "15% 93px");
-
- var testResult = check_Multiple_CSS_property(borders, expectedValues);
-
- /* if (testResult.pass)
- // This portion of the code has been removed to ensure that the test case is not automated
- else {
- // This portion of the code has been removed to ensure that the test case is not automated
- } */
-
- if (top.FrameEnabled) top.fnLog(testResult);
- /* ]]> */
- </script>
--->
</body>
</html>
-
diff --git a/css/css-backgrounds/border-radius-008.xht b/css/css-backgrounds/border-radius-008.html
similarity index 24%
rename from css/css-backgrounds/border-radius-008.xht
rename to css/css-backgrounds/border-radius-008.html
index 8c5a7a961e..41ba7d2351 100644
--- a/css/css-backgrounds/border-radius-008.xht
+++ b/css/css-backgrounds/border-radius-008.html
@@ -1,38 +1,26 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Borders. border&ndash;radius using slash: 50px 15px 40px 30em 25em / 20px 25px</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <meta http-equiv="Content-Style-Type" content="text/css"/>
- <meta http-equiv="Content-Script-Type" content="text/javascript"/>
<link rel="author" title="Nokia" href="http://www.nokia.com/"/>
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius" />
- <link rel="match" href="border-radius-001-ref.xht" />
- <meta name="flags" content="" />
+ <link rel="match" href="border-radius-001-ref.html" />
<meta name="assert" content="To verify border-radius property set with excess values, works as expected" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
}
- #test
- {
+ #test {
border-radius: 50px 15px 40px 30em 25em / 20px 25px;
}
- /* ]]> */
</style>
-<!--
- <script type="text/javascript" src="js/css3_test_helper.js"></script>
--->
</head>
<body>
- <p>
- There should be two boxes with no rounded corners.
- </p>
+ <p>There should be two boxes with no rounded corners.</p>
<!-- PASS AND FAIL CRITERIA ARE IN THE LIST BELOW -->
<ul>
<li>PASS if the two boxes below are the same.</li>
@@ -43,25 +31,5 @@
<div id="test"></div>
<p><br/></p>
<div id="reference"></div>
-<!--
- <script type="text/javascript">
- /* <![CDATA[ */
- var borders = new Array("border-top-left-radius", "border-top-right-radius",
- "border-bottom-right-radius", "border-bottom-left-radius");
- var expectedValues = new Array("0px", "0px", "0px", "0px");
-
- var testResult = check_Multiple_CSS_property(borders, expectedValues);
-
- /* if (testResult.pass)
- // This portion of the code has been removed to ensure that the test case is not automated
- else {
- // This portion of the code has been removed to ensure that the test case is not automated
- } */
-
- if (top.FrameEnabled) top.fnLog(testResult);
- /* ]]> */
- </script>
--->
</body>
</html>
-
diff --git a/css/css-backgrounds/border-radius-007-ref.xht b/css/css-backgrounds/border-radius-009-ref.html
similarity index 34%
rename from css/css-backgrounds/border-radius-007-ref.xht
rename to css/css-backgrounds/border-radius-009-ref.html
index 3d3ab1bfc6..0f76d158f0 100644
--- a/css/css-backgrounds/border-radius-007-ref.xht
+++ b/css/css-backgrounds/border-radius-009-ref.html
@@ -1,28 +1,23 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Border radius reference</title>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
- border-top-left-radius: 50px 0.5in;
- border-top-right-radius: 10mm 25px;
- border-bottom-right-radius: 6pc 30%;
- border-bottom-left-radius: 15% 70pt;
+ border-top-left-radius: 20%;
+ border-top-right-radius: 25px;
+ border-bottom-right-radius: 20%;
+ border-bottom-left-radius: 25px;
}
- /* ]]> */
</style>
</head>
<body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
diff --git a/css/css-backgrounds/border-radius-009.xht b/css/css-backgrounds/border-radius-009.html
similarity index 27%
rename from css/css-backgrounds/border-radius-009.xht
rename to css/css-backgrounds/border-radius-009.html
index 70169c3185..47e114e9be 100644
--- a/css/css-backgrounds/border-radius-009.xht
+++ b/css/css-backgrounds/border-radius-009.html
@@ -1,46 +1,33 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Borders. border&ndash;radius using &quot;inherit&quot;</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <meta http-equiv="Content-Style-Type" content="text/css"/>
- <meta http-equiv="Content-Script-Type" content="text/javascript"/>
<link rel="author" title="Nokia" href="http://www.nokia.com/"/>
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius" />
- <link rel="match" href="border-radius-009-ref.xht" />
- <meta name="flags" content="" />
+ <link rel="match" href="border-radius-009-ref.html" />
<meta name="assert" content="To verify inherit feature works, when it is assigned to border-radius" />
- <style type="text/css">
- /* <![CDATA[ */
- body
- {
+ <style>
+ body {
border-radius: 20% 25px;
}
- div
- {
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
border-radius: inherit;
}
- #reference
- {
+ #reference {
border-top-left-radius: 20%;
border-top-right-radius: 25px;
border-bottom-right-radius: 20%;
border-bottom-left-radius: 25px;
}
- /* ]]> */
</style>
-<!--
- <script type="text/javascript" src="js/css3_test_helper.js"></script>
--->
</head>
<body>
- <p>
- There should be two identical boxes, each with 4 rounded corners.
- </p>
+ <p>There should be two identical boxes, each with 4 rounded corners.</p>
<ul>
<li>PASS if the two boxes below are the same and all 4 corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
@@ -50,23 +37,5 @@
<div id="test"></div>
<p><br/></p>
<div id="reference"></div>
-<!--
- <script type="text/javascript">
- /* <![CDATA[ */
- var borders = new Array("border-top-left-radius", "border-top-right-radius",
- "border-bottom-right-radius", "border-bottom-left-radius");
- var expectedValues = new Array("20%", "25px", "20%", "25px");
- var testResult = check_Multiple_CSS_property(borders, expectedValues);
- /* if (testResult.pass)
- // This portion of the code has been removed to ensure that the test case is not automated
- else {
- // This portion of the code has been removed to ensure that the test case is not automated
- } */
-
- if (top.FrameEnabled) top.fnLog(testResult);
- /* ]]> */
- </script>
--->
</body>
</html>
-
diff --git a/css/css-backgrounds/border-radius-003-ref.xht b/css/css-backgrounds/border-radius-010-ref.html
similarity index 35%
rename from css/css-backgrounds/border-radius-003-ref.xht
rename to css/css-backgrounds/border-radius-010-ref.html
index be824c2073..1b565b290c 100644
--- a/css/css-backgrounds/border-radius-003-ref.xht
+++ b/css/css-backgrounds/border-radius-010-ref.html
@@ -1,28 +1,23 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Border radius reference</title>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
+ <style>
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
- border-top-left-radius: 50px;
+ border-top-left-radius: 20% 25px;
border-top-right-radius: 0;
- border-bottom-right-radius: 50px;
+ border-bottom-right-radius: 20pt 3em;
border-bottom-left-radius: 0;
}
- /* ]]> */
</style>
</head>
<body>
- <p>
- There should be two identical boxes, each with rounded corners at the top left and bottom right only.
- </p>
+ <p>There should be two identical boxes, each with rounded corners at the top left and bottom right only.</p>
<ul>
<li>PASS if the two boxes below are the same and only top left and bottom right corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
diff --git a/css/css-backgrounds/border-radius-010.xht b/css/css-backgrounds/border-radius-010.html
similarity index 27%
rename from css/css-backgrounds/border-radius-010.xht
rename to css/css-backgrounds/border-radius-010.html
index 99791d10a5..906943c276 100644
--- a/css/css-backgrounds/border-radius-010.xht
+++ b/css/css-backgrounds/border-radius-010.html
@@ -1,47 +1,34 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Borders. border&ndash;radius using &quot;inherit&quot;</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <meta http-equiv="Content-Style-Type" content="text/css"/>
- <meta http-equiv="Content-Script-Type" content="text/javascript"/>
<link rel="author" title="Nokia" href="http://www.nokia.com/"/>
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius" />
- <link rel="match" href="border-radius-010-ref.xht" />
- <meta name="flags" content="" />
+ <link rel="match" href="border-radius-010-ref.html" />
<meta name="assert" content="To verify inherit feature works, when it is assigned to border-radius" />
- <style type="text/css">
- /* <![CDATA[ */
- body
- {
+ <style>
+ body {
border-top-left-radius: 20% 25px;
border-bottom-right-radius: 20pt 3em;
}
- div
- {
+ div {
border: 2px solid #a1a1a1;
background: #dddddd;
width: 200px;
height: 100px;
border-radius: inherit;
}
- #reference
- {
+ #reference {
border-top-left-radius: 20% 25px;
border-top-right-radius: 0;
border-bottom-right-radius: 20pt 3em;
border-bottom-left-radius: 0;
}
- /* ]]> */
</style>
-<!--
- <script type="text/javascript" src="js/css3_test_helper.js"></script>
--->
</head>
<body>
- <p>
- There should be two identical boxes, each with rounded corners at the top left and bottom right only.
- </p>
+ <p>There should be two identical boxes, each with rounded corners at the top left and bottom right only.</p>
<ul>
<li>PASS if the two boxes below are the same and only top left and bottom right corners are rounded.</li>
<li>FAIL if the output is not as expected.</li>
@@ -51,25 +38,5 @@
<div id="test"></div>
<p><br/></p>
<div id="reference"></div>
-<!--
- <script type="text/javascript">
- /* <![CDATA[ */
- var borders = new Array("border-top-left-radius", "border-top-right-radius",
- "border-bottom-right-radius", "border-bottom-left-radius");
- var expectedValues = new Array("20% 25px", "0px", "26px 48px", "0px");
-
- var testResult = check_Multiple_CSS_property(borders, expectedValues);
-
- /* if (testResult.pass)
- // This portion of the code has been removed to ensure that the test case is not automated
- else {
- // This portion of the code has been removed to ensure that the test case is not automated
- } */
-
- if (top.FrameEnabled) top.fnLog(testResult);
- /* ]]> */
- </script>
--->
</body>
</html>
-
diff --git a/css/css-backgrounds/border-radius-011-ref.xht b/css/css-backgrounds/border-radius-011-ref.html
similarity index 23%
rename from css/css-backgrounds/border-radius-011-ref.xht
rename to css/css-backgrounds/border-radius-011-ref.html
index 32120f12ea..4594e7707c 100644
--- a/css/css-backgrounds/border-radius-011-ref.xht
+++ b/css/css-backgrounds/border-radius-011-ref.html
@@ -1,31 +1,24 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Border radius reference</title>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
- <style type="text/css">
- /* <![CDATA[ */
- div
- {
- border:2px solid #a1a1a1;
- background:#dddddd;
+ <style>
+ div {
+ position: absolute;
+ top: 150px;
width: 200px;
height: 100px;
}
- /* ]]> */
</style>
</head>
<body>
- <p>
- There should be two boxes, each with corners that have no rounding.
- </p>
+ <p>A white rectangle with no border-radius property sits exactly on top of an exact same size red rectangle with border-radius set to zero.</p>
<ul>
- <li>PASS if the two boxes below are the same, each with sharp corner joins (no rounding).</li>
- <li>FAIL if corner joins have any rounding.</li>
+ <li>PASS if no red is visible on the page.</li>
+ <li>FAIL if any red is visible.</li>
</ul>
- <div></div>
- <p><br/></p>
<div></div>
</body>
</html>
diff --git a/css/css-backgrounds/border-radius-011.xht b/css/css-backgrounds/border-radius-011.html
similarity index 30%
rename from css/css-backgrounds/border-radius-011.xht
rename to css/css-backgrounds/border-radius-011.html
index 6a5ceab204..88dc26d3bc 100644
--- a/css/css-backgrounds/border-radius-011.xht
+++ b/css/css-backgrounds/border-radius-011.html
@@ -1,41 +1,33 @@
-<!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">
+<!DOCTYPE html>
+<html>
<head>
<title>CSS Test: Borders. border&ndash;radius set to zero</title>
<link rel="author" title="Nokia" href="http://www.nokia.com/" />
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius" />
- <link rel="match" href="border-radius-011-ref.xht" />
- <meta name="flags" content="" />
+ <link rel="match" href="border-radius-011-ref.html" />
<meta name="assert" content="If border-radius is zero, all corners are square." />
- <style type="text/css"><![CDATA[
- div
- {
+ <style>
+ div {
width: 200px;
height: 100px;
}
- #reference
- {
+ #reference {
background: red;
position: absolute;
- top: 100px;
+ top: 150px;
left: 30px;
}
- #test
- {
+ #test {
position: absolute;
border-radius: 0;
background: white;
- top: 100px;
+ top: 150px;
left: 30px;
}
-
- ]]>
</style>
</head>
<body>
- <p>
- A white rectangle with no border-radius property sits exactly on top of an exact same size red rectangle with border-radius set to zero.
- </p>
+ <p>A white rectangle with no border-radius property sits exactly on top of an exact same size red rectangle with border-radius set to zero.</p>
<!-- PASS AND FAIL CRITERIA ARE IN THE LIST BELOW -->
<ul>
<li>PASS if no red is visible on the page.</li>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment