Related: T86366

This task was topic in today's Front-end-Standards-Group meeting, with comments by @Esanders, @Catrope, @Jdlrobson and @Jdrewniak.
We've been discussing different approaches in the tension between making development clearer and easier by using one box-sizing declaration of widgets (as in .oo-ui-widget * {}) vs. running into possible conflicts with injected third party libraries/code and having to play the specificity game*.
Comments from the discussion:

@Esanders 11:15 AM
Yes - I would vote strongly against the widget > * selector suggested

As it might interact with 3rd party code, which we have no control over.
Which interfaces would be affected by:

@Catrope 11:16 AM
Widgets like, say, VisualEditor surfaces
Specificity problem: .oo-ui-widget * { box-sizing: border-box; } .ve-surface * { box-sizing: content-box; } but now .thing-inside-ve-surface { box-sizing: border-box; } loses on specificity

I would like to challenge the idea for a UI library not to have a general box-sizing approach, but to define border-box for every new widget again results in confusion and inconsistency (see my table above) throughout widgets.
*The specificity game is handleable, as the star selector has a specificity of 0, 0, 0, 0. It means when the dev injecting other code is overriding the widget general box-sizing with ve-surface *, .thing-inside-ve-surface { box-sizing: border-box; } would still be applied. See also https://codepen.io/Volker_E/pen/dpKRpR

Change 359892 had a related patch set uploaded (by Srishakatux; owner: Srishakatux):
[oojs/ui@master] IconElement: Switch box-sizing to border-box

https://gerrit.wikimedia.org/r/359892

Change 359894 had a related patch set uploaded (by Srishakatux; owner: Srishakatux):
[oojs/ui@master] LabelElement: Switch box-sizing to border-box

https://gerrit.wikimedia.org/r/359894

Change 359895 had a related patch set uploaded (by Srishakatux; owner: Srishakatux):
[oojs/ui@master] IndicatorElement: Switch box-sizing to border-box

https://gerrit.wikimedia.org/r/359895

To make the path forward clearer, for all Elements we're going to add element specific

.element, 
.element > * {
    box-sizing: border-box;
}

in the beginning and when the nesting issue with PopupButtonWidget/ButtonElement is resolved, we should generalize this rule
to .theme-oo-ui-element () {} in a follow-up patch.

Change 378361 had a related patch set uploaded (by VolkerE; owner: VolkerE):
[oojs/ui@master] Make box-sizing: border-box the default on wigets

https://gerrit.wikimedia.org/r/378361

Change 380546 had a related patch set uploaded (by VolkerE; owner: VolkerE):
[oojs/ui@master] [WIP] WikimediaUI theme: Unify padding and distances on tools and menus

https://gerrit.wikimedia.org/r/380546

Change 380546 merged by jenkins-bot:
[oojs/ui@master] WikimediaUI theme: Unify positioning and sizing of tools and menus

https://gerrit.wikimedia.org/r/380546

Change 359894 merged by jenkins-bot:
[oojs/ui@master] LabelElement: Switch box-sizing to border-box

https://gerrit.wikimedia.org/r/359894

[not a Tracking-Neverending bug per definition; maybe Epic or such was meant?]

@Aklapper Thanks, yes!

Change 359892 abandoned by Thiemo Kreuz (WMDE):
[oojs/ui@master] IconElement: Switch box-sizing to border-box

Reason:
4 years old. It doesn't look like this file even exists any more.

https://gerrit.wikimedia.org/r/359892

Change 359895 abandoned by Thiemo Kreuz (WMDE):
[oojs/ui@master] IndicatorElement: Switch box-sizing to border-box

Reason:
4 years old. It doesn't look like this file even exists any more.

https://gerrit.wikimedia.org/r/359895

Change 378361 abandoned by VolkerE:

[oojs/ui@master] Make `box-sizing: border-box` default on widgets

Reason:

Not continuing on this in any foreseeable time.

https://gerrit.wikimedia.org/r/378361