summaryrefslogtreecommitdiffstats
path: root/layout/reftests/w3c-css/received/css-multicol-1/multicol-count-computed-005.xht
diff options
context:
space:
mode:
authorMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
committerMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
commit5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree10027f336435511475e392454359edea8e25895d /layout/reftests/w3c-css/received/css-multicol-1/multicol-count-computed-005.xht
parent49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
downloadUXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip
Add m-esr52 at 52.6.0
Diffstat (limited to 'layout/reftests/w3c-css/received/css-multicol-1/multicol-count-computed-005.xht')
-rw-r--r--layout/reftests/w3c-css/received/css-multicol-1/multicol-count-computed-005.xht97
1 files changed, 97 insertions, 0 deletions
diff --git a/layout/reftests/w3c-css/received/css-multicol-1/multicol-count-computed-005.xht b/layout/reftests/w3c-css/received/css-multicol-1/multicol-count-computed-005.xht
new file mode 100644
index 000000000..8648fff76
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-multicol-1/multicol-count-computed-005.xht
@@ -0,0 +1,97 @@
+<!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 Multi-column Layout Test: -moz-column-rule and overflow inside (complex test)</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-03 -->
+ <link rel="help" href="http://www.w3.org/TR/css3-multicol/#the-number-and-width-of-columns" title="3. The number and width of -moz-columns" />
+ <link rel="match" href="multicol-count-computed-003-ref.xht" />
+ <meta name="flags" content="ahem" />
+ <meta name="assert" content="This test checks that if one of 2 adjacent column boxes (2nd and 3rd colum box in this test) does not have any content, then the column rule separating those should not be drawn. In this test, the 3rd colum box should have no inline content. This test also checks that inline content in the normal flow that extends into a column gap should be clipped in the middle of the column gap. So, in this test, inline content in 1st column box should be partially clipped and overlapped partially by 1st -moz-column-rule." />
+<style type="text/css"><![CDATA[
+@font-face {
+ font-family: Ahem;
+ src: url("../../../fonts/Ahem.ttf");
+}
+]]></style>
+ <style type="text/css"><![CDATA[
+ div
+ {
+ background: yellow;
+ border: gray solid 1em;
+ color: black;
+ font: 1.25em/1 Ahem;
+ orphans: 1;
+ widows: 1;
+ width: 13em;
+
+ -moz-column-gap: 5em;
+ -moz-column-rule-color: blue;
+ -moz-column-rule-style: solid;
+ -moz-column-rule-width: 1.5em;
+ -moz-column-width: 1em;
+ }
+
+ /*
+ (15) if (-moz-column-width != auto) and (-moz-column-count = auto) then
+ (16) N := max(1, floor((available-width + -moz-column-gap) / (-moz-column-width + -moz-column-gap)));
+ (17) W := ((available-width + -moz-column-gap) / N) - -moz-column-gap;
+ (18) exit;
+
+ N := max(1, floor((available-width + -moz-column-gap) / (-moz-column-width + -moz-column-gap)));
+ N == max(1, floor((13em + 5em) / (1em + 5em)));
+ N == max(1, floor(18em / 6em));
+ N == max(1, floor(3));
+ N == 3;
+
+ So, the used -moz-column-count in this test is 3.
+
+ W := ((available-width + -moz-column-gap) / N) - -moz-column-gap;
+ W == ((13em + 5em) / 3) - 5em;
+ W == ((18em) / 3) - 5em;
+ W == (6em) - 5em;
+ W == 1em;
+
+ So, the used -moz-column-width in this test is 1em.
+ */
+
+ #pink {color: pink;}
+ #orange {color: orange;}
+ #purple {color: purple;}
+ #gray {color: gray;}
+
+ /*
+ Since
+ "
+ Content in the normal flow that extends into
+ column gaps (e.g., long words or images) is
+ clipped in the middle of the column gap.
+ "
+ http://www.w3.org/TR/css3-multicol/#overflow-inside-multicol-elements
+ this causes the right-half (0.5em) of the 'K' glyph to
+ be overlapped by the right-half (0.75em) of the 1st blue -moz-column-rule.
+ Same thing should happen to the 'N' glyph of 'ORAN'.
+
+ Because no inline content should be rendered into the
+ 3rd column box, this causes the 2nd column rule not
+ been rendered because
+ "
+ Column rules are only drawn between two -moz-columns that
+ both have content.
+ "
+ http://www.w3.org/TR/css3-multicol/#column-gaps-and-rules
+ */
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>
+ <span id="pink">PINK</span>
+ <span id="orange">ORAN</span>
+ <span id="purple">PURP</span>
+ <span id="gray">GRAY</span>
+ </div>
+
+ </body>
+</html>