Quantcast
Viewing all articles
Browse latest Browse all 1315

How do I make the header into two lines and the logo to the right of the first line?

I've been trying to create a site header with the site name on 2 lines and its logo on the first line. I've tried both CSS Grid and Flex, but in this case I have to do it only through absolute, which will make the site not adaptive and not scalable.

.header.main {  margin-top: 10%;}.site-title {  display: flex;}.big-logo {  float: right;  margin-left: 300px;  width: 141px;  height: 136px;  max-width: 100%;  height: auto;}.graficlogo {  width: 100%;  height: auto;  object-fit: contain;}h1.main-title {  position: relative;  font-family: 'Neue Machina';  font-style: normal;  font-weight: 800;  font-size: 128px;  line-height: 95.36px;  color: #EDFB3A;}p {  font-family: 'Montserrat';  font-style: normal;  font-weight: 400;  font-size: 16px;  line-height: 100%;  text-transform: lowercase;  color: #FFFFFF;}
<div class="header main"><div class="site-title"><div class="big-logo"><img class="graficlogo" src="assets/img/Logo.png" alt="Logo"></div><h1 class="main-title">мои<br> достижения</h1></div><p>онлайн-платформацентрализациидостиженийиразвитияактивнойдеятельности</p></div>

Вотто, чтополучилось:логотипнаходитсяслеваисдвигаетнадпись

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


Viewing all articles
Browse latest Browse all 1315

Trending Articles