I’ve been using thomasloven’s layout-card for a long time now. But I was making some changes to my card contents, shuffled my rooms around, and now all cards are in one column. I don’t understand why, or how to prevent this?
Running HAOS versions:
- Core2025.1.2
- Supervisor2025.03.4
- Operating System14.1
- Frontend20250109.0
It looks like this, and obviously, shouldn’t:
My dashboard code:
title: Home
views:
- icon: mdi:home
title: Main
path: main
type: custom:masonry-layout
layout:
width: 300
max_cols: 6
badges: []
cards:
- type: vertical-stack
title: Utility & Garage
cards:
- type: custom:simple-thermostat
entity: climate.utility_room_climate
layout:
step: row
header: false
control: false
sensors:
- entity: sensor.hallway_climate_humidity
name: Humidity
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.utility_room_left
icon: mdi:ceiling-light-multiple
name: Ceiling
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: light.utility_units
icon: mdi:countertop
name: Units
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.garage_lights
icon: mdi:garage
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: cover.garage_door
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: script.open_garage
icon_height: 75px
icon: mdi:arrow-up-bold
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: script.close_garage
icon: mdi:arrow-down-bold
icon_height: 75px
- type: horizontal-stack
cards:
- type: gauge
entity: sensor.washing_machine_power
max: 3200
min: 3
- type: gauge
entity: sensor.tumble_dryer_power
max: 3200
min: 0
- type: entity
entity: binary_sensor.mouse_trap_contact
name: Mouse Trap
icon: mdi:rodent
- type: entity
entity: binary_sensor.mouse_trap_2_contact
name: Mouse Trap 2
icon: mdi:rodent
- type: vertical-stack
title: Master Bedroom
cards:
- type: custom:simple-thermostat
entity: climate.bedroom_climate
layout:
step: row
header: false
control: false
sensors:
- entity: sensor.hallway_climate_humidity
name: Humidity
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.bedroom_ceiling_left
icon_height: 75px
name: Ceiling Light
icon: mdi:ceiling-light
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: light.bedroom_lamps
name: Bedside Lamps
icon_height: 75px
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: light.left_bedside_lamp
icon_height: 75px
name: Teresa Lamp
icon: mdi:lightbulb-outline
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: light.right_bedside_lamp
icon_height: 75px
icon: mdi:lightbulb-outline
name: Wayne Lamp
- type: horizontal-stack
cards: []
- type: vertical-stack
title: Hallway
cards:
- type: custom:simple-thermostat
entity: climate.hallway_climate
layout:
step: row
header: false
control: false
sensors:
- entity: sensor.hallway_climate_humidity
name: Humidity
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.downstairs_hallway_left
name: Downstairs
icon: hass:ceiling-light
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.upstairs_hallway_left
name: Upstairs
icon: hass:ceiling-light
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.porch_left
name: Porch Interior
- type: vertical-stack
title: Small Office
cards:
- type: custom:simple-thermostat
entity: climate.small_office_climate
layout:
step: row
header: false
control: false
sensors:
- entity: sensor.hallway_climate_humidity
name: Humidity
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.small_office_ceiling_left
icon: mdi:ceiling-light-multiple
name: Ceiling Light
icon_height: 75px
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
icon: mdi:bookshelf
icon_height: 75px
entity: light.striplight
show_state: true
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: light.small_office_lamp
icon: mdi:desk-lamp
icon_height: 75px
name: Desk Lamp
- type: entity
entity: cover.small_office_blind
name: Window Blind
attribute: position
unit: '% Open'
- type: entities
entities:
- entity: sensor.hl_3140cw_black_toner_remaining
name: Black
icon: mdi:water
- entity: sensor.hl_3140cw_cyan_toner_remaining
name: Magenta
icon: mdi:water
- entity: sensor.hl_3140cw_magenta_toner_remaining
name: Cyan
icon: mdi:water
- entity: sensor.hl_3140cw_yellow_toner_remaining
name: Yellow
icon: mdi:water
- entity: sensor.hl_3140cw_page_counter
- entity: sensor.hl_3140cw_status
title: Brother Printer
- type: vertical-stack
title: Outside
cards:
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.outdoor_lights
show_state: false
icon_height: 75px
name: Garden Bulkheads
icon: mdi:wall-sconce-flat
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.porch_right
- type: horizontal-stack
cards: []
- type: vertical-stack
title: Dining Room
cards:
- type: horizontal-stack
cards:
- type: button
tap_action:
action: toggle
entity: switch.dining_room_ceiling_left
name: Ceiling Light
icon: mdi:vanity-light
show_state: false
icon_height: 75px
- type: button
tap_action:
action: toggle
entity: switch.sun_room_left
name: Sun Room
icon: mdi:track-light
icon_height: 75px
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: light.tripod
icon: mdi:floor-lamp-torchiere-variant
icon_height: 75px
- type: button
tap_action:
action: toggle
entity: switch.display_cabinets
name: Display Cabinets
icon: mdi:file-cabinet
icon_height: 75px
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.fish_tank
icon: mdi:fishbowl
show_state: false
- type: vertical-stack
title: Bathroom
cards:
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.towel_radiator_2
name: Towel Radiator
icon: mdi:radiator
show_state: false
icon_height: 75px
- type: vertical-stack
title: Living Room
cards:
- type: custom:simple-thermostat
entity: climate.living_room_climate_wireless
layout:
step: row
header: false
control: false
sensors:
- entity: sensor.hallway_climate_humidity
name: Humidity
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.living_room_lights_center
name: Alcove
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.living_room_lights_left
name: Ceiling
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.living_room_lights_right
name: Lamp
- type: horizontal-stack
cards:
- type: button
tap_action:
action: toggle
entity: switch.lava_lamp
icon: mdi:lava-lamp
icon_height: 75px
- type: button
tap_action:
action: toggle
entity: media_player.living_room_tv
icon: mdi:television-classic
name: TV
icon_height: 75px
- type: vertical-stack
title: Spare Room
cards:
- type: custom:simple-thermostat
entity: climate.spare_room_climate
layout:
step: row
header: false
control: false
sensors:
- entity: sensor.hallway_climate_humidity
name: Humidity
- type: horizontal-stack
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.spare_room_ceiling
name: Ceiling Light
icon_height: 75px
icon: mdi:ceiling-light-multiple
- type: button
tap_action:
action: toggle
entity: switch.rocket
icon: mdi:lava-lamp
icon_height: 75px
- graph: line
type: sensor
entity: sensor.baby_temperature_sensor_temperature
detail: 1
name: Cot Temperature
hours_to_show: 6
