Problem with Picture element Resize

Hi, I just finished a custom card for a solar panels system made with icons, the only problem I have are changes in size, from one device to another.

There is some way to do the re-scaling well


Mobile View:

Sample Code that i use with icons:

    - type: icon
      icon: mdi:home
        top: 46%
        left: 52%
        color: grey
        --iron-icon-height: 50px
        --iron-icon-width: 50px

You could try defining the icon sizes as percentages rather than fixed pixel sizes but I don’t think that will help. The card does not scale the icons relative to the screen size but relative to the original icon size. I gave up on the picture element card. It’s next to impossible to make it look good on a large pc screen and a small mobile one.

Thanks for answering

I have tried percentages, but the problem with which I find is that for the same icon.
I have to use different % to get the same size between them (for example the circles) And I do not know if it is normal or not doing something right, but it has no logic.

I have tried to learn about how to make a custom card because in them if rescaling works, but it is very complicated for me. I hope that these things are taken into consideration to correct in future versions