v5: <sup> <sub> inconsistent styling

[misterybodon]

Context

• Booststrap Version: 5.0.0-alpha1/css/bootstrap.min.css
• Mozilla FIrefox 79.0, either locally or codepen:

CODE

<ul class='breadcrumb'>
  <li class='breadcrumb-item'>
    <sub>0</sub>H
    <sup>0</sup>
  </li>
</ul>

• Minimal working example: https://codepen.io/misterybodon/pen/gOrWqVN

Output

[mznet]

@misterybodon This problem can be occurred when the parent element has display:flex style. In your code, the parent tag li.breadcrumb-item which has sup and sub has flex style.

Under display:flex, sub and sup's baseline should be modified.

[mznet]

@misterybodon The inconsistency could be fixed if align-items-baseline class is added to the parent tag which has display: flex

[ghost]

"⁰H₀"
this may work you should try this

[ghost]

actually i am new to it ...
so what did you ask actually about the code that symbolise H or something else ...
if no please correct me

[mdo]

See #31692.