Sections and custom-button card

Configuration Frontend
1

Hi,

I’m using the custom-button card ( GitHub - custom-cards/button-card: :sparkle: Lovelace button-card for home assistant) for my frontend. Works like a charm.
BUT, I cannot make it fit in the new sections - it seems like it does not automatically scale to the sections. Also happens on resizing screen.
Simple questions:

  1. Am I “holding it wrong” or doesn’t the custom card support the new Sections type of layout?
  2. Is there another way to create these kind of buttons which will work better with Sections?
    Example:
    image
    Notice the “Enable active cooling card”; it is too wide. I know I can set the width to X pixels, but then it’s not scalable if I resize or view it on my mobile app…
2

Same problem here, I’m using custom button-card in sections, take a look at the following example, the first is the original size, the second and third I changed with

styles:
  card:
    - height: 100px
    - width: 200px

grafik
grafik1201×469 22.4 KB

If I do it for all 3 - still the rendered size stays the same, the sections layout will not adapt and I have huge empty spaces in there - don’t know what to change!

3

Unclear what you want to achieve.

  1. Sections may contain several cards. Each card is located in a “cell”. For each card you may define a size of a “cell” (rows, columns).
  2. Whether a card occupies a whole cell or leaves an empty space - depends on a card. Some custom cards may not have smth like “height: 100%” which makes them to occupy just a part of a vertical size. Can be fixed by card-mod.
4

Thanks for the reply, @Ildar_Gabdullin

What I want to achieve is for the card to fill out the “cell” and also be responsive in terms of scalability when the layout changes.
You say, I can do this with a “card-mod” - how to do so?

5

Go to the main card-card thread - 1st post - link at the bottom titled “fantastic” - button-card in sections.
Use this as a starting point.