Вертикально выровнять отдельные текстовые символы в Word или Sentence

Question

Я использую логотип, основанный на строках и текстах. Я хочу включить вариант этого в свой веб-сайт, но создаю логотип из CSS.

Я пытаюсь получить «Т - С О Н» в виде одной строки, но с «о» вертикально по центру между «S» и «N», как в приведенном выше логотипом.

Я очень новичок в CSS и изо всех сил пытался получить что-либо, чтобы работать до сих пор. Я предполагаю, что стол - это путь, но я не знаю, как это сделать.

Большое спасибо

Answer 1

Согласен с @mbync. Это самый простой и лучший способ сделать это. Если кто еще заинтересован в том, как сделать, чтобы это в таблице Кстати, здесь

<table> 
 
    <tbody> 
 
    <tr style="height: 25px;"> 
 
     <td>S</td> 
 
     <td style="vertical-align: initial;">o</td> 
 
     <td>N</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 2

, если вы хотите, чтобы убедиться, что текст не остается на той же линии, независимо от того, что, используйте:

div#logo { 
white-space: nowrap; 
overflow: hidden; 
} 

Это сделает всю строку текста одной строкой и не позволит ей перейти на следующую строку, когда текст заканчивается из комнаты в div, «переполнение: скрыто»; свойство приведет к исчезновению текста, если он выходит из комнаты, а не выходит за пределы div.

Если вы хотите вертикального выравнивания текста используйте:

div#logo { 
line-height: 100px; /* play around with this value */ 
} 

высота строки мой любимый способ вертикального выравнивания текста, потому что он дает мне полный контроль над ним, и это, кажется, вызывает наименьшее количество проблем ,