包装行中的elm-ui中心元素

问题描述 投票:2回答:1

我正在将Elm与mdgriffiths / elm-ui一起使用,我真的很喜欢它。现在,我正在尝试创建居中的,环绕的元素行:

enter image description here

我可以说到这里:

enter image description here

使用此代码:

button : String -> String -> Element Msg
button label url =
    link
        [ height (px 150)
        , width (px 150)
        , Border.width 1
        , Background.color (rgb255 255 255 255)
        ]
        { url = url
        , label =
            Element.paragraph
                [ Font.center ]
                [ textEl [] label ]
        }


row : Element Msg
row =
    Element.wrappedRow
        [ Element.spacing 25
        , Element.centerX
        , Element.centerY
        , width (fill |> Element.maximum 600)
        , Font.center
        ]
        [ button "A" "/a"
        , button "B" "/b"
        , button "C" "/c"
        , button "D" "/d"
        ]

但是当我尝试将Element.centerX添加到这样的按钮中时>]

link
    [ Element.centerX
    , ...
    ]

我得到了这个:

enter image description here

我也尝试了Font.center,但没有成功,我不知道还能尝试什么。

我不确定是否丢失了我应该使用的东西,或者是否需要重新排列整个东西,或者是否只需要使用内置CSS东西。

更新:

与我看到的问题链接到Ellie。

https://ellie-app.com/7NpM6SPfhLHa1

我正在将Elm与mdgriffiths / elm-ui一起使用,我真的很喜欢它。现在,我正在尝试创建居中的,环绕的元素行:到此为止:使用此代码:button:...

elm elm-ui
1个回答
0
投票

Github issue对于此问题很有用。恐怕您将不得不使用一些CSS(除非我丢失了某些东西)。我之前在elm-ui中找到了这个。有时它无法完全满足您的要求,并且需要一些CSS。

© www.soinside.com 2019 - 2024. All rights reserved.