My whole Floorplan is a button

Configuration
1

Hi There, I have configured my floorplan. The problem is, that wherever I click, i see a status about one of my switches (switch.spot_steckdose)
Hope you can figure out why:

type: picture-elements
image: local/images/floorplan/Alles Dunkel.png
elements:
  - type: image
    entity: device_tracker.corona_corolla_parking_location
    style:
      left: 59%
      top: 24%
      width: 24%
    state_image:
      home: /local/images/floorplan/corolla_1.png
      not_home: /local/images/floorplan/transparent.png
  - type: image
    entity: light.stube_led
    style:
      left: 50%
      top: 50%
      width: 100%
    state_image:
      'on': /local/images/floorplan/stube_led_100.png
      'off': /local/images/floorplan/transparent.png
  - type: image
    entity: switch.spot_steckdose
    style:
      left: 50%
      top: 50%
      width: 100%
    state_image:
      'on': /local/images/floorplan/stube_spot_100.png
      'off': /local/images/floorplan/transparent.png
  - type: conditional
    conditions:
      - entity: light.stube_led
        state: 'on'
      - entity: switch.spot_steckdose
        state: 'on'
    elements:
      - type: image
        image: /local/images/floorplan/stube_ledspot_100.png
        style:
          left: 50%
          top: 50%
          width: 100%
  - type: state-icon
    entity: switch.aquarium
    style:
      left: 43%
      top: 60%
    tap_action:
      action: toggle
  - type: state-icon
    entity: switch.mi_air_purifier_3c_air_purifier_physical_controls_locked
    style:
      left: 66%
      top: 80%
    tap_action:
      action: toggle
  - type: state-icon
    entity: light.stube_led
    style:
      left: 20%
      top: 85%
    tap_action:
      action: toggle
  - type: state-icon
    entity: switch.spot_steckdose
    style:
      left: 43%
      top: 75%
    tap_action:
      action: toggle
  - type: state-label
    entity: sensor.heizkorperthermostat_temperature
    style:
      top: 90%
      left: 33%
      color: '#000'
      border-radius: 50%
      text-align: center
      background-color: 'rgba(255, 255, 255, 0.3)'
      font-size: 11px
      font-weight: bold
  - type: state-label
    entity: sensor.heizkorperthermostat_temperature_2
    style:
      top: 97%
      left: 71%
      color: '#000'
      border-radius: 50%
      text-align: center
      background-color: 'rgba(255, 255, 255, 0.3)'
      font-size: 11px
      font-weight: bold
  - type: state-label
    entity: sensor.yumis_heizung_temperature
    style:
      top: 93%
      left: 53%
      color: '#000'
      border-radius: 50%
      text-align: center
      background-color: 'rgba(255, 255, 255, 0.3)'
      font-size: 11px
      font-weight: bold
  - type: state-label
    entity: device_tracker.corona_corolla_parking_location
    style:
      top: 21%
      left: 53%
      color: '#000'
      border-radius: 69%
      text-align: center
      background-color: 'rgba(255, 255, 255, 0.3)'
      font-size: 11px
      font-weight: bold
    tap_action:
      action: more-info
2

Try to add the padding to the tap action.

I am using custom buttons for my lights and 12px work just fine for me.

style:
      top: 63%
      left: 78%
      width: 10%
      padding: 12px

And…I see you’re using “Stube” so you are a man of (northern German) culture. :ok_hand:t3:

3

Thanks! tap-action: none works for me…

indeed. More northern-east (saxony anhalt)

4

You’ve to add it for every button you show on your floorplan I guess. I found it out the hard way myself.

My button images overlapped the others so only the last image reacted to the tapping so I reduced the padding to every image.
You should see the almost transparent frame around the image to guide you.

Better than nothing. :face_with_hand_over_mouth: