[RbnJrg]

You can use a table, as it was appointed or, what it seems to be in the present case easier, practical and flexible, to employ the css property "display: inline-block". For example:

1. In your .xhtml file:

  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ac tellus nunc. Phasellus imperdiet leo metus, et gravida lacus. Donec metus ligula, elementum at pellentesque pellentesque, suscipit ac nunc.</p>

  <p class="notation top">15 = 3 . 5</p>

  <p class="notation">16 = 2 . 2 . 2 . 2 = 2<sup>4</sup></p>

  <p class="meaning">a fourth power</p>

  <p class="notation">17 = 17</p>

  <p class="meaning">a prime</p>

  <p class="notation bottom">18 = 2 . 3 . 3 = 2 . 3<sup>2</sup></p>

  <p>Mauris vulputate, leo ac facilisis vulputate, enim orci interdum augue, in blandit quam turpis quis dui. Morbi dictum luctus velit nec faucibus. Cras vitae tortor purus, ut tincidunt mauris.</p>

2. In your .css stylesheet:

p {
  text-indent: 1.2em;
  text-align: justify;
  font-size: 1em;
  margin: 0;
}

.notation, .meaning {
  display: inline-block;
  margin: 0.25em 1.2em;
  font-size: 1em;
  text-align: left;
  text-indent: 0; 
}

.notation {
  width: 45%;
}

.meaning {
  width: 30%;
}

sup {
  line-height: 0;
  font-size: 0.6em;
}

.top {
  margin-top: 1em;
}

.bottom {
  margin-bottom: 1em;
}

By employing this code is easier to do changes and is a more practical thing when you only need to write an expression of only one row. This is how it looks in Sigil:



Of course, is up to you to decide what to employ, if a table or inlined blocks.