Html.Grid

import Html.Grid as Grid
import Html.Styled


view : Html.Styled.Html msg
view =
    Grid.container
        []
        [ Grid.row
            []
            [ Grid.column
                []
                [ Html.text "Hello from upper left column" ]
            , Grid.column
                []
                [ Html.text "Hello from upper right column" ]
            ]
        , Grid.row
            []
            [ Grid.column
                []
                [ Html.text "Hello from lower left column" ]
            , Grid.column
                []
                [ Html.text "Hello from lower right column" ]
            ]
        ]

container : List Style -> List (Html msg) -> Html msg

Just a container for grids. Its not necessary, but it will get you off to a good start.

-- containers are styled with the css:
--     margin: 0 auto;

row : List Style -> List (Html msg) -> Html msg

A row in a grid

-- rows are styled with the css:
--     display: flex;
--     flex-direction: row;

column : List Style -> List (Html msg) -> Html msg

A column in a grid

-- columns are styled with the css:
--     flex-basis: 100%;
--     flex: 1;
--     display: flex;

Modules

Html.Grid

Chadtech/elm-css-grid/1.0.0

Html.Grid

Modules