Как сделать фон у текста, и что бы фон был немного смещен вниз?

Question

https://codepen.io/noviceArtistIT/pen/bGeQpRy

 .inner {
     margin: 0px auto;
     width: 100px;
  }
 .check {
     position: relative;
     width: 100%;
     z-index: 6;

     display: flex;
     align-items: center;
 }
 .check::after{
     content:'';
     display: block;
     height: 16px;
     width: 100%;
     background-color: red;

     position: absolute;
     left: 0;

 } .check2 {
     position: absolute;
     z-index: 5;
 }

 <div class="inner">
     <div class="check">
         <h1 class="check2">Привет</h1>
     </div>
 </div>

Должно не выходить за рамки контента

Answer 1

Создать не вложенный div и подбирать ему margin top и margin left, и разумееться задать ширину высоту цвет.

Например:

#fon {
  width: 85px;
  height: 40px;
  background: rgba(202, 203, 148, 0.8);
position: absolute;
  margin-left: 455px;
  margin-top: 34px;
}

#er {
   position: absolute;
  margin-top: 9px;
  margin-left: 457px;
    
}

 <div id='fon'>
      </div>
       <div id='er'>
   <h1> privet </h1>

Если нужно фон немного сместить в низ, просто можно добавить значение к margin-top у фона

БЛОГ НА HUSL

Как сделать фон у текста, и что бы фон был немного смещен вниз?

Ответы (1 шт):