🔹 Layout-card - Take control of where your cards end up

Share your Projects! Dashboards & Frontend
893

With this I get them to stay within the screen, but not the offset on the rows.
Now every button is aligned, but I want some of them to occupy more rows in the grid.

894

play with the card settings

        styles:
          card:
            - margin-top: -40px
            - padding: 8px
            - height: 80%
            - border-radius: 36px 36px 6px 36px
1 Like
895

Thank you for the help!
That did the trick for now :slight_smile:

896

I have a horizontal layout card where each column is rather “min width” to fit the content inside. The problem I’m facing is that the content is aligned to the center of the layout-card HTML object.

      - type: custom:layout-card
        layout_type: custom:horizontal-layout
        layout:
          max_width: initial
          place-items: start
          card_margin: 10px
        cards: ...

This is generated:

image
image395×349 6.03 KB

I need to position the elements to the start (left) of the horizontal-layout HTML object, with the CSS object place-items: start.

There are 2 options:

  • To add the place-items: start to the horizontal-layout element
  • Or add the justify-content: start to the #columns div, which has, by default in the card, the value set to center

image
image356×332 9.98 KB

I tried with card_mod even, but I can’t make it work, because it is not a ha-card. Any advice?