@zaralX
Я человек, я упал с луны.

Как разместить 2 контейнера на разных сторонах?

Всем привет я новичёк в веб дизайне.

И у меня встал как я считаю простой вопрос на который я не смог найти ответа.
Сейчас наглядно обьясню.

Вот что есть:
62c5df9e4a586700376264.png
css
body {
    background-color: rgb(21, 19, 22);
}

.body-container {
    width: 90%;
    background-color: rgb(39, 39, 39);
    border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.2) 0 4px 2px -2px;
	margin: 48px auto;
}

.container-left-menu {
    width: 15%;
    background-color: rgb(255, 0, 0);
    border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.2) 0 4px 2px -2px;
	margin: 48px left;
}

.container-right {
    width: 80%;
    background-color: rgb(30, 255, 0);
    border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.2) 0 4px 2px -2px;
	margin: 48px right;
}

HTML
<!DOCTYPE html>
<html>
<head>
  <title>Welcome!</title>
  <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="body-container">
        <div class="container-left-menu">
            hello
        </div>
        <div class="container-right">
            hi
        </div>
    </div>
</body>
</html>


Я хочу сделать так что бы красная линия находилась слева а красная справа при этом на одном уровне. Если не сложно можете сказать как установить как установить высоту ещё для каждого элемента)

Должно выйти так:
62c5e0bd893e4766786979.png
  • Вопрос задан
  • 106 просмотров
Решения вопроса 1
@zaralX Автор вопроса
Я человек, я упал с луны.
и таак.
Если кто-то это ещё найдёт этот вопрос то вот ответ который вышел:

В основном контейнере display:flex
В правом элементе: margin-left: auto
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
iiiBird
@iiiBird Куратор тега CSS
Пока ты спишь - твой конкурент совершенствуется
для .body-container добавь стиль display: flex;
дальше, думаю, разберешься. ну и погугли подробнее про flex;
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы