Как мне выровнять элементы так, чтобы они находились заподлицо между началом логотипа и концом ссылок? ⇐ CSS

[Anonymous]

Привет всем, я уже несколько дней пытаюсь понять, как выровнять свой код. Я бы хотел, чтобы мой HTML-код после заголовка находился между моим логотипом и ссылками. Цель состоит в том, чтобы не использовать отступы, поскольку после определенного размера экрана я хотел бы сохранить тот же макет.
Я пробовал использовать выравнивание пространства вокруг содержимого в своем гибком классе, но это не помогло. расстановка. Я попытался задать ширину div в моем гибком классе и поигрался с другими значениями, но это не помогло. Я ценю любую помощь, заранее спасибо.

Код: Выделить всё

body {
padding: 0;
margin: 0;
}

.section-one {
background-color: blue;
color: white;
padding: 50px 0;
}

.header {
display: flex;
justify-content: space-around;
padding: 0 0 50px 0;
}

ul {
display: flex;
gap: 1rem;
margin: 0;
list-style: none;
}

.flex {
display: flex;
gap: 20px;
}

.column,
.placeholder-image {
flex: 1;
flex-direction: column;
border: 5px solid;
}

Код: Выделить всё

LOGO

[list]
[*]
link one
[*]
link two
[*]
link three

[/list]





This website is awesome

Lorem ipsum, dolor sit amet elit. Laboriosam, eum blanditiis porro ad animi aliquam, quisquam dolore nisi eaque sit explicabo laborum voluptatibus.

sign up

This is a place holder for an image

Подробнее здесь: https://stackoverflow.com/questions/787 ... -end-of-my