UI columns aren't rendered correctly on page load

1

Wasn’t sure where to ask about this.

After one of the 2023 updates (perhaps since March), when loading the home page, the columns seem out of whack. This only happens in Firefox (v115.0.2) (I have also tried private window with all extensions disabled), but not in Chrome (v 114.0.5735.199). Resizing the window so that the number of columns changes seems to fix this. I have also tried clearing cache. Reloading the page, or navigating away and then back reproduces the issue. I looked in the dev console and there aren’t any messages shown there.

HA info (running on an Intel NUC):
Home Assistant 2023.7.3
Supervisor 2023.07.1
Operating System 10.3
Frontend 20230705.1 - latest

lovelace
lovelace1163×874 77.9 KB

2

Do you use the column card?

3

I am not sure, since this is the default dashboard and I have not modified it directly.

4

I meant Grid card, it’s a standard HA card

square: false
type: grid
cards:
  - type: entities
    entities:
      - sensor.1
      - sensor.2
      - sensor.3
columns: 1
5

No (unless it is a default that I haven’t come across).

6

Same issue for me! And not only for me!

image
image873×1187 74.4 KB

gotta be like this
image
image1511×1134 101 KB

7

This is still an issue with latest updates.

FF: 117.0.1 (64-bit)
Home Assistant 2023.9.2
Supervisor 2023.09.2
Operating System 10.5
Frontend 20230911.0 - latest

Even opening the dev console (which is embedded) and hovering over the body element fixes it. It seems like there is a call to adjust to screen resolution that happens at the wrong time (before loading of the page is complete) or something along those lines.

8

Seems like there was a change somewhere and one of the more recent updates (2023.11) fixed this issue for me.

9

the issue is fixed for me.