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>
Вотто, чтополучилось:логотипнаходитсяслеваисдвигаетнадпись
Вотто, чтоожидалось:логотипнаходитсясправаотпервойстрокизаголовкаинемешаетотображениюнадписи