Dashboard layout squished into very small column (lemmy.one)

submitted 1 year ago* (last edited 1 year ago) by stallmer@lemmy.one to c/homeassistant@lemmy.world

7 comments fedilink hide all child comments

I'm having an issue with the layout of my lovelace dashboard. You can see it in the image. Basically, when I first load the dashboard, it will often be squished into a tiny column.

Reloading the page does not help. I need to click over to another view and then click back.

I use Firefox as my default browser. I have uBlock Origin installed, but I'm not blocking anything on the Home Assistant page. When I've checked on Edge I don't see this issue happening. I've never seen it on the companion app either.

Any suggestions on what to check?

Lovelace dashboard squished into since tiny column

top 7 comments

sorted by: hot top controversial new old

[-] OminousOrange@lemmy.ca 4 points 1 year ago* (last edited 1 year ago)

Did you modify the yaml before it started doing this? Kind of looks like perhaps an incorrect value on a column number or width line of the grid layout card.

For example, I have the following at the top of my mobile dashboard to force one column and a certain width (though it'd probably default to this anyway).

title: Mobile views:

title: Home type: custom:grid-layout layout: max_cols: 1 grid-template-columns: 350px'

[-] stallmer@lemmy.one 2 points 1 year ago* (last edited 1 year ago)

I haven't modified the yaml. It was all set up in the UI.

If I click away from this view and then back it will display everything correctly.

Correctly displayed layout after clicking away and returning

It's a 1 column grid-card with nested horizontal-stack cards within it. If I have multiple grid cards, it will display the left-most grid correctly, and squish the others to the right until I click away and back.

Left-most grid column shown correctly, but left-most column is squished.

Thanks for replying. I haven't seen anyone else with this issue, so I'm guessing it's something to do with my specific layout. I'll have to dig further to see if maybe I accidentally edited something...

[-] OminousOrange@lemmy.ca 2 points 1 year ago

Interesting. Maybe try adding that grid-template-columns line and maybe it'll force the width and get them to spread out? Only other thing would be try clearing browser cache if you haven't already.

[-] ALERT@sh.itjust.works 3 points 1 year ago

I have the same problem!

Switching the tab back and forth fixes it.

Reproduces only on Firefox. Chrome renders OK in all scenarios.

[-] stallmer@lemmy.one 3 points 1 year ago

Hey there! Thanks for replying. Seems like it may be a Firefox issue then.

I’m out of my depth in trying to trouble shoot a browser specific issue.

Any suggestions on what to check? Maybe I should put this post somewhere more visible?

[-] ALERT@sh.itjust.works 2 points 1 year ago

Hey. I guess you could try searching and posting on the official Home Assistant forums. I haven't yet tried to search and post there, but I got a notification to spend some time on this issue this weekend. Please keep me updated, if you can. I will too.

[-] ALERT@sh.itjust.works 2 points 1 year ago

this post was submitted on 19 Sep 2023

7 points (88.9% liked)

homeassistant

11921 readers

25 users here now

Home Assistant is open source home automation that puts local control and privacy first. Powered by a worldwide community of tinkerers and DIY enthusiasts. Perfect to run on a Raspberry Pi or a local server. Available for free at home-assistant.io

founded 1 year ago

MODERATORS

GreatAlbatross@feddit.uk