How to place an underscore in line with the text that is not underlined?

<h1>ТЕКСТ<u>ТЕКСТ</u></h1>

Example

Example

  • Do you mean to make the text crossed horizontally in the middle? - user218976
  • @Anamnian No, you need the underline to be slightly higher, at the level of the text that is not underlined. - Evg
  • Attach a picture of how the final result should look. - Sasha Omelchenko
  • @SashaOmelchenko Attached. - Evg
  • Your picture clearly uses different fonts and sizes for parts of the text. In this direction, and you need to move. - user218976

2 answers 2

In three browsers checked - the same

 * { margin: 0; padding: 0; } p { text-transform: uppercase; display: inline-block; font-weight: 900; text-align: left; color: orange; } i { display: inline-block; font-style: normal; text-decoration: underline; font-size: 90%; margin-left: -4px; margin-top: 1px; vertical-align: top; color: black; } 
 <p>snc <i>group</i></p> 

     h1 { margin: 0; } h1 u { text-decoration: none; position: relative; } h1 u:after { content: ''; position: absolute; left: 0; bottom: 4px; width: 100%; height: 3px; background: #000; } 
     <h1>ТЕКСТ<u>ТЕКСТ</u></h1>