Для создания макета с использованием блоков div и реализации адаптивного блока, где число и описание будут находиться на одной строке, а описание и текст будут располагаться вертикально под ними, можно использовать следующий HTML- и CSS-код:
HTML:
```html
<div class="container">
<div class="number">1</div>
<div class="description">Описание</div>
<div class="text">Текст</div>
</div>
```
CSS:
```css
.container {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.number {
width: 50%;
text-align: center;
}
.description {
width: 50%;
text-align: center;
}
.text {
width: 100%;
text-align: center;
}
```
В данном коде мы создаем родительский элемент `.container` и задаем ему свойство `display: flex` для того, чтобы его дочерние элементы выстраивались в строку. Свойство `flex-wrap: wrap` позволяет переносить дочерние элементы на новую строку при необходимости. Свойство `align-items: flex-start` выравнивает дочерние элементы по верхней границе контейнера.
Дочерние элементы `.number`, `.description` и `.text` занимают разные ширины с помощью свойства `width`. `.number` и `.description` занимают по половине ширины родительского элемента, чтобы отображаться на одной строке, а `.text` занимает всю ширину контейнера, чтобы быть расположеным под `.description`.
Теперь число и описание будут находиться на одной строке, а описание и текст будут располагаться вертикально под ними. Вы можете расширять или сужать размер родительского контейнера, чтобы увидеть адаптивность блока div.