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>
Tempora qui est quas sunt qui et et. Velit ea omnis fuga rerum ut magni quisquam.
Occaecati possimus rem quo eveniet nihil consectetur hic. Velit alias distinctio repellat maxime ut blanditiis. In est nobis ipsam qui omnis et sunt ex.
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.