Как сделать что бы 2 блока div были в обну линию, тоесть без table

Копай в сторону Flexbox или Grid

Вы можете использовать CSS для расположения двух блоков `div` на одной линии без использования таблицы. Существует несколько способов сделать это. Вот один из них с использованием CSS свойства `display: inline-block;`:

HTML:
```html
<div class="container">
<div class="block"></div>
<div class="block"></div>
</div>
```

CSS:
```css
.container {
font-size: 0; /* Используется для устранения пробелов между блоками */
}

.block {
width: 50%; /* Ширина каждого блока (может быть адаптирована по вашему усмотрению) */
height: 100px; /* Высота блока (может быть адаптирована по вашему усмотрению) */
display: inline-block; /* Устанавливаем блоки в ряд */
background-color: #ccc; /* Цвет фона блоков (может быть изменен) */
}
```

Этот код создаст два блока `div` на одной линии внутри родительского контейнера. Обратите внимание, что свойство `font-size: 0;` для контейнера используется для устранения пробелов между блоками, поскольку блоки `div` воспринимаются браузером как строчные элементы, и могут появиться небольшие пробелы из-за разрывов строк в HTML коде.

Ну раз ты открыл девтулзы, может кликнешь на родительский контейнер и посмотришь на его стили? Увидишь, что там применяется flex или grid

давал когда-то пример :
https://fairy-tales-for-you.firebaseapp.com/color-grid.html

дивы в сетке