Set default tab-size to 4

[Alhadis]

Right, let's face it: the default tab-width of 8 characters used by systems and terminals really doesn't cut it for the web.

When code's indented with hard tabs, they're almost always 4-characters wide, not 8. Maybe have a global stylesheet rule to set the tab-size to a sensible value?

*{
    tab-size: 4;
}

[toothbrush7777777]

That would be really helpful and useful. Most modern editors have the default tab width set to 4.

Internet Explorer (current?) does not support tab-size, but all other major browsers do. The fallback is okay; tabs are 8 spaces wide instead of 4.

Perhaps it could be applied to :root and inherited by all elements? That would allow easy overriding for an element tree.

Finally, you need to also include -moz-tab-size (Firefox 4+; Gecko 2+) and -o-tab-size (Opera 10.60 – 15).

:root {
    -moz-tab-size: 4;  /* Mozilla Firefox 4+ */
      -o-tab-size: 4;  /* Opera 10.60 – 15 */
         tab-size: 4;  /* Chrome 21+, Opera 15+, and Safari 6.1+ */
}

*, *::before, *::after {
    -moz-tab-size: inherit;
      -o-tab-size: inherit;
         tab-size: inherit;
}

[Alhadis]

Ah yeah, targeting :root would probably be preferable to making it universal (however universal I'd love to see 4-character-wide tabs being enforced...).

[toothbrush7777777]

@Alhadis What I suggested would make tabs 4 spaces wide across the whole document. The only advantage is that it allows overriding on a node and its descendants, like this:

#some-plugin-which-relies-on-8-space-tabs {
    -moz-tab-size: 8;
      -o-tab-size: 8;
         tab-size: 8;
}

That way, we can easily override it for any element tree (and it also applies to ::before and ::after).

[Alhadis]

Oh, by "universal", I mean "applied to every single element", not just inherited in the usual cascading order.

[jonathantneal]

This is a great idea. Since it’s an opinionated default, I’ve moved the discussion to csstools/sanitize.css#60

I’d like to keep browser difference fixes in Normalize.css and opinionated defaults (like box-sizing: border-box or tab-size: 4) in Sanitize.css or the component libraries of your choice.