You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1991 lines
95 KiB
1991 lines
95 KiB
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
|
|
"http://www.w3.org/TR/REC-html40/loose.dtd">
|
|
<html>
|
|
<head>
|
|
<title>List of suggested extensions to CSS</title>
|
|
<link rel="stylesheet" type="text/css" media="screen" href="/StyleSheets/TR/W3C-NOTE">
|
|
<style type="text/css">
|
|
.feedback {border: thin solid black; padding: 1ex; margin: 1em;
|
|
background: #808080; color: white}
|
|
.subtitle {text-align: center}
|
|
|
|
</style>
|
|
</head>
|
|
<body lang="en">
|
|
|
|
<div class="head">
|
|
|
|
<div align="right">
|
|
<p>
|
|
<a href="http://www.w3.org/"><img border="0" align="left" alt="W3C" height="48" width="72" src="/Icons/w3c_home"></a>
|
|
<strong>NOTE-CSS-potential-19981210</strong></p>
|
|
</div>
|
|
|
|
<div align="center">
|
|
<p class="hide">
|
|
<br clear="left">
|
|
</p>
|
|
|
|
<h1 class="no-num no-toc" id="id00769914857"><a class="toc" name="id00769914857"></a>List of suggested extensions to CSS</h1>
|
|
<h3 class="no-num no-toc" id="id00799190426"><a class="toc" name="id00799190426"></a>W3C Note 10 December 1998</h3>
|
|
<p class="hide">
|
|
<br clear="left">
|
|
</p>
|
|
</div>
|
|
|
|
<table>
|
|
<tbody>
|
|
<tr valign="baseline">
|
|
<td>
|
|
This version:
|
|
</td>
|
|
<td>
|
|
<a href="http://www.w3.org/TR/1998/NOTE-CSS-potential-19981210">http://www.w3.org/TR/1998/NOTE-CSS-potential-19981210</a>
|
|
</td>
|
|
</tr>
|
|
<tr valign="baseline">
|
|
<td>
|
|
Latest version:
|
|
</td>
|
|
<td>
|
|
<a href="http://www.w3.org/TR/NOTE-CSS-potential">http://www.w3.org/TR/NOTE-CSS-potential</a>
|
|
</td>
|
|
</tr>
|
|
<tr valign="baseline">
|
|
<td>
|
|
Previous version:
|
|
</td>
|
|
<td>
|
|
<a href="http://www.w3.org/TR/NOTE-CSS-potential-19970819.html">http://www.w3.org/TR/NOTE-CSS-potential-19970819</a>
|
|
</td>
|
|
</tr>
|
|
<tr valign="baseline">
|
|
<td>
|
|
Editor:
|
|
</td>
|
|
<td>
|
|
<a href="http://www.w3.org/People/Bos">Bert Bos</a> (<a href="mailto:bert@w3.org">bert@w3.org</a>)
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<p>
|
|
<small><a href="/Consortium/Legal/ipr-notice#Copyright">Copyright</a> © 1998
|
|
<a href="http://www.w3.org/">W3C</a> (<a href="http://www.lcs.mit.edu/">MIT</a>, <a href="http://www.inria.fr/">INRIA</a>, <a href="http://www.keio.ac.jp/">Keio</a>), All Rights Reserved. W3C <a href="/Consortium/Legal/ipr-notice#Legal Disclaimer"> liability,</a> <a href="/Consortium/Legal/ipr-notice#W3C Trademarks"> trademark</a>, <a href="/Consortium/Legal/copyright-documents"> document use</a> and <a href="/Consortium/Legal/copyright-software"> software licensing</a> rules
|
|
apply. Your interactions with this site are in accordance with our <a href="/Consortium/Legal/privacy-statement#Public">public</a> and <a href="/Consortium/Legal/privacy-statement#Members"> Member</a> privacy
|
|
statements.</small></p>
|
|
</div>
|
|
<hr>
|
|
|
|
|
|
<h3 class="no-num no-toc" id="id01768265887"><a class="toc" name="id01768265887"></a>Status of this document</h3>
|
|
<p>
|
|
This document is a <a href="../../Consortium/Process/NOTE.html">NOTE</a> issued by the Cascading
|
|
Style Sheets and Formatting Properties Working Group (CSS & FP WG). It is
|
|
provided for information only, and does not represent a W3C-endorsed
|
|
specification. Features described here may or may not become part of a W3C
|
|
Recommendation or other specification, and they may change considerably in the
|
|
process. The features should therefore not be implemented, except as
|
|
experiments, clearly labeled as experimental. Such experiments are welcomed,
|
|
and may provide valuable information about the development (or not) of these
|
|
features, but the fact that a feature has been implemented (or implemented in
|
|
a certain way), will by itself not be an argument to adopt the feature in CSS
|
|
(or adopt it in this particular form).</p>
|
|
<p>
|
|
A list of current W3C Recommendations and other technical documents can be
|
|
found at <a href="http://www.w3.org/TR/"> http://www.w3.org/TR/</a>.</p>
|
|
<hr>
|
|
|
|
|
|
<h2 class="no-num no-toc" id="id01367557030"><a class="toc" name="id01367557030"></a>Abstract</h2>
|
|
<p>
|
|
This Note attempts to document all the features that have been suggested for
|
|
CSS, and that are not part of CSS2. The fact that a feature has been listed
|
|
here does not mean it will be in some future version of CSS; some of the
|
|
suggestions do not fit in CSS or are better handled elsewhere (e.g., in <a href="../../MarkUp/">HTML</a>, SMIL, or RDF). The purpose of the list is to
|
|
make sure suggestions are neither forgotten nor suggested over and over
|
|
again.</p>
|
|
<p>
|
|
Many suggestions are just listed without further comment. If the CSS working
|
|
group has discussed a feature, some remarks may be added.</p>
|
|
<p>
|
|
Comments on this draft are welcome and should be sent to the <a href="mailto:www-style@w3.org">www-style@w3.org</a> mailing list (recommended)
|
|
or the CSS & FP WG (only for W3C members), or to the editors if neither of
|
|
the above is suitable.</p>
|
|
<p>
|
|
<em>Please, give feedback before the 5th of February 1999.</em></p>
|
|
<hr>
|
|
|
|
|
|
<h2 class="no-num no-toc" id="id01013965415"><a class="toc" name="id01013965415"></a>Table of contents</h2>
|
|
|
|
<div class="toc">
|
|
<!--begin-toc-->
|
|
<ul class="toc">
|
|
<li><a href="#id0418987337">Acknowledgements</a>
|
|
<li><a href="#id1816482811">Feedback</a>
|
|
<li><a href="#id2084367450"><span class="secno">1. </span>Columns</a>
|
|
<li><a href="#id02172868121"><span class="secno">2. </span>Swash letters and other glyph substitutions</a>
|
|
<li><a href="#id17086087411"><span class="secno">3. </span>Running headers and footers</a>
|
|
<li><a href="#id10710829041"><span class="secno">4. </span>Cross-references</a>
|
|
<li><a href="#id01013225791"><span class="secno">5. </span>Vertical text</a>
|
|
<li><a href="#id18107060481"><span class="secno">6. </span>Ruby</a>
|
|
<li><a href="#id03474144861"><span class="secno">7. </span>Diagonal text & text along a path</a>
|
|
<li><a href="#id04746437781"><span class="secno">8. </span>Style properties for embedded 2D graphics</a>
|
|
<li><a href="#id20933357941"><span class="secno">9. </span>Hyphenation control</a>
|
|
<li><a href="#id16017042441"><span class="secno">10. </span>Image filters</a>
|
|
<li><a href="#id09571241611"><span class="secno">11. </span>Rendering objects for forms</a>
|
|
<li><a href="#id17975790061"><span class="secno">12. </span>A pseudo-element for the URL #fragment-id</a>
|
|
<li><a href="#id06303182571"><span class="secno">13. </span>Floating boxes to top & bottom of a page</a>
|
|
<li><a href="#Footnotes1"><span class="secno">14. </span>Footnotes</a>
|
|
<li><a href="#id15822193411"><span class="secno">15. </span>"Tooltips"/"balloonhelp"</a>
|
|
<li><a href="#id17730911491"><span class="secno">16. </span>Math</a>
|
|
<li><a href="#id19703025351"><span class="secno">17. </span>Folding lists</a>
|
|
<li><a href="#id1565770800"><span class="secno">18. </span>Page-transition effects</a>
|
|
<li><a href="#id1277888888"><span class="secno">19. </span>Timed styles</a>
|
|
<li><a href="#id06251190921"><span class="secno">20. </span>Leaders</a>
|
|
<li><a href="#id1554439764"><span class="secno">21. </span>Smart tabs</a>
|
|
<li><a href="#id21072524491"><span class="secno">22. </span>Spreadsheet functions</a>
|
|
<li><a href="#id19598620931"><span class="secno">23. </span>Non-rectangular wrap-around</a>
|
|
<li><a href="#id04229052841"><span class="secno">24. </span>Gradient & stretched backgrounds</a>
|
|
<li><a href="#id042290528411"><span class="secno">25. </span>Textures/images instead of foreground colors</a>
|
|
<li><a href="#id06312789671"><span class="secno">26. </span>Transparency</a>
|
|
<li><a href="#id00256283761"><span class="secno">27. </span>Constant expressions</a>
|
|
<li><a href="#id05684046681"><span class="secno">28. </span>Symbolic constants</a>
|
|
<li><a href="#id01890417881"><span class="secno">29. </span>Mixed mode rendering</a>
|
|
<li><a href="#id07007348961"><span class="secno">30. </span>Grid-device properties</a>
|
|
<li><a href="#id01015114197"><span class="secno">31. </span>Co-dependencies between rules</a>
|
|
<li><a href="#id007975494911"><span class="secno">32. </span>High-level constraints</a>
|
|
<li><a href="#id13521541791"><span class="secno">33. </span>Float: gutter-side/fore-edge-side</a>
|
|
<li><a href="#id06376186981"><span class="secno">34. </span>Icons & minimization</a>
|
|
<li><a href="#id02970417611"><span class="secno">35. </span>Namespaces</a>
|
|
<li><a href="#id11152936971"><span class="secno">36. </span>Braille</a>
|
|
<li><a href="#id01539331051"><span class="secno">37. </span>Numbered floats</a>
|
|
<li><a href="#id20323747591"><span class="secno">38. </span>"Visual" top/bottom margins</a>
|
|
<li><a href="#id09031285251"><span class="secno">39. </span>ToC's, tables of figures, etc.</a>
|
|
<li><a href="#id1876310632"><span class="secno">40. </span>Indexes</a>
|
|
<li><a href="#id21238494811"><span class="secno">41. </span>pseudo-element</a>
|
|
<li><a href="#id17693349951"><span class="secno">42. </span>'First-word' pseudo-element</a>
|
|
<li><a href="#id20650112531"><span class="secno">43. </span>Corner pieces for borders</a>
|
|
<li><a href="#id16717669191"><span class="secno">44. </span>Local and external anchors</a>
|
|
<li><a href="#id08392822801"><span class="secno">45. </span>Access to attribute values</a>
|
|
<li><a href="#id19831851421"><span class="secno">46. </span>Linked flows</a>
|
|
<li><a href="#id20832642671"><span class="secno">47. </span>Pseudo-classes for user states</a>
|
|
<li><a href="#id14867418791"><span class="secno">48. </span>List numbering generalized and internationalized</a>
|
|
<li><a href="#id10065288501"><span class="secno">49. </span>"Subtractive" text-decoration</a>
|
|
<li><a href="#id04719733531"><span class="secno">50. </span>Style for HTML's MAP & AREA elements</a>
|
|
<li><a href="#id14474829771"><span class="secno">51. </span>Transliteration</a>
|
|
<li><a href="#id10587809881"><span class="secno">52. </span>Regular expressions in selectors</a>
|
|
<li><a href="#id10072048161"><span class="secno">53. </span>Last-of... selectors</a>
|
|
<li><a href="#id20550108161"><span class="secno">54. </span>Control over progressive rendering</a>
|
|
<li><a href="#id10012342721"><span class="secno">55. </span>Inline-block</a>
|
|
<li><a href="#id00219150021"><span class="secno">56. </span>Non-breaking inline elements</a>
|
|
<li><a href="#id17654456211"><span class="secno">57. </span>Suppress word spacing</a>
|
|
<li><a href="#id15776574841"><span class="secno">58. </span>HSV or HSL color notation</a>
|
|
<li><a href="#id1533219177"><span class="secno">59. </span>140-odd color names</a>
|
|
<li><a href="#id00881745101"><span class="secno">60. </span>Copyfitting/auto-sizing/auto-spacing</a>
|
|
<li><a href="#id0678519722"><span class="secno">61. </span>@page inside @media</a>
|
|
<li><a href="#id1253850492"><span class="secno">62. </span>Color profiles</a>
|
|
<li><a href="#id1244372485"><span class="secno">63. </span>Underline styles</a>
|
|
<li><a href="#id0784490728"><span class="secno">64. </span>Actions/behaviors mixed in with styles</a>
|
|
<li><a href="#id00230344912"><span class="secno">65. </span>Comment syntax "//"</a>
|
|
<li><a href="#id01638445101"><span class="secno">66. </span>Replaced elements without an intrinsic size</a>
|
|
<li><a href="#id00831989193"><span class="secno">67. </span>Fitting replaced elements into a given space</a>
|
|
<li><a href="#id00897200312">End of form</a>
|
|
</ul>
|
|
<!--end-toc-->
|
|
</div>
|
|
|
|
<h2 id="id0418987337" class="no-num"><a class="toc" name="id0418987337"></a>Acknowledgements</h2>
|
|
<p>
|
|
Ian Hickson <exxieh@bath.ac.uk> for suggesting this document, and
|
|
maintaining <a href="http://www.bath.ac.uk/%7Epy8ieh/internet/wwwstyle.html">one</a>
|
|
independently.</p>
|
|
|
|
<div class="feedback">
|
|
|
|
<h2 id="id1816482811" class="no-num"><a class="toc" name="id1816482811"></a>Feedback</h2>
|
|
<p>
|
|
Please, give your evaluation of each of the listed items, by filling in the
|
|
form. You don't have to fill in the whole form at once. You can submit
|
|
multiple times, and new evaluations will be added to any old ones, or override
|
|
them, if you rate the same item twice. However, that is the <em>only</em> use
|
|
we make of the sender's e-mail address. When we publish the results, the
|
|
e-mail addresses will not be published.</p>
|
|
<p>
|
|
Please indicate your support for the <em>feature</em>, not for the suggested
|
|
solutions. For example, if you want columns very much, but don't like the
|
|
particular properties proposed, choose option 5: "strongly in favor." (And
|
|
then send what you think of the solution to <a href="mailto:www-style@w3.org">www-style</a>.)</p>
|
|
<p>
|
|
Each item can be rated on a scale from 1 to 5:</p>
|
|
<ol>
|
|
<li><p>
|
|
Strongly opposed</p>
|
|
</li>
|
|
<li><p>
|
|
Mildly opposed</p>
|
|
</li>
|
|
<li><p>
|
|
Neutral</p>
|
|
</li>
|
|
<li><p>
|
|
Mildly in favor</p>
|
|
</li>
|
|
<li><p>
|
|
Strongly in favor</p>
|
|
</li>
|
|
</ol>
|
|
<p>
|
|
If you already sent in a form, then the "I skipped this question" button means
|
|
that whatever you said last time, will remain in the database unchanged.</p>
|
|
<p>
|
|
The form will be active until 5 February 1999.</p>
|
|
<p>
|
|
To discuss this note, please <a href="/Mail/Lists.html">subscribe</a> to the
|
|
www-style@w3.org mailing list.</p>
|
|
</div>
|
|
<form method="post" action="mailto:www-css-potential-19981210-vote@w3.org">
|
|
|
|
<h2 id="id2084367450"><a class="toc" name="id2084367450"></a><span class="secno">1. </span>Columns</h2>
|
|
<p>
|
|
Especially for printing, but also possibly on wide screens, text is often
|
|
displayed in columns (also known as newspaper columns, or snaking
|
|
columns).</p>
|
|
<p>
|
|
Desirable features are:</p>
|
|
<ul>
|
|
<li><p>
|
|
a way to specify the (approximate or min/max) width of a column, and let the
|
|
actual number of columns depend on the width of the containing block.</p>
|
|
</li>
|
|
<li><p>
|
|
a way to make floating boxes float to the edge of a particular column, or even
|
|
span columns.</p>
|
|
</li>
|
|
<li><p>
|
|
specify whether columns are balanced, or have a particular height (the page
|
|
height, e.g.)</p>
|
|
</li>
|
|
<li><p>
|
|
make columns as high as the viewport, necessitating horizontal scrolling only
|
|
(useful, e.g., for spreadsheet-like displays)</p>
|
|
</li>
|
|
<li><p>
|
|
specify rules and gaps between columns</p>
|
|
</li>
|
|
</ul>
|
|
<p>
|
|
One concrete proposal is as follows:</p>
|
|
<p>
|
|
Three properties ('column-number', 'column-width', 'column-gap') and one
|
|
shorthand property ('columns') set either the number of columns, the width(s)
|
|
of the columns, or both. They are not inherited. For example:</p>
|
|
<pre>DIV.main {
|
|
column-number: 2;
|
|
column-width: auto;
|
|
column-gap: 1em
|
|
}</pre>
|
|
<p>
|
|
formats the DIV as two balanced columns, each of nearly half the width of the
|
|
element.</p>
|
|
<p>
|
|
Properties 'column-rule-style', 'column-rule-width', 'column-rule-color' and
|
|
the shorthand 'column-rule' determine the style of the vertical rules between
|
|
the columns. These properties are inherited.</p>
|
|
<p>
|
|
For a similar idea, see e-mail by <a href="http://lists.w3.org/Archives/Public/www-style/1998Jun/0048.html">e-mail
|
|
by David Baron.</a></p>
|
|
<p>
|
|
For more details see <a href="../../Style/Group/1998/07/multicol-cw.html">Chris Wilson' proposal</a>
|
|
[<a href="http://cgi.w3.org/MemberAccess/">member-only link</a>].</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br>
|
|
<input type="radio" name="columns" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="columns" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="columns" value="3" />3: Neutral<br />
|
|
<input type="radio" name="columns" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="columns" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="columns" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id02172868121"><a class="toc" name="id02172868121"></a><span class="secno">2. </span>Swash letters and other glyph substitutions</h2>
|
|
<p>
|
|
CSS2 can specify fonts, but if a font contains multiple glyphs for the same
|
|
character, there is no way to get them (other than by creating a new font with
|
|
the alternate glyph and the default swapped...) Maybe CSS should have a way of
|
|
indicating which glyph to use for each character in the source. Problem is, of
|
|
course, that there are no standard names for glyphs. The index number of a
|
|
glyph inside a font file is unreliable as well.</p>
|
|
<p>
|
|
Somewhat related: control over ligatures. In Latin scripts, the rule is simple
|
|
enough to leave to the UA: always use all that the font provide. Occasionally
|
|
a writer may have to insert a zero-width-space between two letters where
|
|
tradition forbids a ligature, but otherwise the use of ligatures is seldomly a
|
|
style question. In Arabic, things are different. Varying the amount and
|
|
complexity of the ligatures is a common device to distinguish different types
|
|
of documents.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="glyph-subst" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="glyph-subst" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="glyph-subst" value="3" />3: Neutral<br />
|
|
<input type="radio" name="glyph-subst" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="glyph-subst" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="glyph-subst" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id17086087411"><a class="toc" name="id17086087411"></a><span class="secno">3. </span>Running headers and footers</h2>
|
|
<p>
|
|
At the top and bottom (but maybe not only there) of a document that is split
|
|
over several pages, you often find things like page numbers, author, title,
|
|
date, current section, keywords, etc.</p>
|
|
<p>
|
|
Robert Stevahn is collecting <a href="http://lists.w3.org/Archives/Member/w3c-css-wg/1998JulSep/0087.html">requirements</a>.
|
|
[<a href="http://cgi.w3.org/MemberAccess/">member-only link</a>]</p>
|
|
<ol>
|
|
<li>
|
|
We must support an arbitrary number of 'objects' in the header/footer areas.
|
|
</li>
|
|
<li>
|
|
We must be able to align these objects arbitrarily with respect to the
|
|
boundaries of the header/footer areas.
|
|
</li>
|
|
<li>
|
|
We must be able to support running headers/footers. For example, we must be
|
|
able to include the current page and chapter number in the header/footer
|
|
without knowing this information a priori.
|
|
</li>
|
|
<li>
|
|
We must support two kinds of generated running information: page-based (i.e.
|
|
page numbers, footnotes & some figure numbers) and document-based (i.e.
|
|
chapter numbers).
|
|
</li>
|
|
<li>
|
|
We must be able to insert the current date/time into the header/footer area.
|
|
</li>
|
|
<li>
|
|
We must be able to extract data from the document for inclusion in the
|
|
header/footer area. For example, if H1 elements define chapter titles, we must
|
|
be able to extract the contents of these elements for running headers/footers.
|
|
</li>
|
|
<li>
|
|
We must be able to suppress the display of this extracted information in the
|
|
body of the document. For example, a confidentiality clause that is pulled out
|
|
into the footer area does not need to be repeated in the body of the document.
|
|
However, you would want to display it in place when using a non-print medium.
|
|
</li>
|
|
<li>
|
|
We must be able to style portions of header/footer content at an appropriate
|
|
level of granularity.
|
|
</li>
|
|
</ol>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="running-header" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="running-header" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="running-header" value="3" />3: Neutral<br />
|
|
<input type="radio" name="running-header" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="running-header" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="running-header" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id10710829041"><a class="toc" name="id10710829041"></a><span class="secno">4. </span>Cross-references</h2>
|
|
<p>
|
|
If you print a document with hyperlinks to parts of itself, you might want to
|
|
print them as "see page 17" or "(section 5.1, page 53)" or "list item 4", See
|
|
<a href="http://lists.w3.org/Archives/Public/www-style/1998Jul/0039.html">Daniel
|
|
Glazman's e-mail</a>.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="crossrefs" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="crossrefs" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="crossrefs" value="3" />3: Neutral<br />
|
|
<input type="radio" name="crossrefs" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="crossrefs" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="crossrefs" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id01013225791"><a class="toc" name="id01013225791"></a><span class="secno">5. </span>Vertical text</h2>
|
|
<p>
|
|
Vertical text for the whole document, but also mixing vertical and horizontal,
|
|
within a line, or on a page. For example, in vertical text in Japanese, it is
|
|
quite common to put small numbers (2 or 3 digits) horizontally.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="vertical" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="vertical" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="vertical" value="3" />3: Neutral<br />
|
|
<input type="radio" name="vertical" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="vertical" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="vertical" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id18107060481"><a class="toc" name="id18107060481"></a><span class="secno">6. </span>Ruby</h2>
|
|
<p>
|
|
<img src="/TR/1998/ruby.gif" alt="Example of ruby" align="right" />Ruby are small annotations, usually written on top of a
|
|
character in Japanese or Chinese, that either give the pronunciation or the
|
|
meaning of the characters under them.</p>
|
|
<p>
|
|
See <a href="/International/Group/1998/03/Ruby/">Microsoft's
|
|
proposal</a>. [<a href="http://cgi.w3.org/MemberAccess/">member-only
|
|
link</a>]</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="ruby" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="ruby" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="ruby" value="3" />3: Neutral<br />
|
|
<input type="radio" name="ruby" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="ruby" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="ruby" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id03474144861"><a class="toc" name="id03474144861"></a><span class="secno">7. </span>Diagonal text & text along a path</h2>
|
|
<p>
|
|
SVG will probably provide means to do the complex things, but a diagonal
|
|
header above a table column might be possible without SVG. See also <a href="http://lists.w3.org/Archives/Member/w3c-css-wg/1998AprJun/0215.html">e-mail
|
|
by Jeffrey Veen</a>. [<a href="http://cgi.w3.org/MemberAccess/">member-only
|
|
link</a>]</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="diagonal" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="diagonal" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="diagonal" value="3" />3: Neutral<br />
|
|
<input type="radio" name="diagonal" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="diagonal" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="diagonal" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id04746437781"><a class="toc" name="id04746437781"></a><span class="secno">8. </span>Style properties for embedded 2D graphics</h2>
|
|
<p>
|
|
When you embed a PNG or GIF, you can only adapt the colors of the text to the
|
|
graphic, but with SVG, you should be able to do it the other way round: if
|
|
your page is red, then the graphic should be drawn in red lines as well. You
|
|
could specify the style for the text and the style for the graphic in a single
|
|
style sheet, and when the SVG is embedded/linked from an HTML page, it could
|
|
inherit the style sheet. This needs cooperation with <a href="../../Graphics/SVG/Group/">SVG</a> [<a href="http://cgi.w3.org/MemberAccess/">member-only link</a>]</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="SVG-properties" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="SVG-properties" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="SVG-properties" value="3" />3: Neutral<br />
|
|
<input type="radio" name="SVG-properties" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="SVG-properties" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="SVG-properties" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id20933357941"><a class="toc" name="id20933357941"></a><span class="secno">9. </span>Hyphenation control</h2>
|
|
<p>
|
|
Properties for turning hyphenation on/off or settings in between: highly
|
|
undesirable, avoid two hyphenated lines in a row, no restrictions...</p>
|
|
<p>
|
|
Maybe also a way to list hyphenation exceptions (difficult words) in the style
|
|
sheet.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="hyphenation" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="hyphenation" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="hyphenation" value="3" />3: Neutral<br />
|
|
<input type="radio" name="hyphenation" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="hyphenation" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="hyphenation" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id16017042441"><a class="toc" name="id16017042441"></a><span class="secno">10. </span>Image filters</h2>
|
|
<p>
|
|
Primitive (raster-) image operations, which can be applied to either the
|
|
foreground, or both the foreground and background of an element, and which can
|
|
be chained in sequence to create more complex effects.</p>
|
|
<p>
|
|
Examples: convolution matrices.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="filters" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="filters" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="filters" value="3" />3: Neutral<br />
|
|
<input type="radio" name="filters" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="filters" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="filters" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id09571241611"><a class="toc" name="id09571241611"></a><span class="secno">11. </span>Rendering objects for forms</h2>
|
|
<p>
|
|
Including control over look of interaction objects in their various states.
|
|
Keyword 'normal' or something similar to revert to normal look for user's
|
|
platform.</p>
|
|
<p>
|
|
Note: only the <em>look</em> is set with CSS. You can make an element look
|
|
like a native button, and you can maybe even cause it to change its look when
|
|
the user clicks or otherwise selects it, but it won't affect anything outside
|
|
itself, or send anything to a server, unless it also has the semantics of a
|
|
button, over which CSS has no control.</p>
|
|
<p>
|
|
See also <a href="/Style/Group/1998/10/userint.html">Tantek Çelik's proposal</a>. [<a href="http://cgi.w3.org/MemberAccess/">member-only link</a>]</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="form-objects" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="form-objects" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="form-objects" value="3" />3: Neutral<br />
|
|
<input type="radio" name="form-objects" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="form-objects" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="form-objects" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id17975790061"><a class="toc" name="id17975790061"></a><span class="secno">12. </span>A pseudo-element for the URL #fragment-id</h2>
|
|
<p>
|
|
Some URLs refer to a location within a resource. This kind of URL ends with
|
|
"#" followed by an anchor identifier (called the fragment identifier). URLs
|
|
with fragment identifiers link to a certain element within the document, known
|
|
as the target element. For instance, here is a URI pointing to an anchor named
|
|
"section_2":</p>
|
|
<blockquote>
|
|
<p>
|
|
http://somesite.com/html/top.html#section_2</p>
|
|
</blockquote>
|
|
<p>
|
|
The target element could be styled with a :target pseudo-class:</p>
|
|
<pre>:target { color: red }</pre>
|
|
<p>
|
|
If the URI that has been followed has no fragment identifier, the rule above
|
|
will have no effect.</p>
|
|
<p>
|
|
This idea was first suggested by <a href="http://www.undergrad.math.uwaterloo.ca/%7Eroconnor/">Russell
|
|
O'Connor</a>, in an <a href="http://lists.w3.org/Archives/Public/www-style/1998Mar/0036.html">e-email</a>
|
|
to www-style@w3.org, March 1998.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="fragment" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="fragment" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="fragment" value="3" />3: Neutral<br />
|
|
<input type="radio" name="fragment" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="fragment" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="fragment" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id06303182571"><a class="toc" name="id06303182571"></a><span class="secno">13. </span>Floating boxes to top & bottom of a page</h2>
|
|
<p>
|
|
In paged media, elements are often floated to the bottom or top of the (next)
|
|
page, because leaving them inline would cause ugly page breaks, and they are
|
|
too wide to float to the side.</p>
|
|
<p>
|
|
A simple solution is to add 'top' and 'bottom' to the 'float' property, and
|
|
possibly introduce additional properties to configure how many floats can
|
|
accumulate at the top of a page, or how far from its original location an
|
|
element can float.</p>
|
|
<p>
|
|
There is a connection with <a href="#Footnotes">footnotes</a> here. See also
|
|
<a href="#id0153933105">numbered floats</a> below.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="float-top" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="float-top" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="float-top" value="3" />3: Neutral<br />
|
|
<input type="radio" name="float-top" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="float-top" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="float-top" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="Footnotes1"><a class="toc" name="Footnotes1"></a><span class="secno">14. </span>Footnotes</h2>
|
|
<p>
|
|
Footnotes are somewhat like floats that go to the bottom of the page, but they
|
|
also leave a footnote marker behind. Therefore they might need special
|
|
treatment. Endnotes should be just a stylistic variant of footnotes, but how
|
|
do you indicate where the endnotes go?</p>
|
|
<p>
|
|
A footnote is also like a hyperlink, so maybe it should be possible to render
|
|
the target of a hyperlink in a footnote to the source of the hyperlink.</p>
|
|
<p>
|
|
See also <a href="#id0153933105">numbered floats</a> below.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="footnotes" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="footnotes" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="footnotes" value="3" />3: Neutral<br />
|
|
<input type="radio" name="footnotes" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="footnotes" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="footnotes" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id15822193411"><a class="toc" name="id15822193411"></a><span class="secno">15. </span>"Tooltips"/"balloonhelp"</h2>
|
|
<p>
|
|
Some connection with footnotes/endnotes. See <a href="http://lists.w3.org/Archives/Member/w3c-css-wg/1998JulSep/0087.html">thread</a>
|
|
[<a href="http://cgi.w3.org/MemberAccess/">member-only link</a>] in CSS &
|
|
FP WG. The text to pop up could be an element in the document itself, or a
|
|
hyperlinked document.</p>
|
|
<p>
|
|
See also <a href="#id1970302535">folding lists</a> below.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="balloonhelp" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="balloonhelp" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="balloonhelp" value="3" />3: Neutral<br />
|
|
<input type="radio" name="balloonhelp" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="balloonhelp" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="balloonhelp" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id17730911491"><a class="toc" name="id17730911491"></a><span class="secno">16. </span>Math</h2>
|
|
<p>
|
|
MathML has presentation objects. Should they be added to CSS? And should CSS
|
|
have additional properties for the fine points of mathematics
|
|
typesettting?</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="math" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="math" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="math" value="3" />3: Neutral<br />
|
|
<input type="radio" name="math" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="math" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="math" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id19703025351"><a class="toc" name="id19703025351"></a><span class="secno">17. </span>Folding lists</h2>
|
|
<p>
|
|
Traditionally, hypertext systems have included a type of hyperlink that
|
|
inserted ("transcluded") linked text in the text it was linked from: the first
|
|
click unfolded the text, the next one hid it again. Like with <a href="#id1582219341">tooltips/balloonhelp</a>, this display mode could be
|
|
applied to elements in a document, but also to whole documents. The first
|
|
replaces, e.g., a list with a single button that unfolds the list. The second
|
|
replaces an A element with the document it points to.</p>
|
|
<p>
|
|
The property for the second method (using hyperlinks) could be as simple
|
|
as:</p>
|
|
<pre>DIV.expand {hyper-display: folding
|
|
/* or: replace, pop-up, new-window,... */}</pre>
|
|
<p>
|
|
meaning that within a DIV with CLASS "expand" all hyperlinks, when activated,
|
|
will cause the target document to be displayed in-place, replacing their
|
|
source anchor. Browsers would need to provide a way to undo the effect, of
|
|
course.</p>
|
|
<p>
|
|
What will be the style of the included document? It should probably be the
|
|
same as the document it is included into, or maybe that is under the control
|
|
of another property. (A question of another type: any new legislation
|
|
necessary to stop people from maliciously transcluding other people's
|
|
documents?)</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="fold-unfold" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="fold-unfold" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="fold-unfold" value="3" />3: Neutral<br />
|
|
<input type="radio" name="fold-unfold" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="fold-unfold" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="fold-unfold" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id1565770800"><a class="toc" name="id1565770800"></a><span class="secno">18. </span>Page-transition effects</h2>
|
|
<p>
|
|
When one page is replaced by another, and the new page doesn't take too long
|
|
to load, the transition between the two can be made a bit more interesting,
|
|
with effects like those commonly found in slide show presentations: wipes,
|
|
fades, checkerboards, etc. For example:</p>
|
|
<pre>A.local {transition-style: fade}</pre>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="transitions" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="transitions" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="transitions" value="3" />3: Neutral<br />
|
|
<input type="radio" name="transitions" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="transitions" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="transitions" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id1277888888"><a class="toc" name="id1277888888"></a><span class="secno">19. </span>Timed styles</h2>
|
|
<p>
|
|
Clock-controled styles, drawing ideas from SMIL. (Although SMIL can probably
|
|
do it better.)</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="time" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="time" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="time" value="3" />3: Neutral<br />
|
|
<input type="radio" name="time" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="time" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="time" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id06251190921"><a class="toc" name="id06251190921"></a><span class="secno">20. </span>Leaders</h2>
|
|
<p>
|
|
Tables allow tabular information to be presented in certain ways, but one
|
|
common effects is missing: leaders.</p>
|
|
<p>
|
|
<em>"Leaders"</em> is the name of the row of dots that connects data in two
|
|
columns, often seen in ToCs, but also in wide tables when there is a danger
|
|
that the eye can't connect the two columns. The dots in subsequent lines are
|
|
usually aligned vertically, but not always. Sometimes they are not dots, but
|
|
lines, arrows, or other things.</p>
|
|
<pre>Chapter 1. Introduction . . . . . . 1
|
|
Chapter 2. The life of bats . . . . 3
|
|
Chapter 3. Bats and ants . . . . 34</pre>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="leaders" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="leaders" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="leaders" value="3" />3: Neutral<br />
|
|
<input type="radio" name="leaders" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="leaders" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="leaders" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id1554439764"><a class="toc" name="id1554439764"></a><span class="secno">21. </span>Smart tabs</h2>
|
|
<p>
|
|
In a table in which one column has a few entries that are longer than most
|
|
others, it is sometimes useful to make the column narrow, and allow those few
|
|
entries to extend into the next column. The data in that next column then
|
|
moves down one line. The same effect is also used for right aligned author
|
|
names after a quote, or certain kinds of bibliographic references: if the name
|
|
fits on the same line as the last word of the quote, it is put there,
|
|
otherwise it is put on the next line.</p>
|
|
<pre>Paper . . . . . 12.50
|
|
Pens . . . . . 3.75
|
|
Special paper to wrap
|
|
around other paper
|
|
. . . . . . . . 24.00
|
|
Pencils . . . . 1.10
|
|
------
|
|
Total . . . . . 0.00</pre>
|
|
<p>
|
|
Here is a quote from an e-mail:</p>
|
|
<blockquote>
|
|
<p>
|
|
I have two tabulator positions (say at 60/80 and 70/80), pieces of text
|
|
(align=justify) that are to extend over the whole line (from 0 to 80), and
|
|
then I want to insert something like <TAB=60>. The cursor should jump to
|
|
the tab position 60/80 (in the same line if there is enough space, otherwise
|
|
in the next line) and I want the text in this tab row to be aligned to the
|
|
right. Then I have another tab stop at 70/80 with the same requirements. After
|
|
a "end of line" <BR> or <P>, I want to return to the plain text
|
|
extending over the whole line as before.</p>
|
|
<p align="right">
|
|
[9 Apr 1998, Gerhard Schon <worldcoins@metronet.de>]</p>
|
|
</blockquote>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="tabs" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="tabs" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="tabs" value="3" />3: Neutral<br />
|
|
<input type="radio" name="tabs" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="tabs" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="tabs" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id21072524491"><a class="toc" name="id21072524491"></a><span class="secno">22. </span>Spreadsheet functions</h2>
|
|
<p>
|
|
Some parts of a document may be redundant in a very straightforward and easy
|
|
to specify way, such as the sum of a column of numbers, the amount of sales
|
|
tax on a paid price, or a word or phrase that is repeated in several
|
|
places.</p>
|
|
<p>
|
|
There are at least four ways to deal with this:</p>
|
|
<ol>
|
|
<li>
|
|
do nothing: all redundancy is handled at the "server-side," i.e., by the
|
|
author of the page, possibly with the help of scripts or a macro processor.
|
|
</li>
|
|
<li>
|
|
extend HTML: elements in HTML could express that their content is computed
|
|
from other elements.
|
|
</li>
|
|
<li>
|
|
extend CSS: the 'content' property could accept functions.
|
|
</li>
|
|
<li>
|
|
develop a spreadsheet format (in XML), that can then be embedded in HTML (via
|
|
the OBJECT element); a way for OBJECT to inherit the style sheet is also
|
|
needed.
|
|
</li>
|
|
</ol>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="spreadsheet" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="spreadsheet" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="spreadsheet" value="3" />3: Neutral<br />
|
|
<input type="radio" name="spreadsheet" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="spreadsheet" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="spreadsheet" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id19598620931"><a class="toc" name="id19598620931"></a><span class="secno">23. </span>Non-rectangular wrap-around</h2>
|
|
<p>
|
|
Either driven by the shape of the image (the parts that are X percent or more
|
|
transparent), or by a shape specified in the style sheet. The simplest
|
|
proposal dates from 1996, and adds the keyword 'contour' on the 'float'
|
|
property. See <a href="../../TR/WD-css1-960726.html#float">WD-css1-960726</a>:</p>
|
|
<pre>IMG {float: left contour}</pre>
|
|
<p>
|
|
Specifying the shape explicitly in the style sheet can be done with a similar
|
|
syntax as that used by the <a href="http://www.w3.org/TR/REC-CSS2/visufx.html#clipping">'clip'</a>
|
|
property.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="contour" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="contour" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="contour" value="3" />3: Neutral<br />
|
|
<input type="radio" name="contour" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="contour" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="contour" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id04229052841"><a class="toc" name="id04229052841"></a><span class="secno">24. </span>Gradient & stretched backgrounds</h2>
|
|
<p>
|
|
It is currently not possible to make a background image that is exactly as
|
|
wide as the element it is behind. CSS allows it to be centered or tiled, but
|
|
not resized. With the coming vector graphics formats (<a href="http://www.w3.org/Graphics/Activity#role">SVG</a>), it seems especially
|
|
useful to be able to scale a background image.</p>
|
|
<p>
|
|
One particular example is a color gradient: a background that changes
|
|
gradually in color between two points or sides. Rather than an external image
|
|
in SVG, this might even be a primitive in CSS.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="background-scale" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="background-scale" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="background-scale" value="3" />3: Neutral<br />
|
|
<input type="radio" name="background-scale" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="background-scale" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="background-scale" checked value="0" />I skipped
|
|
this question</p>
|
|
</div>
|
|
|
|
<h2 id="id042290528411"><a class="toc" name="id042290528411"></a><span class="secno">25. </span>Textures/images instead of foreground colors</h2>
|
|
<p>
|
|
CSS can set the color of text, but in some headings especially, people might
|
|
want not a color, but a pattern mapped on the letters. (See also <a href="http://lists.w3.org/Archives/Member/w3c-css-wg/1998AprJun/0215.html">e-mail
|
|
by Jeffrey Veen</a>.[<a href="http://cgi.w3.org/MemberAccess/">member-only
|
|
link</a>])</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="fg-texture" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="fg-texture" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="fg-texture" value="3" />3: Neutral<br />
|
|
<input type="radio" name="fg-texture" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="fg-texture" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="fg-texture" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id06312789671"><a class="toc" name="id06312789671"></a><span class="secno">26. </span>Transparency</h2>
|
|
<p>
|
|
Transparency (as given by the 'visibility' property, is currently limited to
|
|
0% and 100%. Values in between are needed for some effects with overlapping
|
|
texts. Transparency can also be added to the <color> type, e.g.: rgba(40%,
|
|
40%, 100%,70%), for a 70% opaque light blue.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="transparency" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="transparency" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="transparency" value="3" />3: Neutral<br />
|
|
<input type="radio" name="transparency" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="transparency" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="transparency" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id00256283761"><a class="toc" name="id00256283761"></a><span class="secno">27. </span>Constant expressions</h2>
|
|
<p>
|
|
You can set 'font-size: larger', but wouldn't it be nice to be able to say
|
|
'font-size: font-size + 2pt'? or 'line-height: max(10pt, width/12)'</p>
|
|
<p>
|
|
As long as these expressions can be evaluated at the time the element is
|
|
loaded, the extra work isn't much bigger than for percentages. On the other
|
|
hand, specifying such an expression in a WYSIWYG and/or Direct-Manipulation
|
|
editor isn't easy. Limiting the expressions to a small set might allow such an
|
|
editor to provide them in a pull-down menu.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="expressions" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="expressions" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="expressions" value="3" />3: Neutral<br />
|
|
<input type="radio" name="expressions" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="expressions" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="expressions" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id05684046681"><a class="toc" name="id05684046681"></a><span class="secno">28. </span>Symbolic constants</h2>
|
|
<p>
|
|
If the same value appears in multiple places, such as all headings getting the
|
|
same color, you can use rule grouping:</p>
|
|
<pre>H1, H2, H3 {color: #faa}</pre>
|
|
<p>
|
|
Some people find it more convenient to use grouping for other purposes, and
|
|
use a symbolic constant instead. E.g.:</p>
|
|
<pre>@define orange = #faa;
|
|
|
|
H1 {color: orange}
|
|
H2 {color: orange}
|
|
H3 {color: orange}</pre>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="constants" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="constants" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="constants" value="3" />3: Neutral<br />
|
|
<input type="radio" name="constants" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="constants" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="constants" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id01890417881"><a class="toc" name="id01890417881"></a><span class="secno">29. </span>Mixed mode rendering</h2>
|
|
<p>
|
|
CSS can specify style sheets for aural rendering and for vusal rendering, even
|
|
in the same style sheet, but it cannot specify a style for a device that can
|
|
do both at the same time. And yet, for a device with a small or hard-to-read
|
|
screen (mobile phone, car information system, TV), you might like to specify
|
|
that some parts of the document are displayed (headers, for example) and
|
|
others are spoken (the rest).</p>
|
|
<p>
|
|
(Since this is multimedia, it probably belongs in SMIL, though.)</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="multi-media" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="multi-media" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="multi-media" value="3" />3: Neutral<br />
|
|
<input type="radio" name="multi-media" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="multi-media" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="multi-media" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id07007348961"><a class="toc" name="id07007348961"></a><span class="secno">30. </span>Grid-device properties</h2>
|
|
<p>
|
|
Control for spacing on a TTY device. An em doesn't mean much in text mode.
|
|
How do you say that the line should be indented by two characters? A new grid
|
|
unit could be added for such media. A braille device has similar
|
|
requirements..</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="grid" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="grid" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="grid" value="3" />3: Neutral<br />
|
|
<input type="radio" name="grid" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="grid" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="grid" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id01015114197"><a class="toc" name="id01015114197"></a><span class="secno">31. </span>Co-dependencies between rules</h2>
|
|
<p>
|
|
Style rules can fail, because the UA is unable to allocate the necessary
|
|
resources (no more colors, for example), or because the UA doesn't implement a
|
|
particular rule (CSS1 browser with a CSS2 property, for example). Designers
|
|
can provide a fallback for the latter case, but only for that same property.
|
|
They cannot replace a failed color with an underline.</p>
|
|
<p>
|
|
CSS could introduce a notion of success/failure for rules, and provide, for
|
|
example, selectors that apply only when some other rule fails.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="co-dependency" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="co-dependency" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="co-dependency" value="3" />3: Neutral<br />
|
|
<input type="radio" name="co-dependency" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="co-dependency" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="co-dependency" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id007975494911"><a class="toc" name="id007975494911"></a><span class="secno">32. </span>High-level constraints</h2>
|
|
<p>
|
|
Instead of specifying specific values for properties, one could give relations
|
|
between properties and constraints on their values, and then give some
|
|
criterium to optimise. For example, a certain element must have a larger font
|
|
size than another element., or the indent must be less than 25% of the width.
|
|
The actual values would then be found by a constraint solver.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="constraints" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="constraints" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="constraints" value="3" />3: Neutral<br />
|
|
<input type="radio" name="constraints" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="constraints" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="constraints" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id13521541791"><a class="toc" name="id13521541791"></a><span class="secno">33. </span>Float: gutter-side/fore-edge-side</h2>
|
|
<p>
|
|
Currently, elements can be floated left or right. In double-sided printing,
|
|
you might want to specify that an element floats to the left <em>or</em> right
|
|
side, depending on whether the page is a left or right page. Other possible
|
|
names for the keywords: inside/outside, back-side, outer-edge. See <a href="http://lists.w3.org/Archives/Member/w3c-css-wg/1998AprJun/0188.html">Daniel
|
|
Glazman's message</a>. [<a href="http://cgi.w3.org/MemberAccess/">member-only
|
|
link</a>]</p>
|
|
<p>
|
|
Similar mechanisms for other properties that have left/right values:
|
|
caption-side, running headers and footers, page numbers, and maybe even
|
|
text-align.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="float-inside" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="float-inside" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="float-inside" value="3" />3: Neutral<br />
|
|
<input type="radio" name="float-inside" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="float-inside" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="float-inside" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id06376186981"><a class="toc" name="id06376186981"></a><span class="secno">34. </span>Icons & minimization</h2>
|
|
<p>
|
|
Replacing an element with an icon, which, when activated, expands into the
|
|
normal contents. The icon for the toplevel element could be used by a browser
|
|
as its own icon, when the browser itself is iconified.</p>
|
|
<pre>icon: url(some-image)</pre>
|
|
<p>
|
|
How is it specified that the element is collapsible? How is the spacing around
|
|
the icon specified? How is the initial display mode specified? See also <a href="#id1582219341">tooltips/balloonhelp</a> and <a href="#id1970302535">folding lists</a> above.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="icons" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="icons" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="icons" value="3" />3: Neutral<br />
|
|
<input type="radio" name="icons" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="icons" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="icons" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id02970417611"><a class="toc" name="id02970417611"></a><span class="secno">35. </span>Namespaces</h2>
|
|
<p>
|
|
Some XML-based formats may allow other XML-based resources to be directly
|
|
embedded, instead of linked via elements like IMG or OBJECT. For these
|
|
documents it may be handy to have separate sections in a style sheet that only
|
|
apply to the outer document, only to the embedded one, or to both. One
|
|
suggested syntax, inspired by the @media, is</p>
|
|
<pre>@namespace url(url-identifiying-a-format) {
|
|
... format-specific style rules...
|
|
}</pre>
|
|
<p>
|
|
This would work for document formats that use XML namespaces (see draft) for
|
|
mixing formats. The style rules in such a section only apply to elements in
|
|
the document that have the given namespace URL, or whose parent is in that
|
|
namespace. It would most likely also cause any namespace-prefixes to be
|
|
discarded in the document. (Normally, an element name like <x:foo> is just
|
|
regarded as a name of 5 letters x : f o o, but inside this @-rule, the "x:"
|
|
would be stripped before matching against a selector.)</p>
|
|
<p>
|
|
The format may also be identified by a MIME type instead of a URL, if the
|
|
embedding is an XML-based format that has a registered MIME type.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="namespaces" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="namespaces" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="namespaces" value="3" />3: Neutral<br />
|
|
<input type="radio" name="namespaces" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="namespaces" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="namespaces" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id11152936971"><a class="toc" name="id11152936971"></a><span class="secno">36. </span>Braille</h2>
|
|
<p>
|
|
Properties for braille could include</p>
|
|
<ul>
|
|
<li>
|
|
whether to do contractions or not (contractions are abbreviations: certain
|
|
very common words are replaced by single codes.These codes are
|
|
language-dependent, and probably even variable within a language.)
|
|
</li>
|
|
<li>
|
|
how to "explode" a table: re-order the cells of a table that is too wide.
|
|
</li>
|
|
<li>
|
|
paper sizes
|
|
</li>
|
|
</ul>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="braille" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="braille" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="braille" value="3" />3: Neutral<br />
|
|
<input type="radio" name="braille" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="braille" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="braille" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id01539331051"><a class="toc" name="id01539331051"></a><span class="secno">37. </span>Numbered floats</h2>
|
|
<p>
|
|
Floats can be used to create side-notes, and, if floats are extended, probably
|
|
also <a href="#Footnotes">footnotes</a> and endnotes. However, while it is
|
|
possible to number the floats, it is not possible to leave a copy of the
|
|
number at the place where the float is anchored. This is similar to <a href="#id1071082904">cross-references</a>, but this could be common enough to
|
|
warrant a single-property solution:</p>
|
|
<pre>SPAN.sidenote {float: left; width: 4em; float-style: decimal}</pre>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="number-float" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="number-float" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="number-float" value="3" />3: Neutral<br />
|
|
<input type="radio" name="number-float" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="number-float" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="number-float" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id20323747591"><a class="toc" name="id20323747591"></a><span class="secno">38. </span>"Visual" top/bottom margins</h2>
|
|
<p>
|
|
When an indented display follows a paragraph, the visual impression of the
|
|
whitespace between them depends on the length of the last line of the
|
|
paragraph. Compare</p>
|
|
<pre>This is the last but one line of this
|
|
paragraph, it just fills some space.
|
|
This is the last line of a paragraph
|
|
that ends with a fairly full line.
|
|
|
|
Here is a blockquote or displayed
|
|
formula, separated from the
|
|
paragraph by some white space.</pre>
|
|
<p>
|
|
with:</p>
|
|
<pre>This is the last but one line of this
|
|
paragraph, it just fills some space.
|
|
This paragraph ends with a short
|
|
line.
|
|
|
|
Here is a blockquote or displayed
|
|
formula, separated from the
|
|
paragraph by some white space.</pre>
|
|
<p>
|
|
T<sub>E</sub>X is one of the few (maybe the only?) system that handles this
|
|
automatically (via a pair of parameters).</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="visual-margin" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="visual-margin" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="visual-margin" value="3" />3: Neutral<br />
|
|
<input type="radio" name="visual-margin" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="visual-margin" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="visual-margin" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id09031285251"><a class="toc" name="id09031285251"></a><span class="secno">39. </span>ToC's, tables of figures, etc.</h2>
|
|
<p>
|
|
Automatically adding tables of contents, tables of figures, etc. to the
|
|
printed version of a document seems to require going over the document once
|
|
for every type of table, applying a different style sheet to it every time,
|
|
plus some way to collate the various results in the right order.</p>
|
|
<p>
|
|
If each table is on its own page, then maybe the existence of a certain @page
|
|
could be the trigger to start the multipass processing. See <a href="http://lists.w3.org/Archives/Public/www-style/1998Jul/0039.html">Daniel
|
|
Glazman' e-mail</a>.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="tocs" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="tocs" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="tocs" value="3" />3: Neutral<br />
|
|
<input type="radio" name="tocs" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="tocs" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="tocs" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id1876310632"><a class="toc" name="id1876310632"></a><span class="secno">40. </span>Indexes</h2>
|
|
<p>
|
|
Indexes differ from tables of contents in the fact that they are sorted in
|
|
complex ways. Just applying a different style sheet is not enough to turn a
|
|
document into an index of itself. Indexes are probably better generated by
|
|
dedicated software, or maybe by putting sorting routines into XSL. If added to
|
|
CSS, they might need a <em>lot</em> of properties.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="indexes" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="indexes" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="indexes" value="3" />3: Neutral<br />
|
|
<input type="radio" name="indexes" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="indexes" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="indexes" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id21238494811"><a class="toc" name="id21238494811"></a><span class="secno">41. </span>pseudo-element</h2>
|
|
<p>
|
|
Some magazines print not just the first line in a special style, but the first
|
|
<var>n</var> lines. For example, if the drop-cap spans three lines, the first
|
|
three lines are in uppercase as well. See <a href="http://lists.w3.org/Archives/Public/www-style/1998Jul/0039.html">Daniel
|
|
Glazman' e-mail</a>.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="first-lines" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="first-lines" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="first-lines" value="3" />3: Neutral<br />
|
|
<input type="radio" name="first-lines" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="first-lines" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="first-lines" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id17693349951"><a class="toc" name="id17693349951"></a><span class="secno">42. </span>'First-word' pseudo-element</h2>
|
|
<p>
|
|
Similar to 'first-letter' and 'first-line', but for the first "word" (however
|
|
we define "word").. See <a href="http://www.bath.ac.uk/%7Epy8ieh/internet/wwwstyle.html">Ian Hickson's
|
|
list</a>.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="first-word" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="first-word" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="first-word" value="3" />3: Neutral<br />
|
|
<input type="radio" name="first-word" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="first-word" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="first-word" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id20650112531"><a class="toc" name="id20650112531"></a><span class="secno">43. </span>Corner pieces for borders</h2>
|
|
<p>
|
|
CSS2 has a small number of styles for the borders, but how the borders meet in
|
|
the corners is left undefined. Maybe properties for rounded corners, open
|
|
corners, or various ornaments can be added. See <a href="http://lists.w3.org/Archives/Public/www-style/1998Jul/0039.html">Daniel
|
|
Glazman' e-mail</a>.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="border-corner" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="border-corner" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="border-corner" value="3" />3: Neutral<br />
|
|
<input type="radio" name="border-corner" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="border-corner" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="border-corner" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id16717669191"><a class="toc" name="id16717669191"></a><span class="secno">44. </span>Local and external anchors</h2>
|
|
<p>
|
|
A link within the same document might be given a different style from one
|
|
pointing outside. A pseudo-class might make this distinction:</p>
|
|
<pre>A:link<strong>:local</strong>, A:visited<strong>:local</strong> {color: green}</pre>
|
|
<p>
|
|
See <a href="http://lists.w3.org/Archives/Public/www-style/1998Jul/0039.html">Daniel
|
|
Glazman' e-mail</a>. Also see <a href="#id1071082904">cross-references</a>
|
|
above.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="local-anchor" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="local-anchor" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="local-anchor" value="3" />3: Neutral<br />
|
|
<input type="radio" name="local-anchor" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="local-anchor" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="local-anchor" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id08392822801"><a class="toc" name="id08392822801"></a><span class="secno">45. </span>Access to attribute values</h2>
|
|
<p>
|
|
CSS2 only gives access to attribute values of the current element (the
|
|
"subject" of the selector), and then only as a string for use in the 'content'
|
|
attribute. Access to arbitrary attributes of arbitrary elements, and
|
|
conversion/string-manipulation of those elements for use in arbitrary property
|
|
values has been <a href="http://lists.w3.org/Archives/Public/www-style/1998Jul/0039.html">suggested</a>.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="attrib" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="attrib" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="attrib" value="3" />3: Neutral<br />
|
|
<input type="radio" name="attrib" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="attrib" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="attrib" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id19831851421"><a class="toc" name="id19831851421"></a><span class="secno">46. </span>Linked flows</h2>
|
|
<p>
|
|
A complex layout may have several areas that are chained: when the first one
|
|
fills up, the rest of the text flows to the second, etc. For example, a
|
|
newspaper often has one small column of a story on the front page, and then
|
|
the rest on other pages. See <a href="http://lists.w3.org/Archives/Member/w3c-css-wg/1998AprJun/0215.html">e-mail
|
|
by Jeffrey Veen</a> [<a href="http://cgi.w3.org/MemberAccess/">member-only
|
|
link</a>]. One way is to use the ideas from <a href="../../TR/NOTE-layout">NOTE-layout</a> (or some other refinement of the
|
|
page-box idea from CSS2), and give the boxes thus defined a 'flow' property,
|
|
that contains an identifier. Elements can then be given a 'flow' property as
|
|
well, causing the content of the element to go into the boxes with the same
|
|
named flow.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="flows" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="flows" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="flows" value="3" />3: Neutral<br />
|
|
<input type="radio" name="flows" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="flows" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="flows" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id20832642671"><a class="toc" name="id20832642671"></a><span class="secno">47. </span>Pseudo-classes for user states</h2>
|
|
<p>
|
|
The ':hover', ':active', and 'focus' pseudo-classes provide selectors for
|
|
elements that the user is interacting with. The list could be extended (see <a href="http://lists.w3.org/Archives/Member/w3c-css-wg/1998AprJun/0215.html">e-mail
|
|
by Jeffrey Veen</a> [<a href="http://cgi.w3.org/MemberAccess/">member-only
|
|
link</a>].):</p>
|
|
<dl>
|
|
<dt><code>:drag</code></dt>
|
|
<dd>
|
|
style for an element that is being dragged.
|
|
</dd>
|
|
<dt><code>:drop</code></dt>
|
|
<dd>
|
|
style for an element that accepts drops while a dragged element is hovering
|
|
over it.
|
|
</dd>
|
|
<dt><code>:mouse-down</code></dt>
|
|
<dd>
|
|
style for an element during the time any mouse button is pressed on it.
|
|
</dd>
|
|
<dt><code>:mouse1-down</code></dt>
|
|
<dd>
|
|
style for an element during the time mouse button 1 is pressed on it.
|
|
</dd>
|
|
</dl>
|
|
<p>
|
|
Question is, of course, how many events should be defined, and at what level
|
|
of abstraction. Some browsers don't use a mouse or keyboard, some mice have 1,
|
|
others have 2 or 3 buttons, joysticks have yet other buttons, the remote
|
|
control of a TV has different buttons again, etc.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="user-events" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="user-events" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="user-events" value="3" />3: Neutral<br />
|
|
<input type="radio" name="user-events" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="user-events" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="user-events" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id14867418791"><a class="toc" name="id14867418791"></a><span class="secno">48. </span>List numbering generalized and internationalized</h2>
|
|
<p>
|
|
Add keywords and/or properties that control various dimensions independently:
|
|
ordinal ("5th") vs cardinal ("5"), digits ("5") vs words ("five"), and
|
|
additional international numbering systems & scripts. See <a href="../../Style/Group/1998/06/numberings.htm">document by Daniel Glazman</a>
|
|
[<a href="http://cgi.w3.org/MemberAccess/">member-only link</a>].</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="listnum" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="listnum" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="listnum" value="3" />3: Neutral<br />
|
|
<input type="radio" name="listnum" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="listnum" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="listnum" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id10065288501"><a class="toc" name="id10065288501"></a><span class="secno">49. </span>"Subtractive" text-decoration</h2>
|
|
<p>
|
|
'Text-decoration' only <em>adds</em> decorations to a text. There is no way
|
|
for a child element to remove a decoration added to it by its parent. A new
|
|
property, or one or more new keywords could make it possible that a child
|
|
element interrupts the underlining of its parent:</p>
|
|
<pre>text-decoration: overline no-underline</pre>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="sub-text-deco" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="sub-text-deco" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="sub-text-deco" value="3" />3: Neutral<br />
|
|
<input type="radio" name="sub-text-deco" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="sub-text-deco" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="sub-text-deco" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id04719733531"><a class="toc" name="id04719733531"></a><span class="secno">50. </span>Style for HTML's MAP & AREA elements</h2>
|
|
<p>
|
|
The MAP & AREA elements in HTML define regions in a replaced element
|
|
(typically an image). Can these regions be given a style? A background behind
|
|
the object? An outline on top of the object?</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="map-area" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="map-area" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="map-area" value="3" />3: Neutral<br />
|
|
<input type="radio" name="map-area" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="map-area" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="map-area" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id14474829771"><a class="toc" name="id14474829771"></a><span class="secno">51. </span>Transliteration</h2>
|
|
<p>
|
|
A property to invoke a transliteration process: <code>'transliteration:
|
|
fr-ca</code>' would transliterate the text using the (or: some set of) rules
|
|
for Canadian French. Instead of assuming transliteration knowledge, we could
|
|
point (via a URL) to a transliteration table in some standard format (which
|
|
would have to be developed). The transliteration table could even be in CSS
|
|
itself: <code>@transliteration ja fr-ca {...}</code> contains the table that
|
|
transliterates Japanese for Canadian French readers. An <code>@import</code>
|
|
would then suffice.</p>
|
|
<p>
|
|
Instead of becoming a new property, transliteration could be added to
|
|
'<code>text-transform</code>':</p>
|
|
<pre>SPAN.foreign {text-transform: uppercase nl}</pre>
|
|
<p>
|
|
would transliterate to Dutch and convert to uppercase at the same time.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="transliteration" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="transliteration" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="transliteration" value="3" />3: Neutral<br />
|
|
<input type="radio" name="transliteration" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="transliteration" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="transliteration" checked value="0" />I skipped
|
|
this question</p>
|
|
</div>
|
|
|
|
<h2 id="id10587809881"><a class="toc" name="id10587809881"></a><span class="secno">52. </span>Regular expressions in selectors</h2>
|
|
<p>
|
|
Regular expressions (or their less powerful cousins: wildcards) are very
|
|
powerful, but also very hard for people not trained in them. They could be
|
|
used in several places:</p>
|
|
<ul>
|
|
<li>
|
|
element & attribute names: if there are so many elements that enumerating
|
|
all of them is too much work: H<[0-9]+]> matches all names H0, H1,... H10,
|
|
H11, H12,... etc.
|
|
</li>
|
|
<li>
|
|
attribute values
|
|
</li>
|
|
<li>
|
|
element content: match an element based on the occurence of a pattern in the
|
|
content; you could make all occurences of a company name red, even without
|
|
SPANs around them
|
|
</li>
|
|
</ul>
|
|
<p>
|
|
If they exist in selectors, then there should probably also be a way to use
|
|
the matched text on the right hand side.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="regexp" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="regexp" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="regexp" value="3" />3: Neutral<br />
|
|
<input type="radio" name="regexp" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="regexp" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="regexp" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id10072048161"><a class="toc" name="id10072048161"></a><span class="secno">53. </span>Last-of... selectors</h2>
|
|
<p>
|
|
Selectors can currently match the first child, and can (in principle, though
|
|
somewhat inconveniently) count children, but they can't match the last (or
|
|
last but one, or...) child, or the first/last of a certain kind. Such last-of
|
|
selectors make progressive rendering impossible, but could be useful in some
|
|
print environments. <a href="http://www.w3.org/Submission/1998/19/">STTS3</a>
|
|
defines :first-of-type, :last-of-type, :not-first-of-type, :only-of-type, and
|
|
several others. See also XSL.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="last-of" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="last-of" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="last-of" value="3" />3: Neutral<br />
|
|
<input type="radio" name="last-of" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="last-of" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="last-of" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id20550108161"><a class="toc" name="id20550108161"></a><span class="secno">54. </span>Control over progressive rendering</h2>
|
|
<p>
|
|
A designer might want to display something specific in place of the generic
|
|
icon, while a large image is loading. Or hold off displaying part of a list in
|
|
favor of displaying it all at once when it has been loaded completely. Or give
|
|
text a different color until the document is complete. See <a href="/Style/Group/1998/09/progrend-19980930.html">Tantek Çelik's proposal</a> [<a href="http://cgi.w3.org/MemberAccess/">member-only link</a>].</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="progrend" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="progrend" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="progrend" value="3" />3: Neutral<br />
|
|
<input type="radio" name="progrend" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="progrend" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="progrend" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id10012342721"><a class="toc" name="id10012342721"></a><span class="secno">55. </span>Inline-block</h2>
|
|
<p>
|
|
'Display: inline-block' creates an inline element that internally acts like a
|
|
block. Needed for the BUTTON element. If the source is like this:</p>
|
|
<pre>SPAN {display: inline-block; width: 8em}
|
|
...
|
|
<P>Before <SPAN>several lines of text in an inline block,
|
|
the width of which is set, the height isn't.</SPAN>
|
|
and after the line continues</pre>
|
|
<p>
|
|
the result might look something like this:</p>
|
|
<pre> several lines of
|
|
text in an inline
|
|
before block, the width and after the line continues
|
|
of which is set,
|
|
the height isn't.</pre>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="inline-block" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="inline-block" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="inline-block" value="3" />3: Neutral<br />
|
|
<input type="radio" name="inline-block" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="inline-block" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="inline-block" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id00219150021"><a class="toc" name="id00219150021"></a><span class="secno">56. </span>Non-breaking inline elements</h2>
|
|
<p>
|
|
'whitespace: nowrap' prevents breaking in block-level elements, but doesn't
|
|
apply to inline-level elements. Maybe it should.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="inline-nowrap" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="inline-nowrap" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="inline-nowrap" value="3" />3: Neutral<br />
|
|
<input type="radio" name="inline-nowrap" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="inline-nowrap" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="inline-nowrap" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id17654456211"><a class="toc" name="id17654456211"></a><span class="secno">57. </span>Suppress word spacing</h2>
|
|
<p>
|
|
Adding a value 'none' to word-spacing will allow a phrase entered with a space
|
|
to be rendered without one, something often seen in letter-spaced titles.
|
|
Source:</p>
|
|
<pre><H2>Channel 7</H2></pre>
|
|
<p>
|
|
Style sheet:</p>
|
|
<pre>letter-spacing: 0.6em;
|
|
word-spacing: none;
|
|
text-transform: uppercase</pre>
|
|
<p>
|
|
Result:</p>
|
|
<pre>C H A N N E L 7</pre>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="suppress-word-spacing" value="1" />1: Strongly
|
|
opposed<br />
|
|
<input type="radio" name="suppress-word-spacing" value="2" />2: Mildly
|
|
opposed<br />
|
|
<input type="radio" name="suppress-word-spacing" value="3" />3: Neutral<br />
|
|
<input type="radio" name="suppress-word-spacing" value="4" />4: Mildly in
|
|
favor<br />
|
|
<input type="radio" name="suppress-word-spacing" value="5" />5: Strongly in
|
|
favor<br />
|
|
or: <input type="radio" name="suppress-word-spacing" checked value="0" />I
|
|
skipped this question</p>
|
|
</div>
|
|
|
|
<h2 id="id15776574841"><a class="toc" name="id15776574841"></a><span class="secno">58. </span>HSV or HSL color notation</h2>
|
|
<p>
|
|
In addition to the rgb() notation, CSS could support an hsv() or hsl()
|
|
notation, which some people find easier to work with. The meaning would still
|
|
be defined relative to the sRGB color model: rgb() and hsv() can be converted
|
|
into each other with a simple computation. (HSL was first <a href="http://lists.w3.org/Archives/Member/w3c-css-wg/1997OctDec/0149.html">suggested</a>
|
|
by Steven Pemberton, Braden N. McDaniel recently <a href="http://lists.w3.org/Archives/Public/www-style/1998Oct/0032.html">suggested</a>
|
|
HSV.)</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="hsl" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="hsl" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="hsl" value="3" />3: Neutral<br />
|
|
<input type="radio" name="hsl" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="hsl" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="hsl" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id1533219177"><a class="toc" name="id1533219177"></a><span class="secno">59. </span>140-odd color names</h2>
|
|
<p>
|
|
Back in 1993, most browsers ran only under Unix. Most Unixes come with a
|
|
windowing system called the X Window System. That's where the Web got its
|
|
hexadecimal color notation ("#rrggbb") from. Most X's include a list of some
|
|
140 color names, and in fact the same X function that translates "#rrggbb" to
|
|
a color also translates those names to colors. That's why early Web browsers
|
|
supported so many color names: it came for free under Unix. On most systems,
|
|
the system administrators never changed the color names that came with the
|
|
system, even though a program was provided specifically to do that. And thus
|
|
the original list thrown together by some MIT students in the early '80s
|
|
continued on.</p>
|
|
<p>
|
|
Later browsers kept on supporting those names, even on non-Unix systems, and
|
|
even though there is no single authoritative list, and no single way to
|
|
translate the names to colors. Some people still use them. CSS could
|
|
standardize a list, and specify the precise sRGB colors for each of them
|
|
(although we might have to coordinate that with the developers of X.)</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="color140" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="color140" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="color140" value="3" />3: Neutral<br />
|
|
<input type="radio" name="color140" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="color140" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="color140" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id00881745101"><a class="toc" name="id00881745101"></a><span class="secno">60. </span>Copyfitting/auto-sizing/auto-spacing</h2>
|
|
<p>
|
|
In newspapers and in advertisements you often find titles above columns of
|
|
text that are exactly as wide as the column. That is not a coincidence. In
|
|
newspapers the effect is achieved by rewording the title until it fits, in
|
|
advertisements the font-size & letter-spacing are simply adjusted until
|
|
the text fits. CSS obviously can't do the former, but it might do the
|
|
latter.</p>
|
|
<p>
|
|
<a href="http://lists.w3.org/Archives/Member/w3c-css-wg/1998OctDec/0173.html">Håkon's
|
|
proposal</a> [<a href="http://cgi.w3.org/MemberAccess/">member-only link</a>]
|
|
introduces a property that applies to block-level elements, and that gives the
|
|
adjustment to apply (none, font-size, or letter-spacing), and the limits
|
|
within font-size or letter-spacing may be varied. The UA will try to find a
|
|
font-size or letter-spacing inside the given range so that the text exactly
|
|
fills one line. If it fails, text will be displayed normally.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="copyfitting" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="copyfitting" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="copyfitting" value="3" />3: Neutral<br />
|
|
<input type="radio" name="copyfitting" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="copyfitting" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="hsl" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id0678519722"><a class="toc" name="id0678519722"></a><span class="secno">61. </span>@page inside @media</h2>
|
|
<p>
|
|
CSS2 doesn't allow you to combine two style sheets for different media
|
|
together into one style sheet with two @media sections, if the two style
|
|
sheets have different @page rules. That could be fixed by allowing @page to
|
|
occur inside @media. See <a href="http://lists.w3.org/Archives/Public/www-style/1998Nov/0002.html">Christian
|
|
Kaufhold's e-mail</a>.</p>
|
|
<pre>@media print {
|
|
@page {size: 21cm 29.7cm}
|
|
/* ... other rules... */
|
|
}
|
|
@media projector {
|
|
@page {size: 800px 600px}
|
|
/* ... other rules... */
|
|
}</pre>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="page-in-media" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="page-in-media" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="page-in-media" value="3" />3: Neutral<br />
|
|
<input type="radio" name="page-in-media" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="page-in-media" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="page-in-media" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id1253850492"><a class="toc" name="id1253850492"></a><span class="secno">62. </span>Color profiles</h2>
|
|
<p>
|
|
When a page is displayed on a color system with limited colors (such as 256
|
|
colors), all the colors may have been used up after the first image. Text and
|
|
images from then on can only get approximate colors.</p>
|
|
<p>
|
|
Some browsers have tried to solve that problem by using a fixed palette of
|
|
colors: no matter what color you ask for, you only get the nearest color from
|
|
that palette. As a result, no image looks exactly right, but at least all
|
|
parts of the document look equally bad.</p>
|
|
<p>
|
|
One solution, suggested many years ago, is to let the author specify his own
|
|
palette at the top of the document or in the style sheet, which the browser
|
|
will then use instead of its normal one. For example, if a document uses a
|
|
lots of different browns, but no green at all, the author can provide a
|
|
palette with many more tints of brown than usual, and fewer greens.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="color-profiles" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="color-profiles" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="color-profiles" value="3" />3: Neutral<br />
|
|
<input type="radio" name="color-profiles" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="color-profiles" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="color-profiles" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id1244372485"><a class="toc" name="id1244372485"></a><span class="secno">63. </span>Underline styles</h2>
|
|
<p>
|
|
Instead of a solid line, underlines could also be dashed, dotted, doubled,
|
|
wavy, etc.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="under-styles" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="under-styles" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="under-styles" value="3" />3: Neutral<br />
|
|
<input type="radio" name="under-styles" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="under-styles" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="under-styles" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id0784490728"><a class="toc" name="id0784490728"></a><span class="secno">64. </span>Actions/behaviors mixed in with styles</h2>
|
|
<p>
|
|
The CSS syntax, in particular its selector syntax, is useful for other things
|
|
than style. It has been suggested, for example, to use it to associate scripts
|
|
with elements. See for example Netscape's <a href="../../Submission/1998/10/Overview.html">Action Sheets</a> submission.
|
|
That in itself has nothing to do with CSS.</p>
|
|
<p>
|
|
But one step further is to allow the rules that apply style to an element and
|
|
the rules that attach a script to an element to be mixed in the same style
|
|
sheet (although <em>style</em> sheet is not exactly the right name then...).
|
|
Should different "sheets" that use the CSS syntax be allowed to mix?</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="actions" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="actions" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="actions" value="3" />3: Neutral<br />
|
|
<input type="radio" name="actions" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="actions" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="actions" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id00230344912"><a class="toc" name="id00230344912"></a><span class="secno">65. </span>Comment syntax "//"</h2>
|
|
<p>
|
|
Comments in CSS are delimited by /* and */, as in C. Some people have
|
|
experimented with an additional comment syntax, that delimits comments by "//"
|
|
and the end of the line. In C++ it has proven useful to have both of them.</p>
|
|
<p>
|
|
Note: this would be a change that is not backward compatible. Although "//"
|
|
has no assigned meaning in CSS1 or CSS2, the occurrence of "//" in CSS1 and
|
|
CSS2 causes different things to be ignored than it would in a version of CSS
|
|
which uses "//" as a comment starter.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="slash-slash" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="slash-slash" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="slash-slash" value="3" />3: Neutral<br />
|
|
<input type="radio" name="slash-slash" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="slash-slash" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="slash-slash" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 id="id01638445101"><a class="toc" name="id01638445101"></a><span class="secno">66. </span>Replaced elements without an intrinsic size</h2>
|
|
<p>
|
|
CSS2 classifies certain elements (such as images) as "replaced elements" and
|
|
assumes that those elements have an intrinsic width and height. If the width
|
|
and height properties are not set in the style sheet, they are taken from the
|
|
element. However, there may be replaced elements that don't have an intrinsic
|
|
size, for example vector graphics that can be drawn at any scale. See <a href="http://www.w3.org/TR/NOTE-CSS-smil">Note.</a></p>
|
|
<p>
|
|
A future CSS may have to define how such elements are handled; at the very
|
|
least it will have to say what 'width: auto' means.</p>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="no-intrinsic-size" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="no-intrinsic-size" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="no-intrinsic-size" value="3" />3: Neutral<br />
|
|
<input type="radio" name="no-intrinsic-size" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="no-intrinsic-size" value="5" />5: Strongly in
|
|
favor<br />
|
|
or: <input type="radio" name="no-intrinsic-size" checked value="0" />I skipped
|
|
this question</p>
|
|
</div>
|
|
|
|
<h2 id="id00831989193"><a class="toc" name="id00831989193"></a><span class="secno">67. </span>Fitting replaced elements into a given space</h2>
|
|
<p>
|
|
<a href="http://www.w3.org/TR/REC-smil/">SMIL</a> has a "fit" attribute that
|
|
specifies how an object will be scaled and/or clipped to fit in a given area.
|
|
Some of its values cannot be expressed in CSS. See <a href="http://www.w3.org/TR/NOTE-CSS-smil">Note</a>. In particular:</p>
|
|
<ul>
|
|
<li>
|
|
fit="meet" in the case that both 'width' and 'height' are set, means the
|
|
object is scaled to the largest size possible within the rectangle defined by
|
|
the 'width' and 'height', while keeping its aspect ratio. Some space
|
|
above/below or left/right of the object may remain unused (filled with
|
|
background color)
|
|
</li>
|
|
<li>
|
|
fit="slice" in the case that both 'width' and 'height' are set, means that the
|
|
object is scaled to its smallest size that leaves no part of the rectangle
|
|
unoccupied, while keeping its aspect ratio. Some part of the object may fall
|
|
outside that rectangle.
|
|
</li>
|
|
</ul>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
If you want to give feedback, please tick the appropriate field:<br />
|
|
<input type="radio" name="meet-slice" value="1" />1: Strongly opposed<br />
|
|
<input type="radio" name="meet-slice" value="2" />2: Mildly opposed<br />
|
|
<input type="radio" name="meet-slice" value="3" />3: Neutral<br />
|
|
<input type="radio" name="meet-slice" value="4" />4: Mildly in favor<br />
|
|
<input type="radio" name="meet-slice" value="5" />5: Strongly in favor<br />
|
|
or: <input type="radio" name="meet-slice" checked value="0" />I skipped this
|
|
question</p>
|
|
</div>
|
|
|
|
<h2 class="no-num" id="id00897200312"><a class="toc" name="id00897200312"></a>End of form</h2>
|
|
|
|
<div class="feedback">
|
|
<p>
|
|
|
|
<input type="submit" value="Submit" />
|
|
<input type="reset" value="Reset all to 'skipped'" name="Reset" /></p>
|
|
</div>
|
|
</form>
|
|
</body>
|
|
<!-- Keep this comment at the end of the file
|
|
Local variables:
|
|
mode: sgml
|
|
sgml-declaration:"~/SGML/HTML4.decl"
|
|
sgml-default-doctype-name:"html"
|
|
sgml-minimize-attributes:t
|
|
sgml-nofill-elements:("pre" "style" "br")
|
|
sgml-live-element-indicator:t
|
|
End:
|
|
-->
|
|
</html>
|