Проблема стиля HTML при использовании <sup> и <sub>

Question

Я заметил, что при попытке использовать верхний или нижний индекс следующим образом...

<ul>
<li><b>Mean Radius</b>      6,371.0 km</li>
<li><b>Mean Circumference</b>   40,041.47 km</li>
<li><b>Surface Area</b>     510,072,000 km<sup>2</sup></li>
<li><b>Volume</b>       1.0832073 &times; 10<sup>12</sup> km<sup>3</sup></li>
<li><b>Mass</b>         5.9736 &times; 10<sup>24</sup> kg</li>
<li><b>Mean Density</b>     5.5153 g/cm<sup>3</sup></li>
<li><b>Axial Tilt</b>       23.439281&deg;</li>
</ul>

В итоге происходит то, что высота всей строки настраивается для надстрочного или подписного текста, а текст слева, выделенный жирным шрифтом, центрируется по вертикали в этой строке. Это делает выделенный жирным шрифтом текст немного странным, поскольку кажется, что он плавает немного выше нижней части строки и не выровнен с другим текстом. Я попытался увеличить высоту строки в CSS, но это только делает эффект более заметным. Выравнивание по вертикали также, похоже, ничего не делает. Так что у меня сейчас немного идей.

Кто-нибудь знает, как печатать весь текст в строке (независимо от высоты строки, нижнего индекса, верхнего индекса и т. Д.) В нижней части этой строки?

PS - Я видел это на Chrome 6 и Firefox 3.6.9, и это происходит в обоих случаях, поэтому я предполагаю, что это универсальная проблема, а не проблема браузера. Я также заметил, что текст всегда, кажется, центрирует себя вертикально в строке независимо от высоты строки, поэтому, очевидно, возникает проблема, заключающаяся в том, что строка текста с верхним индексом занимает больше "высоты", чем строка текста без центрирования. не будет соответствовать другой линии.

Answer 1

Да, это универсальная проблема; связанные с тем, как типография работает в целом.

Для этого мало что можно сделать; но с полями и набивками и всякими другими хиппи-вещами вы сможете победить эффект. Другой (исключительно) грязный хак заключается в добавлении некоторых невидимых символов к югу от / надстрочного знака в каждой строке, расставляя строки так, чтобы эффект стал менее заметным.

Также;

Кто-нибудь знает, как печатать весь текст в строке (независимо от высоты строки, нижнего индекса, верхнего индекса и т. Д.) Внизу этой строки?

Этот бит не имеет смысла: если вы хотите, чтобы они были в нижней части строки, не ставьте надстрочный индекс!

Альтернатива: не используйте sub / super; используйте настоящие символы: 10²⁴; они доступны начиная с U+2070; до U+2094, а также до U+B2; U+B3, но в зависимости от шрифта они могут выглядеть довольно шатко.

Альтернатива расширенная: если вы можете уйти с компьютерной нотации (в стиле E+24) для показателей; есть односимвольные вещи для таких вещей, как ㎢, ㎨ и т. п. (объем и среднее гравитационное ускорение соответственно), эти композиты начинаются с U+3380; но опять же, они могут выглядеть как шаткие (или вообще не присутствовать).