CODEWITHSUNDEEP
html
Mustafa Uçar
Mustafa Uçar

Reputation: 432

How to show subscript and upperscript at the same time?

I want to show that formula:

enter image description here

How ever generally I saw that poeople use something like that but it does not fill the bill:

θ(T-20)FPOP

Upvotes: 0

Views: 170

Answers (3)

Penny Liu
Penny Liu

Reputation: 17388

Here is one more example (based on MathJax):

window.MathJax = {
  config: ["MMLorHTML.js"],
  jax: ["input/TeX", "input/MathML", "input/AsciiMath", "output/HTML-CSS", "output/NativeMML"],
  extensions: ["tex2jax.js", "mml2jax.js", "asciimath2jax.js", "MathMenu.js", "MathZoom.js"],
  asciimath2jax: {
    delimiters: [
      ['`', '`'],
      ['$', '$']
    ]
  },
  TeX: {
    extensions: ["AMSmath.js", "AMSsymbols.js", "noErrors.js", "noUndefined.js"]
  },
  tex2jax: {
    inlineMath: [
      ['$', '$'],
      ["\\(", "\\)"]
    ],
    processEscapes: true
  }
};
.MathJax_CHTML {
  font-size: 30px !important;
}
<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
<h1> MathJax virtually aligned superscript and subscript </h1>
<p>
  $\theta^{(T-20)}_{FPON}$
</p>

Upvotes: 0

user3003238
user3003238

Reputation: 1515

Using position in css works well.

.sup-sub {
  position: relative;
}
.sup-sub > sub:nth-child(2),
.sup-sub > sup:nth-child(2) {
  position: absolute;
  left: 0;
}

.sup-sub > sub:nth-child(2) {
  bottom: -0.5em;
}
.sup-sub > sup:nth-child(2) {
  top: -0.5em;
}
<p>
  OOO
  <span class = 'sup-sub'>
    <sub>222</sub>
    <sup>2222</sup>
  </span>
</p>

<p>
  OOO
  <span class = 'sup-sub'>
    <sup>2</sup>
    <sub>222</sub>
  </span>
</p>

Upvotes: 1

user10004359
user10004359

Reputation:

You can achieve this by using a table and style it accordingly. I made an example right here.

This is how it will look in html. You give the "0" a rowspan, so it will be the size of two tablerows. Then you just add your superscripted/subscripted in single rows and voilá. 

<table>
    <tr>
      <td rowspan="2" class="row2">0</td>
      <td class="small">(T-20)</td>
    </tr>
    <tr>
      <td class="small">FPON</td>
    </tr>
</table>

Upvotes: 1

Related Questions