legno-ui (v4.4.0)

# LegnoGridRow

INFO

See LegnoGridCol for examples of how to define grid columns.

# Examples

# Testing and Debugging

Use the highlight and example properties for quick testing or debugging.

The highlight property adds a background color to all columns.

1
2
3

    The example property adds a visible content block inside each column.

    1
    2
    3

      # Nested Grids

      Nest grids inside grids.

      1
      2
      3
      4

        # Alignment

        Align elements to the start or end of a row as well as the top, bottom, or center of a column.

        start
        center
        end

          Here is an example of using the modifiers in conjunction to acheive different alignment at different viewport sizes (resize window to see changes).

            top
            middle
            bottom

              # Distribution

              Distribute the contents of a row or column.

              around
              around
              around
                between
                between
                between

                  # Reversing

                  Reverse columns.

                  1
                  2
                  3
                  4

                    # Slots

                    ...

                    # Props

                    ...

                    ← LegnoHeader →