Как правильно сделать отступ для объектов в html?

Question

[Maxim Plotnikov]

Доброй ночи всем, но мне нужна помощь)
У меня есть два блока (скрин ниже)

Как мне их разместить на одной горизонтальной оси, что бы было примерно так? (скрин ниже)

Код css для этих блоков ниже, где board_center большой блок, а board_right меньший блок.

#board_center {
    height: 750px;
    width: 54%;
    background: black;
    border-radius: 20px;
    margin: 3.8%;
}

#board_right {
   height: 750px;
    width: 16.8%;
    background: black;
    border-radius: 20px;
    margin: 2.5%;
}

Заранее спасибо :()

Comments

[Михаил]

флексы

[Maxim Plotnikov]

Михаил, эм?

[Михаил]

Maxim Plotnikov, google > flexbox

[Maxim Plotnikov]

Михаил, ny vse css i teby zaflexyl )

[html-css]

Maxim Plotnikov, grid forever

Answer 1

[html-css]

GRID forever
https://codepen.io/natojezlo/pen/LYVZENm

Answer 2

[Andrey Vasilev]

https://codepen.io/Nolis/pen/oNXLgPJ
почистил отступы. margin: (значение) даёт отступ со всем сторон, если нужнен конкретный отступ, то лучше используй margin-left/right/top/bottom.

Comments

[Andrey Vasilev]

Xdevelx, это всё его отступы, может для него принципиально?

[Andrey Vasilev]

Xdevelx, в 1% случаев юзаю % в padding и margin

Answer 3

[Karpion]

Я бы сделал это таблицей:

<TABLE><TR>
	<TD>левый узкий блок</TD>
	<TD>правый широкий блок</TD>
</TR></TABLE>

Comments

[Andrey Vasilev]

Боже упаси

[Karpion]

Andrey Vasilev, Что Вам не нравится?

[Andrey Vasilev]

Karpion, это код из 2010?
кто сейчас таблицами верстает?

[Karpion]

Вы ошибаетесь - это код конца 199*-х. И он отлично работает; не надо юзать новомодные глюкавые вещи, если есть старая надёжная вещь, делающая то же самое.

Answer 4

[Stasonuke]

Просто используй flexbox