позиционирования элементов на странице CSS

Question

Я хочу, чтобы создать заголовок страницы следующим образом:

но то, что я получаю с моей фиктивными CSS-правила:

Я в основном разработчик бэкенд, но Я хочу погрузиться в CSS и HTML, вот мой Html struct, и вот мои Css rules, так может кто-нибудь объяснить мне, как мне нужно правильно разместить эти элементы. Благодаря!

Answer 1

Вы можете разместить свой флаг абсолютно и установить сверху, слева, справа, снизу свойства. Абсолютные позиционируемые элементы удаляются из естественного потока документа и их можно выровнять где вы хотите, установив их слева, сверху, справа, снизу Свойства

Пример

<div class="box"> 

    <div class="inner-box"> 
    <p>dummy content</p> 
    </div> 

</div> 

Css

.box { 
    position: relative; 
} 

.inner-box { 
    position: absolute; 
    top: 20px; 
    left: 50px; 
} 

Answer 2

margin: 20px auto; 

Регулировка полей также может помочь вам позиционировать вещи, а второе значение чрезвычайно полезно для центра s.