JSFiddle - React, Tailwind, and code Playground

HTML

<span class="frac"><sup>a</sup> <span>/</span> <sub>b</sub></span> + <span class="frac"><sup>a</sup> <span>/</span> <sub>b</sub></span>

<p>Plus sign vertically aligned:</p>
<span class="frac"><sup>a</sup> <span>/</span> <sub>b</sub></span> <span style="vertical-align:10px;">+</span>  <span class="frac"><sup>a</sup> <span>/</span> <sub>b</sub></span>

CSS

span.frac {
  display: inline-block;
  text-align: center;
}
span.frac > sup {
  display: block;
  border-bottom: 1px solid;
  font: inherit;
}
span.frac > span {
  display: none;
}
span.frac > sub {
  display: block;
  font: inherit;
}