[whatwg] @font-face rules in <style scoped>

Roland Steiner rolandsteiner at chromium.org
Thu Nov 17 20:58:25 PST 2011


Hi all,

When thinking about implementation details of @font-face rules in <style
scoped>, I started to wonder whether a (nested) scoped style-sheet should
be able to create a new - or even override an existing - a font-family
declared in an outside scope. To give examples:

Defining a font-family locally that is selected by a rule in the global
scope, but doesn't exist there:

    <style>
        .foo {
            font-face: foo;
        }
    </style>

    <div style="font-family: Arial">
        <style scoped>
            @font-face {
                font-family: foo;
                src: local(Times);
            }
        </style>
        <span> Arial or Times? </span>
    </div>

Overriding a font-family of an outer scope:

    <div style="font-family: Arial">
        <style scoped>
            @font-face {
                font-family: foo;
                src: local(Courier);
            }
            .foo {
                font-face: foo;
            }
        </style>
        <div>
            <style scoped>
                @font-face {
                    font-family: foo;
                    src: local(Times);
                }
            </style>
            <span class="foo"> Arial, Courier or Times? </span>
        </div>
    </div>

Technically I believe it should be 'Times' in both cases, given the
overriding rule of @font-face. However, I wonder if this isn't going
against the intent of <style scoped> a bit (?).


- Roland


More information about the whatwg mailing list