Picture-element and camera_image size issue

Share your Projects! Dashboards & Frontend
1

Hi all,

I’m trying to use the picture-elements card with an camera feed as image element. The height of the card is bigger than the camera feed, is that fixable so the card will fit the camera feed?

As background I make use of an orange pixel (pixel.png)

48
48520×511 72.3 KB

- icon: mdi:cctv
    id: cctv
    cards:
      - type: picture-elements
        image: /local/lovelace/pixel.png
        elements:
          - type: image
            entity: camera.cam_lise
            camera_image: camera.cam_lise
            tap_action: more-info
            style:
              top: 0
              right: 0
              transform: initial
              line-height: 32px
              padding: 0
              margin: 0
          - type: state-label
            entity: sensor.netatmo_slaapkamer_lise_temperature
            style:
              bottom: 0
              left: 0
              line-height: 32px
              color: white
              background-color: rgba(0, 0, 0, 0.3)
              width: 100%
              transform: initial
              padding: 0 8px
2

what size is your pixel.png image? I use a dummy image with 16:9 ratio and it works fine.

1 Like
3

Many thanks, the 16:9 ratio did the trick! :smile: :+1:

I used a pixel of 1x1px