Conditional card leaving space in GUI

I have three cards in a vertical ‘custom:stack-in-card’ in this order- entities, conditional, entities. I fixed my extra space issue by installing card-mod. Then, I just insert this in the first entites card.

style: |
  .card-content {
      padding-bottom: 2px;
  }

And in the last entites card:

style: |
  .card-content {
      padding-top: 2px;
  }

1 Like

I would guess this happens, because the conditional card is part of a display: grid; parent. It might be solvable by using custom:mod-card and make the display: grid; parent a display: flex; one…

Yep, unfortunately never fixed.

Please create a ticket in GH, so they can track and create a fix.

Still experiencing this issue. Showing additional padding when the conditional card is not present.

This thread really got off on a tangent there for a little bit. I’m still experiencing this issue. Anyone find a workaround?

You reminded me about this. I might try with the new Sections Dashboard and see if that is immune to the issue.

It’s happening to me in the new sections dashboard. i even tried using card mod to set the height to 0px based on conditions. still have a huge gap. going to play with it more tomorrow

yup still looking for resolution, even with the new sections dashboard.

The latest version of home assistant using the new “visible” tab seems to do the trick for me. I’m still using my conditional cards inside of another vertical stack (don’t know if that’s necessary, just being lazy). Once I set up my same conditions on the “visible” tab it removes the space when the conditions aren’t met

1 Like

Please note that in current version of HA (2024.8.2) “visible” tab is not shown in UI for cards inside nested cards (e.g. horizontal and vertical stack). However, you can directly modify the YAML to include visibility support. I assume UI configuration of visibility inside nested cards will be fixed in future release of HA.

Good callout, if it helps this is the syntax on adding directly to YAML for nested cards

visibility:
  - condition: state
    entity: binary_sensor.timer_going
    state: 'on'
  - condition: state
    entity: binary_sensor.show_traeger_on_dashboard
    state: 'off'

you can also use state_not

1 Like