changeset
[css-overflow] Add computed value logic for overflow and contain: paint
Wed, 01 Jul 2015 15:22:36 +0200
- author
- Florian Rivoal <[email protected]>
- date
- Wed, 01 Jul 2015 15:22:36 +0200
- changeset 15804
- 6aa19556cbea
- parent 15798
- da95e4fdd383
- child 15805
- b1853180ac26
[css-overflow] Add computed value logic for overflow and contain: paint
| css-overflow/Overview.bs | file | annotate | diff | comparison | revisions | |
| css-overflow/Overview.html | file | annotate | diff | comparison | revisions |
1.1 --- a/css-overflow/Overview.bs Tue Jun 30 17:47:11 2015 -0700 1.2 +++ b/css-overflow/Overview.bs Wed Jul 01 15:22:36 2015 +0200 1.3 @@ -28,6 +28,8 @@ 1.4 <pre class="anchors"> 1.5 url: http://www.w3.org/TR/2008/CR-css3-marquee-20081205/#the-overflow-style; type: property; text: overflow-style; 1.6 url: http://dev.w3.org/csswg/selectors-3/#subject; type: dfn; text: subject; 1.7 +url: http://dev.w3.org/csswg/css-containment/#propdef-contain; type: property; text: contain 1.8 +url: http://dev.w3.org/csswg/css-containment/#paint-containment; type: dfn; text: paint containment 1.9 </pre> 1.10 <style> 1.11 table.source-demo-pair { 1.12 @@ -421,6 +423,15 @@ 1.13 with ''overflow/visible'' changed to ''overflow/auto''. 1.14 </li> 1.15 <li> 1.16 + Otherwise, if both cascaded values are ''overflow/visible'' 1.17 + and the computed value of 'contain' is 1.18 + one that activates <a>paint containment</a> 1.19 + (e.g. ''contain:strict'' 1.20 + or ''contain: paint'' 1.21 + or ''contain: layout paint''…), 1.22 + then the computed values of both 'overflow-x' and 'overflow-y' 1.23 + are changed to ''overflow/clip''.</li> 1.24 + <li> 1.25 Otherwise, the computed values are as specified. 1.26 </li> 1.27 </ol>
2.1 --- a/css-overflow/Overview.html Tue Jun 30 17:47:11 2015 -0700 2.2 +++ b/css-overflow/Overview.html Wed Jul 01 15:22:36 2015 +0200 2.3 @@ -8,6 +8,12 @@ 2.4 <title>CSS Overflow Module Level 3</title> 2.5 2.6 2.7 + <meta content="exploring" name="csswg-work-status"> 2.8 + 2.9 + 2.10 + <meta content="ED" name="w3c-status"> 2.11 + 2.12 + 2.13 <link href="../default.css" rel="stylesheet" type="text/css"> 2.14 2.15 2.16 @@ -160,139 +166,64 @@ 2.17 2.18 2.19 2.20 - <style>/* http://prismjs.com/download.html?themes=prism&languages=clike */ 2.21 -/** 2.22 - * prism.js default theme for JavaScript, CSS and HTML 2.23 - * Based on dabblet (http://dabblet.com) 2.24 - * @author Lea Verou 2.25 - */ 2.26 - 2.27 -code[class*="language-"], 2.28 -pre[class*="language-"] { 2.29 - color: black; 2.30 - text-shadow: 0 1px white; 2.31 - font-family: Consolas, Monaco, 'Andale Mono', monospace; 2.32 - direction: ltr; 2.33 - text-align: left; 2.34 - white-space: pre; 2.35 - word-spacing: normal; 2.36 - word-break: normal; 2.37 - line-height: 1.5; 2.38 - 2.39 - -moz-tab-size: 4; 2.40 - -o-tab-size: 4; 2.41 - tab-size: 4; 2.42 - 2.43 - -webkit-hyphens: none; 2.44 - -moz-hyphens: none; 2.45 - -ms-hyphens: none; 2.46 - hyphens: none; 2.47 -} 2.48 - 2.49 -pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection, 2.50 -code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection { 2.51 - text-shadow: none; 2.52 - background: #b3d4fc; 2.53 -} 2.54 - 2.55 -pre[class*="language-"]::selection, pre[class*="language-"] ::selection, 2.56 -code[class*="language-"]::selection, code[class*="language-"] ::selection { 2.57 - text-shadow: none; 2.58 - background: #b3d4fc; 2.59 -} 2.60 - 2.61 -@media print { 2.62 - code[class*="language-"], 2.63 - pre[class*="language-"] { 2.64 - text-shadow: none; 2.65 - } 2.66 -} 2.67 - 2.68 -/* Code blocks */ 2.69 -pre[class*="language-"] { 2.70 - padding: 1em; 2.71 - margin: .5em 0; 2.72 - overflow: auto; 2.73 -} 2.74 - 2.75 -:not(pre) > code[class*="language-"], 2.76 -pre[class*="language-"] { 2.77 - background: #f5f2f0; 2.78 -} 2.79 - 2.80 -/* Inline code */ 2.81 -:not(pre) > code[class*="language-"] { 2.82 - padding: .1em; 2.83 - border-radius: .3em; 2.84 -} 2.85 - 2.86 -.token.comment, 2.87 -.token.prolog, 2.88 -.token.doctype, 2.89 -.token.cdata { 2.90 - color: slategray; 2.91 -} 2.92 - 2.93 -.token.punctuation { 2.94 - color: #999; 2.95 -} 2.96 - 2.97 -.namespace { 2.98 - opacity: .7; 2.99 -} 2.100 - 2.101 -.token.property, 2.102 -.token.tag, 2.103 -.token.boolean, 2.104 -.token.number, 2.105 -.token.constant, 2.106 -.token.symbol, 2.107 -.token.deleted { 2.108 - color: #905; 2.109 -} 2.110 - 2.111 -.token.selector, 2.112 -.token.attr-name, 2.113 -.token.string, 2.114 -.token.char, 2.115 -.token.builtin, 2.116 -.token.inserted { 2.117 - color: #690; 2.118 -} 2.119 - 2.120 -.token.operator, 2.121 -.token.entity, 2.122 -.token.url, 2.123 -.language-css .token.string, 2.124 -.style .token.string { 2.125 - color: #a67f59; 2.126 - background: hsla(0, 0%, 100%, .5); 2.127 -} 2.128 - 2.129 -.token.atrule, 2.130 -.token.attr-value, 2.131 -.token.keyword { 2.132 - color: #07a; 2.133 -} 2.134 - 2.135 -.token.function { 2.136 - color: #DD4A68; 2.137 -} 2.138 - 2.139 -.token.regex, 2.140 -.token.important, 2.141 -.token.variable { 2.142 - color: #e90; 2.143 -} 2.144 - 2.145 -.token.important { 2.146 - font-weight: bold; 2.147 -} 2.148 - 2.149 -.token.entity { 2.150 - cursor: help; 2.151 -} 2.152 -</style> 2.153 + <style>.highlight .hll { background-color: #ffffcc } 2.154 +.highlight { background: #ffffff; } 2.155 +.highlight .c { color: #708090 } /* Comment */ 2.156 +.highlight .k { color: #990055 } /* Keyword */ 2.157 +.highlight .l { color: #669900 } /* Literal */ 2.158 +.highlight .n { color: #0077aa } /* Name */ 2.159 +.highlight .o { color: #999999 } /* Operator */ 2.160 +.highlight .p { color: #999999 } /* Punctuation */ 2.161 +.highlight .cm { color: #708090 } /* Comment.Multiline */ 2.162 +.highlight .cp { color: #708090 } /* Comment.Preproc */ 2.163 +.highlight .c1 { color: #708090 } /* Comment.Single */ 2.164 +.highlight .cs { color: #708090 } /* Comment.Special */ 2.165 +.highlight .kc { color: #990055 } /* Keyword.Constant */ 2.166 +.highlight .kd { color: #990055 } /* Keyword.Declaration */ 2.167 +.highlight .kn { color: #990055 } /* Keyword.Namespace */ 2.168 +.highlight .kp { color: #990055 } /* Keyword.Pseudo */ 2.169 +.highlight .kr { color: #990055 } /* Keyword.Reserved */ 2.170 +.highlight .kt { color: #990055 } /* Keyword.Type */ 2.171 +.highlight .ld { color: #669900 } /* Literal.Date */ 2.172 +.highlight .m { color: #990055 } /* Literal.Number */ 2.173 +.highlight .s { color: #669900 } /* Literal.String */ 2.174 +.highlight .na { color: #0077aa } /* Name.Attribute */ 2.175 +.highlight .nc { color: #0077aa } /* Name.Class */ 2.176 +.highlight .no { color: #0077aa } /* Name.Constant */ 2.177 +.highlight .nd { color: #0077aa } /* Name.Decorator */ 2.178 +.highlight .ni { color: #0077aa } /* Name.Entity */ 2.179 +.highlight .ne { color: #0077aa } /* Name.Exception */ 2.180 +.highlight .nf { color: #0077aa } /* Name.Function */ 2.181 +.highlight .nl { color: #0077aa } /* Name.Label */ 2.182 +.highlight .nn { color: #0077aa } /* Name.Namespace */ 2.183 +.highlight .py { color: #0077aa } /* Name.Property */ 2.184 +.highlight .nt { color: #0077aa } /* Name.Tag */ 2.185 +.highlight .nv { color: #0077aa } /* Name.Variable */ 2.186 +.highlight .ow { color: #999999 } /* Operator.Word */ 2.187 +.highlight .mb { color: #990055 } /* Literal.Number.Bin */ 2.188 +.highlight .mf { color: #990055 } /* Literal.Number.Float */ 2.189 +.highlight .mh { color: #990055 } /* Literal.Number.Hex */ 2.190 +.highlight .mi { color: #990055 } /* Literal.Number.Integer */ 2.191 +.highlight .mo { color: #990055 } /* Literal.Number.Oct */ 2.192 +.highlight .sb { color: #669900 } /* Literal.String.Backtick */ 2.193 +.highlight .sc { color: #669900 } /* Literal.String.Char */ 2.194 +.highlight .sd { color: #669900 } /* Literal.String.Doc */ 2.195 +.highlight .s2 { color: #669900 } /* Literal.String.Double */ 2.196 +.highlight .se { color: #669900 } /* Literal.String.Escape */ 2.197 +.highlight .sh { color: #669900 } /* Literal.String.Heredoc */ 2.198 +.highlight .si { color: #669900 } /* Literal.String.Interpol */ 2.199 +.highlight .sx { color: #669900 } /* Literal.String.Other */ 2.200 +.highlight .sr { color: #669900 } /* Literal.String.Regex */ 2.201 +.highlight .s1 { color: #669900 } /* Literal.String.Single */ 2.202 +.highlight .ss { color: #669900 } /* Literal.String.Symbol */ 2.203 +.highlight .vc { color: #0077aa } /* Name.Variable.Class */ 2.204 +.highlight .vg { color: #0077aa } /* Name.Variable.Global */ 2.205 +.highlight .vi { color: #0077aa } /* Name.Variable.Instance */ 2.206 +.highlight .il { color: #990055 } /* Literal.Number.Integer.Long */ 2.207 + .highlight { background: hsl(24, 20%, 95%); } 2.208 + pre.highlight { padding: 1em; margin: .5em 0; overflow: auto; } 2.209 + :not(pre).highlight { padding: .1em; border-radius: .3em; } 2.210 + </style> 2.211 </head> 2.212 2.213 2.214 @@ -308,7 +239,7 @@ 2.215 <h1 class="p-name no-ref" id="title">CSS Overflow Module Level 3</h1> 2.216 2.217 <h2 class="no-num no-toc no-ref heading settled" id="subtitle"><span class="content">Editor’s Draft, 2.218 - <time class="dt-updated" datetime="2015-04-30">30 April 2015</time></span></h2> 2.219 + <time class="dt-updated" datetime="2015-07-01">1 July 2015</time></span></h2> 2.220 2.221 <div data-fill-with="spec-metadata"> 2.222 <dl> 2.223 @@ -319,8 +250,9 @@ 2.224 <dt>Previous Versions: 2.225 <dd><a href="http://www.w3.org/TR/2013/WD-css-overflow-3-20130418/" rel="previous">http://www.w3.org/TR/2013/WD-css-overflow-3-20130418/</a> 2.226 <dt>Feedback: 2.227 - <dd><span><a href="mailto:[email protected]?subject=%5Bcss-overflow%5D%20feedback">[email protected]</a> with subject line “<kbd>[css-overflow] <var>… message topic …</var></kbd>†(<a href="http://lists.w3.org/Archives/Public/www-style/" rel="discussion">archives</a>)</span> 2.228 + <dd><span><a href="mailto:[email protected]?subject=%5Bcss-overflow%5D%20YOUR%20TOPIC%20HERE">[email protected]</a> with subject line “<kbd>[css-overflow] <var>… message topic …</var></kbd>†(<a href="http://lists.w3.org/Archives/Public/www-style/" rel="discussion">archives</a>)</span> 2.229 <dt>Issue Tracking: 2.230 + <dd><a href="https://github.com/w3c/csswg-drafts/issues/">GitHub</a> 2.231 <dd><a href="#issues-index">Inline In Spec</a> 2.232 <dt class="editor">Editors: 2.233 <dd class="editor p-author h-card vcard"><a class="p-name fn u-url url" href="http://dbaron.org/">L. David Baron</a> (<span class="p-org org">Mozilla</span>) 2.234 @@ -866,6 +798,17 @@ 2.235 2.236 2.237 <li> 2.238 + Otherwise, if both cascaded values are <a class="css" data-link-type="maybe" href="#valdef-overflow-visible">visible</a> 2.239 + and the computed value of <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-containment/#propdef-contain">contain</a> is 2.240 + one that activates <a data-link-type="dfn" href="http://dev.w3.org/csswg/css-containment/#paint-containment">paint containment</a> 2.241 + (e.g. <span class="css">contain:strict</span> 2.242 + or <a class="css" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-containment/#propdef-contain">contain: paint</a> 2.243 + or <a class="css" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-containment/#propdef-contain">contain: layout paint</a>…), 2.244 + then the computed values of both <a class="property" data-link-type="propdesc" href="#propdef-overflow-x">overflow-x</a> and <a class="property" data-link-type="propdesc" href="#propdef-overflow-y">overflow-y</a> 2.245 + are changed to <a class="css" data-link-type="maybe" href="#valdef-overflow-clip">clip</a>. 2.246 + 2.247 + 2.248 + <li> 2.249 Otherwise, the computed values are as specified. 2.250 2.251 2.252 @@ -910,7 +853,7 @@ 2.253 through any mechanism. 2.254 2.255 2.256 - <p class="issue" id="issue-a9ea8890"><a class="self-link" href="#issue-a9ea8890"></a>Mozilla implements -moz-hidden-unscrollable, 2.257 + <p class="issue" id="issue-a9ea8890"><a class="self-link" href="#issue-a9ea8890"></a> Mozilla implements -moz-hidden-unscrollable, 2.258 which is similar to <a class="css" data-link-type="maybe" href="#valdef-overflow-clip">clip</a>, 2.259 except that it does not cause the element to establish a BFC. 2.260 Should we match that?</p> 2.261 @@ -926,12 +869,12 @@ 2.262 This avoids any problem with scrollbars appearing 2.263 and disappearing in a dynamic environment. 2.264 When this value is specified and the target medium is <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/mediaqueries-4/#valdef-media-print">print</a>, 2.265 - overflowing content may be printed. 2.266 + overflowing content may be printed. 2.267 2.268 <dt><dfn class="css" data-dfn-for="overflow, overflow-x, overflow-y" data-dfn-type="value" data-export="" id="valdef-overflow-auto">auto<a class="self-link" href="#valdef-overflow-auto"></a></dfn> 2.269 2.270 <dd>The behavior of the <a class="css" data-link-type="maybe" href="#valdef-overflow-auto">auto</a> value is user agent-dependent, 2.271 - but should cause a scrolling mechanism to be provided for overflowing boxes. 2.272 + but should cause a scrolling mechanism to be provided for overflowing boxes. 2.273 2.274 </dl> 2.275 2.276 @@ -947,7 +890,7 @@ 2.277 <p>UAs must apply the <a class="property" data-link-type="propdesc" href="#propdef-overflow">overflow</a> property 2.278 set on the root element to the viewport. 2.279 HTML UAs must instead apply the ‘overflow’ property 2.280 - from the <code><a data-link-type="element" href="https://html.spec.whatwg.org/#the-body-element">body</a></code> element to the viewport 2.281 + from the <code><a data-link-type="element" href="https://html.spec.whatwg.org/multipage/semantics.html#the-body-element">body</a></code> element to the viewport 2.282 if the value on the root element is <a class="css" data-link-type="maybe" href="#valdef-overflow-visible">visible</a>. 2.283 The <a class="css" data-link-type="maybe" href="#valdef-overflow-visible">visible</a> value when used for the viewport 2.284 must be interpreted as <a class="css" data-link-type="maybe" href="#valdef-overflow-auto">auto</a>. 2.285 @@ -963,7 +906,7 @@ 2.286 the containing block formed by the element with the scrollbars.</p> 2.287 2.288 2.289 - <p class="issue" id="issue-402eb70c"><a class="self-link" href="#issue-402eb70c"></a>import examples from <a data-link-type="biblio" href="#biblio-css3-box">[CSS3-BOX]</a>.</p> 2.290 + <p class="issue" id="issue-402eb70c"><a class="self-link" href="#issue-402eb70c"></a> import examples from <a data-link-type="biblio" href="#biblio-css3-box">[CSS3-BOX]</a>.</p> 2.291 2.292 2.293 <p class="issue" id="issue-c318b1c1"><a class="self-link" href="#issue-c318b1c1"></a> 2.294 @@ -1034,14 +977,14 @@ 2.295 <td><abbr title="follows order of property value definition">per grammar</abbr></table> 2.296 2.297 2.298 - <p class="issue" id="issue-b2c6e3da"><a class="self-link" href="#issue-b2c6e3da"></a>The naming of this property and its values is preliminary. 2.299 + <p class="issue" id="issue-b2c6e3da"><a class="self-link" href="#issue-b2c6e3da"></a> The naming of this property and its values is preliminary. 2.300 This was initially proposed as 2.301 "fragmentation: auto | none | break | clone | page" 2.302 in <a href="https://lists.w3.org/Archives/Public/www-style/2015Jan/0357.html">https://lists.w3.org/Archives/Public/www-style/2015Jan/0357.html</a>, 2.303 and there is not yet wide agreement as to which naming is better.</p> 2.304 2.305 2.306 - <p class="issue" id="issue-d52b3e3d"><a class="self-link" href="#issue-d52b3e3d"></a>This property is meant to generalize and replace <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-regions-1/#propdef-region-fragment">region-fragment</a>. 2.307 + <p class="issue" id="issue-d52b3e3d"><a class="self-link" href="#issue-d52b3e3d"></a> This property is meant to generalize and replace <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-regions-1/#propdef-region-fragment">region-fragment</a>. 2.308 Once it is sufficiently stable in this specification, 2.309 <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-regions-1/#propdef-region-fragment">region-fragment</a> should be removed from the regions specification in favor of this.</p> 2.310 2.311 @@ -1079,7 +1022,7 @@ 2.312 2.313 2.314 2.315 - <p class="issue" id="issue-36be54be"><a class="self-link" href="#issue-36be54be"></a>When the element isn’t a <a data-link-type="dfn" href="http://dev.w3.org/csswg/css-break-3/#fragmentation-container">fragmentation container</a> already, 2.316 + <p class="issue" id="issue-36be54be"><a class="self-link" href="#issue-36be54be"></a> When the element isn’t a <a data-link-type="dfn" href="http://dev.w3.org/csswg/css-break-3/#fragmentation-container">fragmentation container</a> already, 2.317 should this work by turning it directly into one, 2.318 or by creating a <a data-link-type="dfn" href="#fragment-box">fragment box</a> inside it like <a class="css" data-link-type="maybe" href="#valdef-continue-fragments">fragments</a> does?</p> 2.319 2.320 @@ -1148,7 +1091,7 @@ 2.321 </ol> 2.322 2.323 2.324 - <p class="issue" id="issue-53644667"><a class="self-link" href="#issue-53644667"></a>If we introduce a pseudo element that can select columns in a multicol, 2.325 + <p class="issue" id="issue-53644667"><a class="self-link" href="#issue-53644667"></a> If we introduce a pseudo element that can select columns in a multicol, 2.326 we would need to specify that auto computes to auto on it, 2.327 or introduce a new value and have auto compute to that 2.328 (but what would that value compute to on things that aren’t columns?).</p> 2.329 @@ -1165,10 +1108,10 @@ 2.330 <p>This section introduces and defines the meaning of the <a class="css" data-link-type="maybe" href="#valdef-continue-paginate">paginate</a> value of the <a class="property" data-link-type="propdesc" href="#propdef-continue">continue</a> property.</p> 2.331 2.332 2.333 - <p class="issue" id="issue-001d5014"><a class="self-link" href="#issue-001d5014"></a>Write this section</p> 2.334 + <p class="issue" id="issue-001d5014"><a class="self-link" href="#issue-001d5014"></a> Write this section</p> 2.335 2.336 2.337 - <p class="issue" id="issue-338ad0f3"><a class="self-link" href="#issue-338ad0f3"></a>Pages should be possible to style with @page rules. How does that work for nested pages?</p> 2.338 + <p class="issue" id="issue-338ad0f3"><a class="self-link" href="#issue-338ad0f3"></a> Pages should be possible to style with @page rules. How does that work for nested pages?</p> 2.339 2.340 2.341 <div class="issue" id="issue-67ad77e5"><a class="self-link" href="#issue-67ad77e5"></a> 2.342 @@ -1176,26 +1119,25 @@ 2.343 be expressed through some magic in the computed value of <a class="css" data-link-type="maybe" href="#valdef-continue-auto">auto</a>, 2.344 or by inserting this in the UA stylesheet: 2.345 2.346 - <pre><code class="lang-css">@media (overflow-block: paged), (overflow-block: optional-paged) { 2.347 - :root { 2.348 - continue: paginate; 2.349 - } 2.350 -} 2.351 -</code></pre> 2.352 + <pre><code class="lang-css highlight"><span class="k">@media</span> <span class="o">(</span><span class="nt">overflow-block</span><span class="o">:</span> <span class="nt">paged</span><span class="o">),</span> <span class="o">(</span><span class="nt">overflow-block</span><span class="o">:</span> <span class="nt">optional-paged</span><span class="o">)</span> <span class="p">{</span> 2.353 + <span class="nd">:root</span> <span class="p">{</span> 2.354 + <span class="n">continue</span><span class="o">:</span> <span class="n">paginate</span><span class="p">;</span> 2.355 + <span class="p">}</span> 2.356 +<span class="p">}</span></code></pre> 2.357 </div> 2.358 2.359 2.360 - <p class="issue" id="issue-6eb3c644"><a class="self-link" href="#issue-6eb3c644"></a>Traditional pagination (e.g. when printing) assumes that 2.361 + <p class="issue" id="issue-6eb3c644"><a class="self-link" href="#issue-6eb3c644"></a> Traditional pagination (e.g. when printing) assumes that 2.362 :root is contained in the page box, 2.363 rather than having the page box be a pseudo element child of :root. 2.364 Can we work around that using something similar to fragment boxes? 2.365 Or maybe by having a fragment box (reproducing :root) inside a page box inside :root?</p> 2.366 2.367 2.368 - <p class="issue" id="issue-64583cf9"><a class="self-link" href="#issue-64583cf9"></a>How does the page box model work when it is a child of a regular css box?</p> 2.369 + <p class="issue" id="issue-64583cf9"><a class="self-link" href="#issue-64583cf9"></a> How does the page box model work when it is a child of a regular css box?</p> 2.370 2.371 2.372 - <p class="issue" id="issue-e9f64b3d"><a class="self-link" href="#issue-e9f64b3d"></a>The initial proposal in <a data-link-type="biblio" href="#biblio-css3gcpm">[CSS3GCPM]</a> and implemantation from Opera 2.373 + <p class="issue" id="issue-e9f64b3d"><a class="self-link" href="#issue-e9f64b3d"></a> The initial proposal in <a data-link-type="biblio" href="#biblio-css3gcpm">[CSS3GCPM]</a> and implemantation from Opera 2.374 used 4 values instead of <a class="css" data-link-type="maybe" href="#valdef-continue-paginate">paginate</a>: 2.375 "paged-x | paged-y | paged-x-controls | paged-y-controls". 2.376 Should this property also include these values, 2.377 @@ -1203,13 +1145,13 @@ 2.378 (e.g.: "pagination-layout: auto | horizontal | vertical", "pagination-controls: auto | none")</p> 2.379 2.380 2.381 - <p class="issue" id="issue-55c97ed8"><a class="self-link" href="#issue-55c97ed8"></a>Ability to display N pages at once 2.382 + <p class="issue" id="issue-55c97ed8"><a class="self-link" href="#issue-55c97ed8"></a> Ability to display N pages at once 2.383 rather than just one page at once? 2.384 Could this be a value of "pagination-layout", such as: 2.385 "pagination-layout: horizontal 2;"</p> 2.386 2.387 2.388 - <p class="issue" id="issue-64de292b"><a class="self-link" href="#issue-64de292b"></a>Brad Kemper has proposed a model for combining pagination and 2.389 + <p class="issue" id="issue-64de292b"><a class="self-link" href="#issue-64de292b"></a> Brad Kemper has proposed a model for combining pagination and 2.390 fragment overflow, which also deals with displaying multiple pages. 2.391 <a href="http://www.w3.org/mid/[email protected]">http://www.w3.org/mid/[email protected]</a></p> 2.392 2.393 @@ -1514,15 +1456,15 @@ 2.394 <p> 2.395 Specifying other values of <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css2/visuren.html#propdef-display">display</a>, <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-position-3/#propdef-position">position</a>, 2.396 or <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css2/visuren.html#propdef-float">float</a> is permitted, but is not allowed to change 2.397 - the computed value of <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-display-3/#propdef-display-inside">display-inside</a>. 2.398 + the computed value of <a class="property" data-link-type="propdesc">display-inside</a>. 2.399 (Since <a class="property" data-link-type="propdesc" href="#propdef-continue">continue</a> only 2.400 applies to block containers, flex containers, and grid containers 2.401 - the computed value of <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-display-3/#propdef-display-inside">display-inside</a> is always 2.402 - <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-display-3/#valdef-display-inside-block">block</a>, <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-display-3/#valdef-display-inside-flex">flex</a>, or 2.403 - <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-display-3/#valdef-display-inside-grid">grid</a>. 2.404 + the computed value of <a class="property" data-link-type="propdesc">display-inside</a> is always 2.405 + <span class="css">block</span>, <span class="css">flex</span>, or 2.406 + <span class="css">grid</span>. 2.407 <span class="issue" id="issue-d98e732d"><a class="self-link" href="#issue-d98e732d"></a>Need to specify exactly how this works, 2.408 but it depends on 2.409 - having <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-display-3/#propdef-display-inside">display-inside</a> and <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-display-3/#propdef-display-outside">display-outside</a> specified.</span> 2.410 + having <a class="property" data-link-type="propdesc">display-inside</a> and <a class="property" data-link-type="propdesc">display-outside</a> specified.</span> 2.411 </p> 2.412 2.413 2.414 @@ -1550,7 +1492,7 @@ 2.415 <p class="issue" id="issue-d95b27f9"><a class="self-link" href="#issue-d95b27f9"></a> 2.416 This inheritance rule allows specifying styles indirectly 2.417 (by using explicit <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-cascade-4/#valdef-all-inherit">inherit</a> or using default inheritance 2.418 - on properties that don’t apply to <span class="css">::first-letter</span>) 2.419 + on properties that don’t apply to <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-pseudo-4/#selectordef-first-letter">::first-letter</a>) 2.420 that can’t be specified directly 2.421 (based on the rules in the next section). 2.422 This is a problem. 2.423 @@ -1610,14 +1552,14 @@ 2.424 The <a class="css" data-link-type="maybe" href="#selectordef-nth-fragment">::nth-fragment()</a> pseudo-element 2.425 can also be used to style 2.426 content inside of a <a data-link-type="dfn" href="#fragment-box">fragment box</a>. 2.427 - Unlike the <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-pseudo-4/#selectordef-first-line">::first-line</a> and <span class="css">::first-letter</span> pseudo-elements, 2.428 + Unlike the <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-pseudo-4/#selectordef-first-line">::first-line</a> and <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-pseudo-4/#selectordef-first-letter">::first-letter</a> pseudo-elements, 2.429 the <a class="css" data-link-type="maybe" href="#selectordef-nth-fragment">::nth-fragment()</a> pseudo-element can be applied 2.430 to parts of the selector other than the subject: 2.431 in particular, it can match ancestors of the subject. 2.432 However, the only CSS properties applied 2.433 by rules with such selectors 2.434 are those that apply 2.435 - to the <span class="css">::first-letter</span> pseudo-element. 2.436 + to the <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-pseudo-4/#selectordef-first-letter">::first-letter</a> pseudo-element. 2.437 </p> 2.438 2.439 2.440 @@ -1633,7 +1575,7 @@ 2.441 2.442 <li> 2.443 the declarations are for properties that apply to the 2.444 - <span class="css">::first-letter</span> pseudo-element, 2.445 + <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-pseudo-4/#selectordef-first-letter">::first-letter</a> pseudo-element, 2.446 2.447 2.448 2.449 @@ -1822,7 +1764,7 @@ 2.450 it should actually apply to any fragmentainer.</p> 2.451 2.452 2.453 - <p class="issue" id="issue-13fa8ed4"><a class="self-link" href="#issue-13fa8ed4"></a>having max-lines do nothing on regular elements is not ideal. 2.454 + <p class="issue" id="issue-13fa8ed4"><a class="self-link" href="#issue-13fa8ed4"></a> having max-lines do nothing on regular elements is not ideal. 2.455 When applied to non fragmentainers, 2.456 it should probably cause <a class="property" data-link-type="propdesc" href="#propdef-continue">continue</a> to compute to <a class="css" data-link-type="maybe" href="#valdef-continue-discard">discard</a> 2.457 so that you only need to reach for one property rather than 2 to get 2.458 @@ -2136,14 +2078,6 @@ 2.459 <ul> 2.460 <li><a href="http://dev.w3.org/csswg/css-content-3/#propdef-content">content</a> 2.461 </ul> 2.462 - <li><a data-link-type="biblio" href="#biblio-css-display-3">[css-display-3]</a> defines the following terms: 2.463 - <ul> 2.464 - <li><a href="http://dev.w3.org/csswg/css-display-3/#valdef-display-inside-block">block</a> 2.465 - <li><a href="http://dev.w3.org/csswg/css-display-3/#propdef-display-inside">display-inside</a> 2.466 - <li><a href="http://dev.w3.org/csswg/css-display-3/#propdef-display-outside">display-outside</a> 2.467 - <li><a href="http://dev.w3.org/csswg/css-display-3/#valdef-display-inside-flex">flex</a> 2.468 - <li><a href="http://dev.w3.org/csswg/css-display-3/#valdef-display-inside-grid">grid</a> 2.469 - </ul> 2.470 <li><a data-link-type="biblio" href="#biblio-css-multicol-1">[css-multicol-1]</a> defines the following terms: 2.471 <ul> 2.472 <li><a href="http://dev.w3.org/csswg/css-multicol-1/#overflow-columns">overflow columns</a> 2.473 @@ -2154,6 +2088,7 @@ 2.474 </ul> 2.475 <li><a data-link-type="biblio" href="#biblio-css-pseudo-4">[css-pseudo-4]</a> defines the following terms: 2.476 <ul> 2.477 + <li><a href="http://dev.w3.org/csswg/css-pseudo-4/#selectordef-first-letter">::first-letter</a> 2.478 <li><a href="http://dev.w3.org/csswg/css-pseudo-4/#selectordef-first-line">::first-line</a> 2.479 </ul> 2.480 <li><a data-link-type="biblio" href="#biblio-css-regions-1">[css-regions-1]</a> defines the following terms: 2.481 @@ -2191,7 +2126,7 @@ 2.482 </ul> 2.483 <li><a data-link-type="biblio" href="#biblio-html">[HTML]</a> defines the following terms: 2.484 <ul> 2.485 - <li><a href="https://html.spec.whatwg.org/#the-body-element">body</a> 2.486 + <li><a href="https://html.spec.whatwg.org/multipage/semantics.html#the-body-element">body</a> 2.487 </ul> 2.488 <li><a data-link-type="biblio" href="#biblio-mediaqueries-4">[mediaqueries-4]</a> defines the following terms: 2.489 <ul> 2.490 @@ -2202,31 +2137,23 @@ 2.491 <h3 class="no-num heading settled" id="normative"><span class="content">Normative References</span><a class="self-link" href="#normative"></a></h3> 2.492 <dl> 2.493 <dt id="biblio-css21"><a class="self-link" href="#biblio-css21"></a>[CSS21] 2.494 - <dd>Bert Bos; et al. <a href="http://www.w3.org/TR/2011/REC-CSS2-20110607">Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification</a>. 7 June 2011. W3C Recommendation. URL: <a href="http://www.w3.org/TR/2011/REC-CSS2-20110607">http://www.w3.org/TR/2011/REC-CSS2-20110607</a> 2.495 - <dt id="biblio-css3-flexbox"><a class="self-link" href="#biblio-css3-flexbox"></a>[CSS3-FLEXBOX] 2.496 - <dd>Tab Atkins Jr.; Elika J. Etemad; Alex Mogilevsky. <a href="http://www.w3.org/TR/2012/CR-css3-flexbox-20120918/">CSS Flexible Box Layout Module</a>. 18 September 2012. W3C Candidate Recommendation. (Work in progress.) URL: <a href="http://www.w3.org/TR/2012/CR-css3-flexbox-20120918/">http://www.w3.org/TR/2012/CR-css3-flexbox-20120918/</a> 2.497 - <dt id="biblio-css3-grid-layout"><a class="self-link" href="#biblio-css3-grid-layout"></a>[CSS3-GRID-LAYOUT] 2.498 - <dd>Tab Atkins Jr.; Elika J. Etemad; Rossen Atanassov. <a href="http://www.w3.org/TR/2013/WD-css3-grid-layout-20130402/">CSS Grid Layout</a>. 2 April 2013. W3C Working Draft. (Work in progress.) URL: <a href="http://www.w3.org/TR/2013/WD-css3-grid-layout-20130402/">http://www.w3.org/TR/2013/WD-css3-grid-layout-20130402/</a> 2.499 - <dt id="biblio-css3-transforms"><a class="self-link" href="#biblio-css3-transforms"></a>[CSS3-TRANSFORMS] 2.500 - <dd>Simon Fraser; et al. <a href="http://www.w3.org/TR/2012/WD-css3-transforms-20120911/">CSS Transforms</a>. 11 September 2012. W3C Working Draft. (Work in progress.) URL: <a href="http://www.w3.org/TR/2012/WD-css3-transforms-20120911/">http://www.w3.org/TR/2012/WD-css3-transforms-20120911/</a> 2.501 + <dd>Bert Bos; et al. <a href="http://www.w3.org/TR/CSS2">Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification</a>. 7 June 2011. REC. URL: <a href="http://www.w3.org/TR/CSS2">http://www.w3.org/TR/CSS2</a> 2.502 <dt id="biblio-css3cascade"><a class="self-link" href="#biblio-css3cascade"></a>[CSS3CASCADE] 2.503 - <dd>Håkon Wium Lie; Elika J. Etemad; Tab Atkins Jr.. <a href="http://www.w3.org/TR/2013/CR-css-cascade-3-20131003/">CSS Cascading and Inheritance Level 3</a>. 3 October 2013. W3C Candidate Recommendation. (Work in progress.) URL: <a href="http://www.w3.org/TR/2013/CR-css-cascade-3-20131003/">http://www.w3.org/TR/2013/CR-css-cascade-3-20131003/</a> 2.504 + <dd>Elika Etemad; Tab Atkins Jr.. <a href="http://www.w3.org/TR/css-cascade-3/">CSS Cascading and Inheritance Level 3</a>. 16 April 2015. CR. URL: <a href="http://www.w3.org/TR/css-cascade-3/">http://www.w3.org/TR/css-cascade-3/</a> 2.505 <dt id="biblio-css3col"><a class="self-link" href="#biblio-css3col"></a>[CSS3COL] 2.506 - <dd>Håkon Wium Lie. <a href="http://www.w3.org/TR/2011/CR-css3-multicol-20110412">CSS Multi-column Layout Module</a>. 12 April 2011. W3C Candidate Recommendation. (Work in progress.) URL: <a href="http://www.w3.org/TR/2011/CR-css3-multicol-20110412">http://www.w3.org/TR/2011/CR-css3-multicol-20110412</a> 2.507 + <dd>Håkon Wium Lie. <a href="http://www.w3.org/TR/css3-multicol">CSS Multi-column Layout Module</a>. 12 April 2011. CR. URL: <a href="http://www.w3.org/TR/css3-multicol">http://www.w3.org/TR/css3-multicol</a> 2.508 <dt id="biblio-html"><a class="self-link" href="#biblio-html"></a>[HTML] 2.509 - <dd>Ian Hickson. <a href="https://html.spec.whatwg.org/">HTML</a>. Living Standard. URL: <a href="https://html.spec.whatwg.org/">https://html.spec.whatwg.org/</a> 2.510 + <dd>Ian Hickson. <a href="https://html.spec.whatwg.org/multipage/">HTML Standard</a>. Living Standard. URL: <a href="https://html.spec.whatwg.org/multipage/">https://html.spec.whatwg.org/multipage/</a> 2.511 <dt id="biblio-select"><a class="self-link" href="#biblio-select"></a>[SELECT] 2.512 - <dd>Tantek Çelik; et al. <a href="http://www.w3.org/TR/2011/REC-css3-selectors-20110929/">Selectors Level 3</a>. 29 September 2011. W3C Recommendation. URL: <a href="http://www.w3.org/TR/2011/REC-css3-selectors-20110929/">http://www.w3.org/TR/2011/REC-css3-selectors-20110929/</a> 2.513 + <dd>Tantek Çelik; et al. <a href="http://www.w3.org/TR/css3-selectors/">Selectors Level 3</a>. 29 September 2011. REC. URL: <a href="http://www.w3.org/TR/css3-selectors/">http://www.w3.org/TR/css3-selectors/</a> 2.514 <dt id="biblio-css-backgrounds-3"><a class="self-link" href="#biblio-css-backgrounds-3"></a>[CSS-BACKGROUNDS-3] 2.515 <dd>CSS Backgrounds and Borders Module Level 3 URL: <a href="http://www.w3.org/TR/css3-background/">http://www.w3.org/TR/css3-background/</a> 2.516 <dt id="biblio-css-break-3"><a class="self-link" href="#biblio-css-break-3"></a>[CSS-BREAK-3] 2.517 <dd>CSS Fragmentation Module Level 3 URL: <a href="http://www.w3.org/TR/css3-break/">http://www.w3.org/TR/css3-break/</a> 2.518 <dt id="biblio-css-cascade-4"><a class="self-link" href="#biblio-css-cascade-4"></a>[CSS-CASCADE-4] 2.519 - <dd>CSS Cascading and Inheritance Level 4 URL: <a href="http://dev.w3.org/csswg/css-cascade-4/">http://dev.w3.org/csswg/css-cascade-4/</a> 2.520 + <dd>Elika Etemad; Tab Atkins Jr.. <a href="http://www.w3.org/TR/css-cascade-4/">CSS Cascading and Inheritance Level 4</a>. 21 April 2015. WD. URL: <a href="http://www.w3.org/TR/css-cascade-4/">http://www.w3.org/TR/css-cascade-4/</a> 2.521 <dt id="biblio-css-content-3"><a class="self-link" href="#biblio-css-content-3"></a>[CSS-CONTENT-3] 2.522 <dd>CSS Generated Content Module Level 3 URL: <a href="http://dev.w3.org/csswg/css-content-3/">http://dev.w3.org/csswg/css-content-3/</a> 2.523 - <dt id="biblio-css-display-3"><a class="self-link" href="#biblio-css-display-3"></a>[CSS-DISPLAY-3] 2.524 - <dd>Tab Atkins Jr.; Elika Etemad. <a href="http://www.w3.org/TR/css-display-3/">CSS Display Module Level 3</a>. 11 September 2014. WD. URL: <a href="http://www.w3.org/TR/css-display-3/">http://www.w3.org/TR/css-display-3/</a> 2.525 <dt id="biblio-css-multicol-1"><a class="self-link" href="#biblio-css-multicol-1"></a>[CSS-MULTICOL-1] 2.526 <dd>CSS Multi-column Layout Module Level 1 URL: <a href="http://www.w3.org/TR/css3-multicol/">http://www.w3.org/TR/css3-multicol/</a> 2.527 <dt id="biblio-css-position-3"><a class="self-link" href="#biblio-css-position-3"></a>[CSS-POSITION-3] 2.528 @@ -2247,6 +2174,12 @@ 2.529 <dd>Elika Etemad; Koji Ishii. <a href="http://www.w3.org/TR/css-writing-modes-3/">CSS Writing Modes Level 3</a>. 20 March 2014. CR. URL: <a href="http://www.w3.org/TR/css-writing-modes-3/">http://www.w3.org/TR/css-writing-modes-3/</a> 2.530 <dt id="biblio-css3-break"><a class="self-link" href="#biblio-css3-break"></a>[CSS3-BREAK] 2.531 <dd>Rossen Atanassov; Elika Etemad. <a href="http://www.w3.org/TR/css3-break/">CSS Fragmentation Module Level 3</a>. 29 January 2015. WD. URL: <a href="http://www.w3.org/TR/css3-break/">http://www.w3.org/TR/css3-break/</a> 2.532 + <dt id="biblio-css3-flexbox"><a class="self-link" href="#biblio-css3-flexbox"></a>[CSS3-FLEXBOX] 2.533 + <dd>Tab Atkins Jr.; Elika Etemad; Rossen Atanassov. <a href="http://www.w3.org/TR/css-flexbox-1/">CSS Flexible Box Layout Module Level 1</a>. 14 May 2015. LCWD. URL: <a href="http://www.w3.org/TR/css-flexbox-1/">http://www.w3.org/TR/css-flexbox-1/</a> 2.534 + <dt id="biblio-css3-grid-layout"><a class="self-link" href="#biblio-css3-grid-layout"></a>[CSS3-GRID-LAYOUT] 2.535 + <dd>Tab Atkins Jr.; Elika Etemad; Rossen Atanassov. <a href="http://www.w3.org/TR/css-grid-1/">CSS Grid Layout Module Level 1</a>. 17 March 2015. WD. URL: <a href="http://www.w3.org/TR/css-grid-1/">http://www.w3.org/TR/css-grid-1/</a> 2.536 + <dt id="biblio-css3-transforms"><a class="self-link" href="#biblio-css3-transforms"></a>[CSS3-TRANSFORMS] 2.537 + <dd>Simon Fraser; et al. <a href="http://www.w3.org/TR/css-transforms-1/">CSS Transforms Module Level 1</a>. 26 November 2013. WD. URL: <a href="http://www.w3.org/TR/css-transforms-1/">http://www.w3.org/TR/css-transforms-1/</a> 2.538 <dt id="biblio-mediaqueries-4"><a class="self-link" href="#biblio-mediaqueries-4"></a>[MEDIAQUERIES-4] 2.539 <dd>Florian Rivoal; Tab Atkins Jr.. <a href="http://www.w3.org/TR/mediaqueries-4/">Media Queries Level 4</a>. 5 June 2014. WD. URL: <a href="http://www.w3.org/TR/mediaqueries-4/">http://www.w3.org/TR/mediaqueries-4/</a> 2.540 <dt id="biblio-rfc2119"><a class="self-link" href="#biblio-rfc2119"></a>[RFC2119] 2.541 @@ -2256,18 +2189,18 @@ 2.542 <dl> 2.543 <dt id="biblio-css1"><a class="self-link" href="#biblio-css1"></a>[CSS1] 2.544 <dd>Håkon Wium Lie; Bert Bos. <a href="http://www.w3.org/TR/CSS1/">Cascading Style Sheets (CSS1) Level 1 Specification</a>. 11 April 2008. REC. URL: <a href="http://www.w3.org/TR/CSS1/">http://www.w3.org/TR/CSS1/</a> 2.545 - <dt id="biblio-css3-regions"><a class="self-link" href="#biblio-css3-regions"></a>[CSS3-REGIONS] 2.546 - <dd>Vincent Hardy; Rossen Atanassov; Alan Stearns. <a href="http://www.w3.org/TR/2013/WD-css3-regions-20130528/">CSS Regions Module Level 1</a>. 28 May 2013. W3C Working Draft. (Work in progress.) URL: <a href="http://www.w3.org/TR/2013/WD-css3-regions-20130528/">http://www.w3.org/TR/2013/WD-css3-regions-20130528/</a> 2.547 <dt id="biblio-css3bg"><a class="self-link" href="#biblio-css3bg"></a>[CSS3BG] 2.548 - <dd>Bert Bos; Elika J. Etemad; Brad Kemper. <a href="http://www.w3.org/TR/2012/CR-css3-background-20120724/">CSS Backgrounds and Borders Module Level 3</a>. 24 July 2012. W3C Candidate Recommendation. (Work in progress.) URL: <a href="http://www.w3.org/TR/2012/CR-css3-background-20120724/">http://www.w3.org/TR/2012/CR-css3-background-20120724/</a> 2.549 + <dd>Bert Bos; Elika Etemad; Brad Kemper. <a href="http://www.w3.org/TR/css3-background/">CSS Backgrounds and Borders Module Level 3</a>. 9 September 2014. CR. URL: <a href="http://www.w3.org/TR/css3-background/">http://www.w3.org/TR/css3-background/</a> 2.550 <dt id="biblio-css3gcpm"><a class="self-link" href="#biblio-css3gcpm"></a>[CSS3GCPM] 2.551 - <dd>Håkon Wium Lie. <a href="http://www.w3.org/TR/2011/WD-css3-gcpm-20111129/">CSS Generated Content for Paged Media Module</a>. 29 November 2011. W3C Working Draft. (Work in progress.) URL: <a href="http://www.w3.org/TR/2011/WD-css3-gcpm-20111129/">http://www.w3.org/TR/2011/WD-css3-gcpm-20111129/</a> 2.552 + <dd>Dave Cramer. <a href="http://www.w3.org/TR/css-gcpm-3/">CSS Generated Content for Paged Media Module</a>. 13 May 2014. WD. URL: <a href="http://www.w3.org/TR/css-gcpm-3/">http://www.w3.org/TR/css-gcpm-3/</a> 2.553 <dt id="biblio-css3text"><a class="self-link" href="#biblio-css3text"></a>[CSS3TEXT] 2.554 - <dd>Elika J. Etemad; Koji Ishii. <a href="http://www.w3.org/TR/2012/WD-css3-text-20121113/">CSS Text Module Level 3</a>. 13 November 2012. W3C Working Draft. (Work in progress.) URL: <a href="http://www.w3.org/TR/2012/WD-css3-text-20121113/">http://www.w3.org/TR/2012/WD-css3-text-20121113/</a> 2.555 + <dd>Elika Etemad; Koji Ishii. <a href="http://www.w3.org/TR/css-text-3/">CSS Text Module Level 3</a>. 10 October 2013. LCWD. URL: <a href="http://www.w3.org/TR/css-text-3/">http://www.w3.org/TR/css-text-3/</a> 2.556 <dt id="biblio-css3-box"><a class="self-link" href="#biblio-css3-box"></a>[CSS3-BOX] 2.557 <dd>Bert Bos. <a href="http://www.w3.org/TR/css3-box">CSS basic box model</a>. 9 August 2007. WD. URL: <a href="http://www.w3.org/TR/css3-box">http://www.w3.org/TR/css3-box</a> 2.558 <dt id="biblio-css3-marquee"><a class="self-link" href="#biblio-css3-marquee"></a>[CSS3-MARQUEE] 2.559 <dd>Bert Bos. <a href="http://www.w3.org/TR/css3-marquee">CSS Marquee Module Level 3</a>. 14 October 2014. NOTE. URL: <a href="http://www.w3.org/TR/css3-marquee">http://www.w3.org/TR/css3-marquee</a> 2.560 + <dt id="biblio-css3-regions"><a class="self-link" href="#biblio-css3-regions"></a>[CSS3-REGIONS] 2.561 + <dd>Rossen Atanassov; Alan Stearns. <a href="http://www.w3.org/TR/css-regions-1/">CSS Regions Module Level 1</a>. 9 October 2014. WD. URL: <a href="http://www.w3.org/TR/css-regions-1/">http://www.w3.org/TR/css-regions-1/</a> 2.562 <dt id="biblio-cssom-view"><a class="self-link" href="#biblio-cssom-view"></a>[CSSOM-VIEW] 2.563 <dd>Simon Pieters; Glenn Adams. <a href="http://www.w3.org/TR/cssom-view/">CSSOM View Module</a>. 17 December 2013. WD. URL: <a href="http://www.w3.org/TR/cssom-view/">http://www.w3.org/TR/cssom-view/</a> 2.564 </dl> 2.565 @@ -2379,11 +2312,11 @@ 2.566 If needed, define more formally, as for scrollable overflow above. 2.567 (Maybe even share the definitions in an appropriate way!) 2.568 <a href="#issue-42ea3c29"> ↵ </a></div> 2.569 - <div class="issue">Mozilla implements -moz-hidden-unscrollable, 2.570 + <div class="issue"> Mozilla implements -moz-hidden-unscrollable, 2.571 which is similar to <a class="css" data-link-type="maybe" href="#valdef-overflow-clip">clip</a>, 2.572 except that it does not cause the element to establish a BFC. 2.573 Should we match that?<a href="#issue-a9ea8890"> ↵ </a></div> 2.574 - <div class="issue">import examples from <a data-link-type="biblio" href="#biblio-css3-box">[CSS3-BOX]</a>.<a href="#issue-402eb70c"> ↵ </a></div> 2.575 + <div class="issue"> import examples from <a data-link-type="biblio" href="#biblio-css3-box">[CSS3-BOX]</a>.<a href="#issue-402eb70c"> ↵ </a></div> 2.576 <div class="issue"> 2.577 Explain which directions allow scrolling and which don’t, 2.578 as a function of <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-writing-modes-3/#propdef-direction">direction</a> 2.579 @@ -2399,54 +2332,53 @@ 2.580 despite that implementations have implemented 2.581 <a class="property" data-link-type="propdesc" href="#propdef-overflow-x">overflow-x</a> and <a class="property" data-link-type="propdesc" href="#propdef-overflow-y">overflow-y</a> instead? 2.582 <a href="#issue-52e2a181"> ↵ </a></div> 2.583 - <div class="issue">The naming of this property and its values is preliminary. 2.584 + <div class="issue"> The naming of this property and its values is preliminary. 2.585 This was initially proposed as 2.586 "fragmentation: auto | none | break | clone | page" 2.587 in <a href="https://lists.w3.org/Archives/Public/www-style/2015Jan/0357.html">https://lists.w3.org/Archives/Public/www-style/2015Jan/0357.html</a>, 2.588 and there is not yet wide agreement as to which naming is better.<a href="#issue-b2c6e3da"> ↵ </a></div> 2.589 - <div class="issue">This property is meant to generalize and replace <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-regions-1/#propdef-region-fragment">region-fragment</a>. 2.590 + <div class="issue"> This property is meant to generalize and replace <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-regions-1/#propdef-region-fragment">region-fragment</a>. 2.591 Once it is sufficiently stable in this specification, 2.592 <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-regions-1/#propdef-region-fragment">region-fragment</a> should be removed from the regions specification in favor of this.<a href="#issue-d52b3e3d"> ↵ </a></div> 2.593 - <div class="issue">When the element isn’t a <a data-link-type="dfn" href="http://dev.w3.org/csswg/css-break-3/#fragmentation-container">fragmentation container</a> already, 2.594 + <div class="issue"> When the element isn’t a <a data-link-type="dfn" href="http://dev.w3.org/csswg/css-break-3/#fragmentation-container">fragmentation container</a> already, 2.595 should this work by turning it directly into one, 2.596 or by creating a <a data-link-type="dfn" href="#fragment-box">fragment box</a> inside it like <a class="css" data-link-type="maybe" href="#valdef-continue-fragments">fragments</a> does?<a href="#issue-36be54be"> ↵ </a></div> 2.597 - <div class="issue">If we introduce a pseudo element that can select columns in a multicol, 2.598 + <div class="issue"> If we introduce a pseudo element that can select columns in a multicol, 2.599 we would need to specify that auto computes to auto on it, 2.600 or introduce a new value and have auto compute to that 2.601 (but what would that value compute to on things that aren’t columns?).<a href="#issue-53644667"> ↵ </a></div> 2.602 - <div class="issue">Write this section<a href="#issue-001d5014"> ↵ </a></div> 2.603 - <div class="issue">Pages should be possible to style with @page rules. How does that work for nested pages?<a href="#issue-338ad0f3"> ↵ </a></div> 2.604 + <div class="issue"> Write this section<a href="#issue-001d5014"> ↵ </a></div> 2.605 + <div class="issue"> Pages should be possible to style with @page rules. How does that work for nested pages?<a href="#issue-338ad0f3"> ↵ </a></div> 2.606 <div class="issue"> 2.607 Should traditional pagination (e.g. when printing) 2.608 be expressed through some magic in the computed value of <a class="css" data-link-type="maybe" href="#valdef-continue-auto">auto</a>, 2.609 or by inserting this in the UA stylesheet: 2.610 2.611 - <pre><code class="lang-css">@media (overflow-block: paged), (overflow-block: optional-paged) { 2.612 - :root { 2.613 - continue: paginate; 2.614 - } 2.615 -} 2.616 -</code></pre> 2.617 + <pre><code class="lang-css highlight"><span class="k">@media</span> <span class="o">(</span><span class="nt">overflow-block</span><span class="o">:</span> <span class="nt">paged</span><span class="o">),</span> <span class="o">(</span><span class="nt">overflow-block</span><span class="o">:</span> <span class="nt">optional-paged</span><span class="o">)</span> <span class="p">{</span> 2.618 + <span class="nd">:root</span> <span class="p">{</span> 2.619 + <span class="n">continue</span><span class="o">:</span> <span class="n">paginate</span><span class="p">;</span> 2.620 + <span class="p">}</span> 2.621 +<span class="p">}</span></code></pre> 2.622 2.623 <a href="#issue-67ad77e5"> ↵ </a> 2.624 </div> 2.625 - <div class="issue">Traditional pagination (e.g. when printing) assumes that 2.626 + <div class="issue"> Traditional pagination (e.g. when printing) assumes that 2.627 :root is contained in the page box, 2.628 rather than having the page box be a pseudo element child of :root. 2.629 Can we work around that using something similar to fragment boxes? 2.630 Or maybe by having a fragment box (reproducing :root) inside a page box inside :root?<a href="#issue-6eb3c644"> ↵ </a></div> 2.631 - <div class="issue">How does the page box model work when it is a child of a regular css box?<a href="#issue-64583cf9"> ↵ </a></div> 2.632 - <div class="issue">The initial proposal in <a data-link-type="biblio" href="#biblio-css3gcpm">[CSS3GCPM]</a> and implemantation from Opera 2.633 + <div class="issue"> How does the page box model work when it is a child of a regular css box?<a href="#issue-64583cf9"> ↵ </a></div> 2.634 + <div class="issue"> The initial proposal in <a data-link-type="biblio" href="#biblio-css3gcpm">[CSS3GCPM]</a> and implemantation from Opera 2.635 used 4 values instead of <a class="css" data-link-type="maybe" href="#valdef-continue-paginate">paginate</a>: 2.636 "paged-x | paged-y | paged-x-controls | paged-y-controls". 2.637 Should this property also include these values, 2.638 or are they better handled as separate properties? 2.639 (e.g.: "pagination-layout: auto | horizontal | vertical", "pagination-controls: auto | none")<a href="#issue-e9f64b3d"> ↵ </a></div> 2.640 - <div class="issue">Ability to display N pages at once 2.641 + <div class="issue"> Ability to display N pages at once 2.642 rather than just one page at once? 2.643 Could this be a value of "pagination-layout", such as: 2.644 "pagination-layout: horizontal 2;"<a href="#issue-55c97ed8"> ↵ </a></div> 2.645 - <div class="issue">Brad Kemper has proposed a model for combining pagination and 2.646 + <div class="issue"> Brad Kemper has proposed a model for combining pagination and 2.647 fragment overflow, which also deals with displaying multiple pages. 2.648 <a href="http://www.w3.org/mid/[email protected]">http://www.w3.org/mid/[email protected]</a><a href="#issue-64de292b"> ↵ </a></div> 2.649 <div class="issue"> 2.650 @@ -2514,11 +2446,11 @@ 2.651 the cascading module as well?<a href="#issue-8f881f96"> ↵ </a></div> 2.652 <div class="issue">Need to specify exactly how this works, 2.653 but it depends on 2.654 - having <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-display-3/#propdef-display-inside">display-inside</a> and <a class="property" data-link-type="propdesc" href="http://dev.w3.org/csswg/css-display-3/#propdef-display-outside">display-outside</a> specified.<a href="#issue-d98e732d"> ↵ </a></div> 2.655 + having <a class="property" data-link-type="propdesc">display-inside</a> and <a class="property" data-link-type="propdesc">display-outside</a> specified.<a href="#issue-d98e732d"> ↵ </a></div> 2.656 <div class="issue"> 2.657 This inheritance rule allows specifying styles indirectly 2.658 (by using explicit <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-cascade-4/#valdef-all-inherit">inherit</a> or using default inheritance 2.659 - on properties that don’t apply to <span class="css">::first-letter</span>) 2.660 + on properties that don’t apply to <a class="css" data-link-type="maybe" href="http://dev.w3.org/csswg/css-pseudo-4/#selectordef-first-letter">::first-letter</a>) 2.661 that can’t be specified directly 2.662 (based on the rules in the next section). 2.663 This is a problem. 2.664 @@ -2538,7 +2470,7 @@ 2.665 to pagination? 2.666 Given what we’re doing with the continue property, 2.667 it should actually apply to any fragmentainer.<a href="#issue-f6e7b6c3"> ↵ </a></div> 2.668 - <div class="issue">having max-lines do nothing on regular elements is not ideal. 2.669 + <div class="issue"> having max-lines do nothing on regular elements is not ideal. 2.670 When applied to non fragmentainers, 2.671 it should probably cause <a class="property" data-link-type="propdesc" href="#propdef-continue">continue</a> to compute to <a class="css" data-link-type="maybe" href="#valdef-continue-discard">discard</a> 2.672 so that you only need to reach for one property rather than 2 to get 2.673 @@ -2553,464 +2485,5 @@ 2.674 the content they produce for interactive media 2.675 is printed. 2.676 <a href="#issue-de91ba9b"> ↵ </a></div> 2.677 - </div> 2.678 - <script>self = (typeof window !== 'undefined') 2.679 - ? window // if in browser 2.680 - : ( 2.681 - (typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope) 2.682 - ? self // if in worker 2.683 - : {} // if in node js 2.684 - ); 2.685 - 2.686 -/** 2.687 - * Prism: Lightweight, robust, elegant syntax highlighting 2.688 - * MIT license http://www.opensource.org/licenses/mit-license.php/ 2.689 - * @author Lea Verou http://lea.verou.me 2.690 - */ 2.691 - 2.692 -var Prism = (function(){ 2.693 - 2.694 -// Private helper vars 2.695 -var lang = /\blang(?:uage)?-(?!\*)(\w+)\b/i; 2.696 - 2.697 -var _ = self.Prism = { 2.698 - util: { 2.699 - encode: function (tokens) { 2.700 - if (tokens instanceof Token) { 2.701 - return new Token(tokens.type, _.util.encode(tokens.content), tokens.alias); 2.702 - } else if (_.util.type(tokens) === 'Array') { 2.703 - return tokens.map(_.util.encode); 2.704 - } else { 2.705 - return tokens.replace(/&/g, '&').replace(/</g, '<').replace(/\u00a0/g, ' '); 2.706 - } 2.707 - }, 2.708 - 2.709 - type: function (o) { 2.710 - return Object.prototype.toString.call(o).match(/\[object (\w+)\]/)[1]; 2.711 - }, 2.712 - 2.713 - // Deep clone a language definition (e.g. to extend it) 2.714 - clone: function (o) { 2.715 - var type = _.util.type(o); 2.716 - 2.717 - switch (type) { 2.718 - case 'Object': 2.719 - var clone = {}; 2.720 - 2.721 - for (var key in o) { 2.722 - if (o.hasOwnProperty(key)) { 2.723 - clone[key] = _.util.clone(o[key]); 2.724 - } 2.725 - } 2.726 - 2.727 - return clone; 2.728 - 2.729 - case 'Array': 2.730 - return o.slice(); 2.731 - } 2.732 - 2.733 - return o; 2.734 - } 2.735 - }, 2.736 - 2.737 - languages: { 2.738 - extend: function (id, redef) { 2.739 - var lang = _.util.clone(_.languages[id]); 2.740 - 2.741 - for (var key in redef) { 2.742 - lang[key] = redef[key]; 2.743 - } 2.744 - 2.745 - return lang; 2.746 - }, 2.747 - 2.748 - // Insert a token before another token in a language literal 2.749 - insertBefore: function (inside, before, insert, root) { 2.750 - root = root || _.languages; 2.751 - var grammar = root[inside]; 2.752 - var ret = {}; 2.753 - 2.754 - for (var token in grammar) { 2.755 - 2.756 - if (grammar.hasOwnProperty(token)) { 2.757 - 2.758 - if (token == before) { 2.759 - 2.760 - for (var newToken in insert) { 2.761 - 2.762 - if (insert.hasOwnProperty(newToken)) { 2.763 - ret[newToken] = insert[newToken]; 2.764 - } 2.765 - } 2.766 - } 2.767 - 2.768 - ret[token] = grammar[token]; 2.769 - } 2.770 - } 2.771 - 2.772 - return root[inside] = ret; 2.773 - }, 2.774 - 2.775 - // Traverse a language definition with Depth First Search 2.776 - DFS: function(o, callback, type) { 2.777 - for (var i in o) { 2.778 - if (o.hasOwnProperty(i)) { 2.779 - callback.call(o, i, o[i], type || i); 2.780 - 2.781 - if (_.util.type(o[i]) === 'Object') { 2.782 - _.languages.DFS(o[i], callback); 2.783 - } else if (_.util.type(o[i]) === 'Array') { 2.784 - _.languages.DFS(o[i], callback, i); 2.785 - } 2.786 - } 2.787 - } 2.788 - } 2.789 - }, 2.790 - 2.791 - highlightAll: function(async, callback) { 2.792 - var elements = document.querySelectorAll('code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'); 2.793 - for (var i=0, element; element = elements[i++];) { 2.794 - if (element.classList.contains("idl")) { 2.795 - // Bikeshed handles IDL blocks already. 2.796 - continue; 2.797 - } 2.798 - _.highlightElement(element, async === true, callback); 2.799 - } 2.800 - 2.801 - var elements = document.querySelectorAll('pre[class*="language-"], [class*="language-"] pre, pre[class*="lang-"], [class*="lang-"] pre'); 2.802 - for (var i=0, element; element = elements[i++];) { 2.803 - if (element.firstElementChild && element.firstElementChild.tagName.toLowerCase() == "code") { 2.804 - // Already handled by the previous loop 2.805 - continue; 2.806 - } 2.807 - if (element.classList.contains("idl")) { 2.808 - // Bikeshed handles IDL blocks already. 2.809 - continue; 2.810 - } 2.811 - _.highlightElement(element, async === true, callback); 2.812 - } 2.813 - }, 2.814 - 2.815 - highlightElement: function(element, async, callback) { 2.816 - // Find language 2.817 - var language, grammar, parent = element; 2.818 - 2.819 - while (parent && !lang.test(parent.className)) { 2.820 - parent = parent.parentNode; 2.821 - } 2.822 - 2.823 - if (parent) { 2.824 - language = (parent.className.match(lang) || [,''])[1]; 2.825 - grammar = _.languages[language]; 2.826 - } 2.827 - 2.828 - if (!grammar) { 2.829 - return; 2.830 - } 2.831 - 2.832 - // Set language on the element, if not present 2.833 - element.className = element.className.replace(lang, '').replace(/\s+/g, ' ') + ' language-' + language; 2.834 - 2.835 - // Set language on the parent, for styling 2.836 - parent = element.parentNode; 2.837 - 2.838 - if (/pre/i.test(parent.nodeName)) { 2.839 - parent.className = parent.className.replace(lang, '').replace(/\s+/g, ' ') + ' language-' + language; 2.840 - } 2.841 - 2.842 - var code = element.textContent; 2.843 - 2.844 - if(!code) { 2.845 - return; 2.846 - } 2.847 - 2.848 - var env = { 2.849 - element: element, 2.850 - language: language, 2.851 - grammar: grammar, 2.852 - code: code 2.853 - }; 2.854 - 2.855 - _.hooks.run('before-highlight', env); 2.856 - 2.857 - if (async && self.Worker) { 2.858 - var worker = new Worker(_.filename); 2.859 - 2.860 - worker.onmessage = function(evt) { 2.861 - env.highlightedCode = Token.stringify(JSON.parse(evt.data), language); 2.862 - 2.863 - _.hooks.run('before-insert', env); 2.864 - 2.865 - env.element.innerHTML = env.highlightedCode; 2.866 - 2.867 - callback && callback.call(env.element); 2.868 - _.hooks.run('after-highlight', env); 2.869 - }; 2.870 - 2.871 - worker.postMessage(JSON.stringify({ 2.872 - language: env.language, 2.873 - code: env.code 2.874 - })); 2.875 - } 2.876 - else { 2.877 - env.highlightedCode = _.highlight(env.code, env.grammar, env.language) 2.878 - 2.879 - _.hooks.run('before-insert', env); 2.880 - 2.881 - env.element.innerHTML = env.highlightedCode; 2.882 - 2.883 - callback && callback.call(element); 2.884 - 2.885 - _.hooks.run('after-highlight', env); 2.886 - } 2.887 - }, 2.888 - 2.889 - highlight: function (text, grammar, language) { 2.890 - var tokens = _.tokenize(text, grammar); 2.891 - return Token.stringify(_.util.encode(tokens), language); 2.892 - }, 2.893 - 2.894 - tokenize: function(text, grammar, language) { 2.895 - var Token = _.Token; 2.896 - 2.897 - var strarr = [text]; 2.898 - 2.899 - var rest = grammar.rest; 2.900 - 2.901 - if (rest) { 2.902 - for (var token in rest) { 2.903 - grammar[token] = rest[token]; 2.904 - } 2.905 - 2.906 - delete grammar.rest; 2.907 - } 2.908 - 2.909 - tokenloop: for (var token in grammar) { 2.910 - if(!grammar.hasOwnProperty(token) || !grammar[token]) { 2.911 - continue; 2.912 - } 2.913 - 2.914 - var patterns = grammar[token]; 2.915 - patterns = (_.util.type(patterns) === "Array") ? patterns : [patterns]; 2.916 - 2.917 - for (var j = 0; j < patterns.length; ++j) { 2.918 - var pattern = patterns[j], 2.919 - inside = pattern.inside, 2.920 - lookbehind = !!pattern.lookbehind, 2.921 - lookbehindLength = 0, 2.922 - alias = pattern.alias; 2.923 - 2.924 - pattern = pattern.pattern || pattern; 2.925 - 2.926 - for (var i=0; i<strarr.length; i++) { // Don’t cache length as it changes during the loop 2.927 - 2.928 - var str = strarr[i]; 2.929 - 2.930 - if (strarr.length > text.length) { 2.931 - // Something went terribly wrong, ABORT, ABORT! 2.932 - break tokenloop; 2.933 - } 2.934 - 2.935 - if (str instanceof Token) { 2.936 - continue; 2.937 - } 2.938 - 2.939 - pattern.lastIndex = 0; 2.940 - 2.941 - var match = pattern.exec(str); 2.942 - 2.943 - if (match) { 2.944 - if(lookbehind) { 2.945 - lookbehindLength = match[1].length; 2.946 - } 2.947 - 2.948 - var from = match.index - 1 + lookbehindLength, 2.949 - match = match[0].slice(lookbehindLength), 2.950 - len = match.length, 2.951 - to = from + len, 2.952 - before = str.slice(0, from + 1), 2.953 - after = str.slice(to + 1); 2.954 - 2.955 - var args = [i, 1]; 2.956 - 2.957 - if (before) { 2.958 - args.push(before); 2.959 - } 2.960 - 2.961 - var wrapped = new Token(token, inside? _.tokenize(match, inside) : match, alias); 2.962 - 2.963 - args.push(wrapped); 2.964 - 2.965 - if (after) { 2.966 - args.push(after); 2.967 - } 2.968 - 2.969 - Array.prototype.splice.apply(strarr, args); 2.970 - } 2.971 - } 2.972 - } 2.973 - } 2.974 - 2.975 - return strarr; 2.976 - }, 2.977 - 2.978 - hooks: { 2.979 - all: {}, 2.980 - 2.981 - add: function (name, callback) { 2.982 - var hooks = _.hooks.all; 2.983 - 2.984 - hooks[name] = hooks[name] || []; 2.985 - 2.986 - hooks[name].push(callback); 2.987 - }, 2.988 - 2.989 - run: function (name, env) { 2.990 - var callbacks = _.hooks.all[name]; 2.991 - 2.992 - if (!callbacks || !callbacks.length) { 2.993 - return; 2.994 - } 2.995 - 2.996 - for (var i=0, callback; callback = callbacks[i++];) { 2.997 - callback(env); 2.998 - } 2.999 - } 2.1000 - } 2.1001 -}; 2.1002 - 2.1003 -var Token = _.Token = function(type, content, alias) { 2.1004 - this.type = type; 2.1005 - this.content = content; 2.1006 - this.alias = alias; 2.1007 -}; 2.1008 - 2.1009 -Token.stringify = function(o, language, parent) { 2.1010 - if (typeof o == 'string') { 2.1011 - return o; 2.1012 - } 2.1013 - 2.1014 - if (Object.prototype.toString.call(o) == '[object Array]') { 2.1015 - return o.map(function(element) { 2.1016 - return Token.stringify(element, language, o); 2.1017 - }).join(''); 2.1018 - } 2.1019 - 2.1020 - var env = { 2.1021 - type: o.type, 2.1022 - content: Token.stringify(o.content, language, parent), 2.1023 - tag: 'span', 2.1024 - classes: ['token', o.type], 2.1025 - attributes: {}, 2.1026 - language: language, 2.1027 - parent: parent 2.1028 - }; 2.1029 - 2.1030 - if (env.type == 'comment') { 2.1031 - env.attributes['spellcheck'] = 'true'; 2.1032 - } 2.1033 - 2.1034 - if (o.alias) { 2.1035 - var aliases = _.util.type(o.alias) === 'Array' ? o.alias : [o.alias]; 2.1036 - Array.prototype.push.apply(env.classes, aliases); 2.1037 - } 2.1038 - 2.1039 - _.hooks.run('wrap', env); 2.1040 - 2.1041 - var attributes = ''; 2.1042 - 2.1043 - for (var name in env.attributes) { 2.1044 - attributes += name + '="' + (env.attributes[name] || '') + '"'; 2.1045 - } 2.1046 - 2.1047 - return '<' + env.tag + ' class="' + env.classes.join(' ') + '" ' + attributes + '>' + env.content + '</' + env.tag + '>'; 2.1048 - 2.1049 -}; 2.1050 - 2.1051 -if (!self.document) { 2.1052 - if (!self.addEventListener) { 2.1053 - // in Node.js 2.1054 - return self.Prism; 2.1055 - } 2.1056 - // In worker 2.1057 - self.addEventListener('message', function(evt) { 2.1058 - var message = JSON.parse(evt.data), 2.1059 - lang = message.language, 2.1060 - code = message.code; 2.1061 - 2.1062 - self.postMessage(JSON.stringify(_.util.encode(_.tokenize(code, _.languages[lang])))); 2.1063 - self.close(); 2.1064 - }, false); 2.1065 - 2.1066 - return self.Prism; 2.1067 -} 2.1068 - 2.1069 -// Get current script and highlight 2.1070 -var script = document.getElementsByTagName('script'); 2.1071 - 2.1072 -script = script[script.length - 1]; 2.1073 - 2.1074 -if (script) { 2.1075 - _.filename = script.src; 2.1076 - 2.1077 - if (document.addEventListener && !script.hasAttribute('data-manual')) { 2.1078 - document.addEventListener('DOMContentLoaded', _.highlightAll); 2.1079 - } 2.1080 -} 2.1081 - 2.1082 -return self.Prism; 2.1083 - 2.1084 -})(); 2.1085 - 2.1086 -if (typeof module !== 'undefined' && module.exports) { 2.1087 - module.exports = Prism; 2.1088 -} 2.1089 -; 2.1090 -Prism.languages.css = { 2.1091 - 'comment': /\/\*[\w\W]*?\*\//g, 2.1092 - 'atrule': { 2.1093 - pattern: /@[\w-]+?.*?(;|(?=\s*{))/gi, 2.1094 - inside: { 2.1095 - 'punctuation': /[;:]/g 2.1096 - } 2.1097 - }, 2.1098 - 'url': /url\((["']?).*?\1\)/gi, 2.1099 - 'selector': /[^\{\}\s][^\{\};]*(?=\s*\{)/g, 2.1100 - 'property': /(\b|\B)[\w-]+(?=\s*:)/ig, 2.1101 - 'string': /("|')(\\?.)*?\1/g, 2.1102 - 'important': /\B!important\b/gi, 2.1103 - 'punctuation': /[\{\};:]/g, 2.1104 - 'function': /[-a-z0-9]+(?=\()/ig 2.1105 -}; 2.1106 - 2.1107 -if (Prism.languages.markup) { 2.1108 - Prism.languages.insertBefore('markup', 'tag', { 2.1109 - 'style': { 2.1110 - pattern: /<style[\w\W]*?>[\w\W]*?<\/style>/ig, 2.1111 - inside: { 2.1112 - 'tag': { 2.1113 - pattern: /<style[\w\W]*?>|<\/style>/ig, 2.1114 - inside: Prism.languages.markup.tag.inside 2.1115 - }, 2.1116 - rest: Prism.languages.css 2.1117 - } 2.1118 - } 2.1119 - }); 2.1120 -}; 2.1121 -Prism.languages.css.selector = { 2.1122 - pattern: /[^\{\}\s][^\{\}]*(?=\s*\{)/g, 2.1123 - inside: { 2.1124 - 'pseudo-element': /:(?:after|before|first-letter|first-line|selection)|::[-\w]+/g, 2.1125 - 'pseudo-class': /:[-\w]+(?:\(.*\))?/g, 2.1126 - 'class': /\.[-:\.\w]+/g, 2.1127 - 'id': /#[-:\.\w]+/g 2.1128 - } 2.1129 -}; 2.1130 - 2.1131 -Prism.languages.insertBefore('css', 'ignore', { 2.1132 - 'hexcode': /#[\da-f]{3,6}/gi, 2.1133 - 'entity': /\\[\da-f]{1,8}/gi, 2.1134 - 'number': /[\d%\.]+/g 2.1135 -});; 2.1136 -</script></body> 2.1137 + </div></body> 2.1138 </html> 2.1139 \ No newline at end of file
