Hello there,
I made a simple CSS Grid:
type: custom:grid-layout
icon: mdi:grid
layout:
grid-template-columns: 30% auto 30%
grid-template-rows: auto
grid-template-areas: |
"header header header"
"messages messages messages"
"left middle right"
" footer footer footer"
mediaquery:
'(orientation: portrait)':
grid-template-columns: 50% 50%
grid-template-rows: auto
grid-template-areas: |
"header header"
"messages messages"
"middle middle"
"left right"
"footer footer"
I wnat to put a custom:swipe-card in the grid area called “middle”. This swipe card should display picture cards / picture element cards of my rooms.
card:
type: custom:swipe-card
cards:
- type: picture
image: /local/images/kleinesWZ.webp
- type: picture
image: /local/images/grossesWZ.webp
view_layout:
grid-area: middle
If I try this, the images grow above any limits. What I’m doing wrong here?