Can someone show me how to align text in the Lovelace picture-elements state-label card?
I have multiple rows and the text is being centered in this column
‘’’ LR
’ BR1
’ HALL
what I want is
LR
BR1
HALL
I’ve used the text-align: left & left; but neither makes a difference, it always seems to center.
Apologies for resurrecting an old thread, but I’ve found a solution that seems to work (thanks to villhelm and ludeeus in the HA dischord). Thought I’d post for anyone else having issues; the answer is Transform: none
I’ve discovered these by searching the forum or trial and error. Is there anything else I should know that could help?
if I use state-label or the custom:text-element, everything is aligned on the center of the object
transform: none
aligns objects by their upper left corner
max-width: 1px
aligns objects by their left edge
left: 20px
I can also align by pixels
And the last tip that is saving my sanity is using Chrome’s Developer Tools to interactively adjust values until things look right, then copying them over to my yaml files.
Exactly what I needed, thanks a lot, they key to that is overriding the tranform(50,50) with none.
Just updated the documentation for the next one running into this