How can I get the titel of my vertical stack into center?
Something like this:
type: vertical-stack
title: Küche
style: |
ha-card .card-header
{
text-align: center;
}
cards:
- type: custom:mushroom-light-card
entity: light.plug_schlafzimmer_plug_schalfzimmer
name: Kleiderschrank
icon: mdi:tshirt-crew
icon_color: green
Sadly the style argument only works under cards. Any ideas?
It shoudl look like this:
But it’s always on the ledft.
Try this…
type: custom:mod-card
style:
hui-vertical-stack-card$: |
.card-header {
font-size: 15px !important;
color: lime !important;
text-align: center !important;
}
card:
type: vertical-stack
title: Test Title Center
cards:
- type: custom:mushroom-light-card
entity: light.plug_schlafzimmer_plug_schalfzimmer
name: Kleiderschrank
icon: mdi:tshirt-crew
icon_color: green
Awesome, thanks!
Can you maybe help me out again?
I am trying something new now. How do I approach to get the title text to stick on the left (I mean like really left where the arrow chip is)?
This is my code yet
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: menu
- type: back
card_mod:
style: |
mushroom-chips-card {
width: 100px !important;
}
- type: custom:mushroom-title-card
title: Wohnzimmer
card_mod:
style: |
ha-card {
height: 20px !important;
padding: 0px !important;
}
You can use a negative margin by adding left: -130px adjust the 130px to your liking.
type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: menu
- type: back
card_mod:
style: |
mushroom-chips-card {
width: 100px !important;
}
- type: custom:mushroom-title-card
title: Wohnzimmer
card_mod:
style: |
ha-card {
height: 20px !important;
padding: 0px !important;
left: -130px;
}