Skip to content

Commit 02e9b72

Browse files
tabatkinstabatkins
committed
Formatting fixup.
1 parent 9540aec commit 02e9b72

2 files changed

Lines changed: 387 additions & 398 deletions

File tree

‎css3-hierarchies/Overview.html‎

Lines changed: 88 additions & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -10,23 +10,23 @@
1010
type="text/css">
1111

1212
<style type="text/css">
13-
/* delete this block when you've cleared out all the .replaceme elements */
14-
.replaceme {
15-
border: solid red;
16-
padding: 0 0.5em;
17-
margin: 0 0.1em;
18-
background: yellow;
19-
color: green;
20-
}
21-
.replaceme:before {
22-
content: "FIXME(";
23-
color: black;
24-
}
25-
.replaceme:after {
26-
content: ")";
27-
color: black;
28-
}
29-
</style>
13+
/* delete this block when you've cleared out all the .replaceme elements */
14+
.replaceme {
15+
border: solid red;
16+
padding: 0 0.5em;
17+
margin: 0 0.1em;
18+
background: yellow;
19+
color: green;
20+
}
21+
.replaceme:before {
22+
content: "FIXME(";
23+
color: black;
24+
}
25+
.replaceme:after {
26+
content: ")";
27+
color: black;
28+
}
29+
</style>
3030

3131
<body>
3232
<div class=head> <!--begin-logo-->
@@ -35,26 +35,26 @@
3535

3636
<h1>CSS Hierarchies Module Level 3</h1>
3737

38-
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 18 October
38+
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 19 October
3939
2011</h2>
4040

4141
<dl>
4242
<dt>This version:
4343

4444
<dd><a
45-
href="http://dev.w3.org/csswg/css-module/http://www.w3.org/TR/2011/ED-css3-Hierarchies-20111018/">http://www.w3.org/TR/2011/ED-css3-Hierarchies-20111018/</a>
45+
href="http://dev.w3.org/csswg/css-module/http://www.w3.org/TR/2011/ED-css3-Hierarchies-20111019/">http://www.w3.org/TR/2011/ED-css3-Hierarchies-20111019/</a>
4646

4747

4848
<dt>Latest version:
4949

5050
<dd><a
51-
href="http://www.w3.org/TR/css3-Hierarchies/">http://www.w3.org/TR/css3-Hierarchies/</a>
51+
href="http://www.w3.org/TR/css3-hierarchies/">http://www.w3.org/TR/css3-hierarchies/</a>
5252

5353

5454
<dt>Editor's draft:
5555

5656
<dd><a
57-
href="http://dev.w3.org/csswg/css3-Hierarchies/">http://dev.w3.org/csswg/css3-Hierarchies/</a>
57+
href="http://dev.w3.org/csswg/css3-hierarchies/">http://dev.w3.org/csswg/css3-hierarchies/</a>
5858

5959

6060
<dt>Previous version:
@@ -157,7 +157,7 @@ <h2 class="no-num no-toc" id=contents>Table of contents</h2>
157157
<li><a href="#motivation"><span class=secno>1.3. </span> Motivation</a>
158158
</ul>
159159

160-
<li><a href="#selector-and"><span class=secno>2. </span> the &amp;
160+
<li><a href="#selector-and"><span class=secno>2. </span> The &amp;
161161
Selector</a>
162162

163163
<li><a href="#Grammar"><span class=secno>3. </span> Grammar
@@ -254,7 +254,8 @@ <h3 id=motivation><span class=secno>1.3. </span> Motivation</h3>
254254
is a portion of the CSS markup for one version of the <a href="#CSS3COLOR"
255255
rel=biblioentry>[CSS3COLOR]<!--{{CSS3COLOR}}--></a> module:
256256

257-
<pre class=example>
257+
<div class=example>
258+
<pre>
258259
table.colortable td {text-align:center }
259260
table.colortable td.c { text-transform:uppercase }
260261
table.colortable td:first-child, table.colortable td:first-child+td { border:1px solid black }
@@ -265,38 +266,39 @@ <h3 id=motivation><span class=secno>1.3. </span> Motivation</h3>
265266
table.tprofile td { width:71%;padding:2px }
266267

267268
table.hslexample { background: #808080; padding:1em; margin:0; float:left; }
268-
table.hslexample td,table.hslexample th { font-size:smaller;width:3em }
269-
</pre>
269+
table.hslexample td,table.hslexample th { font-size:smaller;width:3em }</pre>
270+
</div>
270271

271272
<p>Hierarchies allow the grouping of related style rules, like this:
272273

273-
<pre class=example>
274+
<div class=example>
275+
<pre>
274276
table {
275-
&.colortable {
276-
& td {text-align:center }
277-
&.c { text-transform:uppercase }
278-
& td:first-child, & td:first-child+td { border:1px solid black }
279-
& th {text-align:center; background:black; color:white }
280-
281-
&.tprofile {
282-
& th {
283-
width:29%;padding:2px;
284-
&.title {background:gray; color:white}
285-
}
286-
& td { width:71%;padding:2px }
287-
}
288-
289-
&.hslexample {
290-
background: #808080; padding:1em; margin:0; float:left;
291-
& td, & th { font-size:smaller;width:3em }
292-
}
293-
}
294-
</pre>
277+
&.colortable {
278+
& td {text-align:center }
279+
&.c { text-transform:uppercase }
280+
& td:first-child, & td:first-child+td { border:1px solid black }
281+
& th {text-align:center; background:black; color:white }
282+
283+
&.tprofile {
284+
& th {
285+
width:29%;padding:2px;
286+
&.title {background:gray; color:white}
287+
}
288+
& td { width:71%;padding:2px }
289+
}
290+
291+
&.hslexample {
292+
background: #808080; padding:1em; margin:0; float:left;
293+
& td, & th { font-size:smaller;width:3em }
294+
}
295+
}</pre>
296+
</div>
295297

296298
<p>Besides removing duplication, the grouping of related rules improves
297299
readability and maintainability of the resulting CSS.
298300

299-
<h2 id=selector-and><span class=secno>2. </span> the &amp; Selector</h2>
301+
<h2 id=selector-and><span class=secno>2. </span> The &amp; Selector</h2>
300302

301303
<p>This specification provides a mechanism that allows for the nesting of
302304
style rules within other style rules. A nested style rule can used
@@ -309,63 +311,66 @@ <h2 id=selector-and><span class=secno>2. </span> the &amp; Selector</h2>
309311
nesting selector. The nesting selector represents the elements matches by
310312
the parent rule set's selector list.
311313

312-
<p>The following two examples produce an equivalent result on all pages:
314+
<div class=example>
315+
<p>The following two examples produce an equivalent result on all pages:
313316

314-
<pre class=example>
317+
<pre>
315318
div {
316-
& .keyword {color: red;}
317-
&:hover {background-color: rgb(200, 255, 255);}
318-
}
319-
</pre>
319+
& .keyword {color: red;}
320+
&:hover {background-color: rgb(200, 255, 255);}
321+
}</pre>
320322

321-
<pre class=example>
323+
<pre>
322324
div .keyword {color:red;}
323325

324-
div:hover {background-color: rgb(200, 255, 255);}
325-
</pre>
326+
div:hover {background-color: rgb(200, 255, 255);}</pre>
327+
</div>
326328

327-
<p>The following two examples provide an equivalent result on all pages:
329+
<div class=example>
330+
<p>The following two examples provide an equivalent result on all pages:
328331

329-
<pre class=example>
332+
<pre>
330333
div, p {
331-
& .keyword, & .constant {color: red;}
332-
}
333-
</pre>
334+
& .keyword, & .constant {color: red;}
335+
}</pre>
334336

335-
<pre class=example>
337+
<pre>
336338
div .keyword {color:red;}
337339
div .constant {color:red;}
338340
p .keyword {color:red;}
339-
p .constant {color:red;}
340-
</pre>
341+
p .constant {color:red;}</pre>
342+
</div>
341343

342344
<p>Multiple style rules can be embedded within a style rule. Style rules
343345
can be embedded arbitrarily deeply. Embedded style rules and properties
344346
can co-exist.
345347

346-
<p>The following two examples are equivalent:
348+
<div class=example>
349+
<p>The following two examples are equivalent:</p>
347350

348-
<pre class=example>
351+
<pre>
349352
div, p {
350-
& .keyword {color: green;}
351-
font-size: 10px;
352-
& .constant {
353-
color: red;
354-
&:hover:after { content: " [" attr(value) "]";}
355-
background-color: green;
356-
}
357-
}
358-
</pre>
359-
360-
<pre class=example>
353+
& .keyword {color: green;}
354+
font-size: 10px;
355+
& .constant {
356+
color: red;
357+
&:hover:after { content: " [" attr(value) "]";}
358+
background-color: green;
359+
}
360+
}</pre>
361+
362+
<pre>
361363
div, p {font-size: 10px;}
362364
div .keyword, p .keyword {color: green;}
363365
div .constant, p .constant {color: red; background-color: green;}
364-
div .constant:hover:after, p .constant:hover:after {content: " [" attr(value) "]";}
365-
</pre>
366+
div .constant:hover:after, p .constant:hover:after {content: " [" attr(value) "]";}</pre>
367+
</div>
366368

367369
<h2 id=Grammar><span class=secno>3. </span> Grammar modifications</h2>
368370

371+
<p>This specification makes a minor alteration to CSS's Core Grammar, and
372+
also makes an addition to the grammar of Selectors.
373+
369374
<h3 id=css-2-grammar><span class=secno>3.1. </span> Core CSS Grammar</h3>
370375

371376
<p>The following modifications are required to the <a href="#CSS21"
@@ -381,8 +386,7 @@ <h3 id=css-2-grammar><span class=secno>3.1. </span> Core CSS Grammar</h3>
381386
<pre>
382387
ruleset-body : '{' S* ruleitem? [ ';' S* ruleitem? ]* '}' S*
383388
ruleitem : declaration | nested-ruleset
384-
nested-ruleset : nested-selectors-group ruleset-body
385-
</pre>
389+
nested-ruleset : nested-selectors-group ruleset-body</pre>
386390

387391
<h3 id=css-4-selectors-grammar><span class=secno>3.2. </span> CSS4
388392
Selectors Grammar</h3>
@@ -395,8 +399,7 @@ <h3 id=css-4-selectors-grammar><span class=secno>3.2. </span> CSS4
395399
<pre>
396400
nested-selectors-group : nested-selector [ COMMA S* nested-selector ]
397401
nested-selector : nested-compound-selector [ combinator compound-selector ]*
398-
nested-compound-selector : NEST [ HASH | class | attrib | pseudo | negation ]*
399-
</pre>
402+
nested-compound-selector : NEST [ HASH | class | attrib | pseudo | negation ]*</pre>
400403

401404
<h3 id=css-4-selectors-lexical-scanner><span class=secno>3.3. </span> CSS4
402405
Selectors Lexical Scanner</h3>
@@ -406,15 +409,11 @@ <h3 id=css-4-selectors-lexical-scanner><span class=secno>3.3. </span> CSS4
406409

407410
<p>Immediately below:
408411

409-
<pre>
410-
"-->" return CDC;
411-
</pre>
412+
<pre>"-->" return CDC;</pre>
412413

413414
<p>the following rule is inserted:
414415

415-
<pre>
416-
"&" return NEST;
417-
</pre>
416+
<pre>"&" return NEST;</pre>
418417

419418
<h2 id=conformance><span class=secno>4. </span> Conformance</h2>
420419

0 commit comments

Comments
 (0)