To arrange elements on the page, you can use moonshine::grid
and moonshine::column components.
The grid consists of 12 columns.
<x-moonshine::grid> <x-moonshine::column adaptiveColSpan="6" colSpan="6"> {{ fake()->text() }} </x-moonshine::column> <x-moonshine::column adaptiveColSpan="6" colSpan="6"> {{ fake()->text() }} </x-moonshine::column></x-moonshine::grid>
Id recusandae rerum alias voluptatem qui. Doloribus asperiores quis enim voluptatem. Et optio cupiditate blanditiis delectus.
Officia rerum odio dolor id non quia. Eligendi vitae omnis at est ipsa odio cumque blanditiis. Voluptatibus esse omnis voluptatibus rerum. Omnis distinctio consequatur sit.
adaptiveColSpan - the number of columns that the block occupies for screen sizes up to 1280px.
colSpan - the number of columns that the block occupies for screen sizes of 1280px or more.