From bd5a00c61b355c857b5c99323592ca432dea5d0a Mon Sep 17 00:00:00 2001 From: Mitchell Riedstra Date: Fri, 5 Jan 2024 23:18:49 -0500 Subject: wip --- htmx/static/pico-1.5.11/docs/grid.html | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 htmx/static/pico-1.5.11/docs/grid.html (limited to 'htmx/static/pico-1.5.11/docs/grid.html') diff --git a/htmx/static/pico-1.5.11/docs/grid.html b/htmx/static/pico-1.5.11/docs/grid.html new file mode 100644 index 0000000..13bf018 --- /dev/null +++ b/htmx/static/pico-1.5.11/docs/grid.html @@ -0,0 +1,6 @@ +Grid • Pico CSS

Grid

.grid enable a minimal grid system with auto-layout columns.

1
2
3
4
<div class="grid">
+  <div>1</div>
+  <div>2</div>
+  <div>3</div>
+  <div>4</div>
+</div>

Columns intentionally collapses below large devices (992px)

To go further, discover how to merge Pico with the Bootstrap grid system.

 More about grids

As Pico focuses on native HTML elements, we kept this grid system very minimalist.

A complete grid system in flexbox, with all the ordering, offsetting and, breakpoints utilities, can be heavier than the total size of the Pico library. Not really in the Pico spirit.

If you need a quick way to prototyping or build a complex layout, you can look at Flexbox grid layouts. For example, Bootstrap Grid System only or Flexbox Grid.

If you need a light and custom grid, you can look at CSS Grid Generators. For example, CSS Grid Generator, Layoutit! or Griddy.

Alternatively, you can learn about CSS Grid.

Code licensed MIT

\ No newline at end of file -- cgit v1.2.3