Skip to content

problem with resized card #175

Description

@Subia75

Hi
I have been using the card since 2021, but I have a problem since the latest HomeAssistant Core 2024.6.x update (I think it's from 2024.6.4).
when I use it inside a picture-elements and beyond a certain percentage of size in the card style, and it happens as seen in the image.
card

I tried both from a PC (but it does this if I reduce it to a window beyond a certain size) and from a tablet, and depending on the size of the screen beyond a certain percentage of reduction it breaks.
I've done some tests but I can't keep the card in the right square shape.

I attach the code of a simple test,
on my tablet the width percentage below 20% gives me the problem of the image above

`type: picture-elements
image: /local/floorplan/BGwhite.png
elements:

  • type: custom:stack-in-card
    mode: horizontal
    cards:
    • type: custom:tesla-style-solar-power-card
      name: []
      house_entity: sensor.powerwall_load_now
      grid_entity: sensor.tesla_card_grid_consumption
      battery_entity: sensor.tesla_card_battery_consumption
      generation_entity: sensor.powerwall_solar_now
      generation_to_grid_entity: sensor.tesla_card_grid_feed_in
      generation_to_house_entity: sensor.tesla_card_solar_consumption
      generation_to_battery_entity: sensor.tesla_card_battery_charging
      battery_to_house_entity: sensor.tesla_card_battery_consumption
      grid_to_house_entity: sensor.tesla_card_grid_consumption
      battery_extra_entity: sensor.powerwall_charge
      grid_icon: mdi:transmission-tower
      generation_icon: mdi:solar-power
      house_icon: mdi:home
      battery_icon: mdi:battery
      threshold_in_k: 1
      change_house_bubble_color_with_flow: 1
      hide_inactive_lines: 1
      show_gap: true
      style:
      top: 50%
      left: 50%
      width: 19%
      '--ha-card-background': rgba(0,0,0,0.5)
      '--ha-card-border-radius': 30px
      `

I don't know how to fix it, what can I try?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions