[whatwg] Sections, headers, and styling

[Tab Atkins Jr.]

On Tue, Nov 11, 2008 at 5:33 PM, Eduard Pascual <herenvardo at gmail.com>wrote:

> It is a quite common practice on current web pages to style the h1..h6
> elements to have them blend properly with the overall style of a site.
> For HTML4/XHTML1 documents this is quite trivial; but with HTML5 the
> "number part" of the heading element doesn't reliably define the
> actual heading level anymore (specially when dealing with server-side
> includes and / or user-provided content). I have tried to figure out
> some CSS selectors to handle this task with HTML 5 documents and they
> go completely crazy before getting anywhere near to being accurate:
> there is an insane ammount of element-nesting combinations to keep
> track of. Is there any sane way to deal with this basic need?
>

Generally you want to decide if you're going to use the numbered range, or
just <h1>.

If the former, just work it like you always would.  If the latter, you have
to do something like "h1 ~ section h1" to match what would otherwise be an
h2.  This will also match deeper headings, of course, so you want to put in
the h3-equivalent selector as well, and possibly further.

However, this is an interesting problem in general, that is perhaps best
served by CSS itself.  Perhaps something like a :heading(n) pseudoclass,
which'll match headings of the given level.  What qualifies as a heading,
and how they nest and change levels, would be up to the markup language
(html5 in this case).  Vanilla html4 would just naively report <h1> as
matching :heading(1), <h2> as matching :heading(2), etc.  Html5 would match
according to the heading-depth algorithm, and take into account both the
<hn> number and the depth within <section>s.

~TJ
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/whatwg-whatwg.org/attachments/20081111/66bca01a/attachment.htm>