0

How easy and any browser-compatible would it be to instead of adding 'sub' tag text that appends to a normal text as depicted in the first part of the photo add it just beneath a specified text (depicted in the second part). The whole text should behave unbroken as if in the first part. The sub text in the second part should inherit style from the sub style.

enter image description here

algorytmus
  • 953
  • 2
  • 9
  • 28

1 Answers1

1

The most promising approach can be found in this question.

You could also consider using CSS "ruby", but it may not get you all the way to where you want to go.

<div style="font-size: x-large; ">
  establishment
  <ruby style="ruby-position: under; ">
    <rb>establishment</rb>
    <rt style="transform: translateY(3em); ">establishment</rt>
  </ruby>
  establishment
</div>

Unfortunately, ruby-position has poor-to-non-existent browser support. Hence the use of transform in the above example.

Community
  • 1
  • 1
  • This is one step forward. However as you spotted yourself this is poorly supported which probably eliminates this solution. I tried different approaches but the continuity of text layout was broken. The simpler solution the better. I tried also instead of establishmentestablishment put it into a table but broke the layout as well. – algorytmus May 15 '17 at 12:37