I’ll work on that for the next release 
I think I found what I was doing wrong!
My bar charts with toner levels were part of entities card, that then was embedded within stack-in card. So it was entities card that was preserving border, not the stack-in-card! After moving bar-card outside of entities card, directly to stack-in-card, unwanted borders dissapeared!
This is causing another small issue, with spacing (space between entities card and bar card gets enlarged, not looking as I would wish 
Perhaps this is something to look at (though not sure if possible, this might be result of individual cards borders accumulating - space between divider and title of bar-card on screenshot below)?
1 Like
I think you can inspect what’s inside your card and what causes that gap to be bigger than you expected.
As a viable option you can always tweak your resulting gard with card-mod (at least it will be quicker than to wait for a new release 
)
@AhmadK Thanks! Here is the latest code I use for this card:
type: 'custom:stack-in-card'
mode: vertical
keep:
background: false
border_radius: false
box_shadow: false
margin: false
outer_padding: false
cards:
- type: entities
entities:
- type: divider
- entity: sensor.cp1515n_printer_status
icon: 'mdi:information-variant'
name: 'Printer status:'
- entity: sensor.cp1515n_printer_error
icon: 'mdi:alert-outline'
name: 'Printer error:'
- entity: sensor.cp1515n_printer_uptime
icon: 'mdi:clock-check-outline'
name: 'Printer uptime:'
- type: divider
- entity: sensor.cp1515n_total_pages_printed
icon: 'mdi:counter'
name: 'Total pages printed:'
- entity: sensor.cp1515n_color_pages_printed
icon: 'mdi:counter'
name: 'Color pages printed:'
- entity: sensor.cp1515n_bw_pages_printed
icon: 'mdi:counter'
name: 'B&W pages printed:'
- type: divider
- type: 'custom:bar-card'
entities:
- entity: sensor.cp1515n_black_level
color: '#333333'
name: Black
- entity: sensor.cp1515n_cyan_level
entity_config: null
name: Cyan
color: '#00FFFF'
- entity: sensor.cp1515n_magenta_level
entity_config: null
name: Magenta
color: '#FF00FF'
- entity: sensor.cp1515n_yellow_level
entity_config: null
name: Yellow
color: '#FFFf00'
animation:
speed: 1000
delay: 1000
state: 'on'
direction: up
entity_row: false
height: 120px
width: 70%
limit_value: true
min: 0
max: 100
title: 'Toner levels:'
stack: horizontal
target: 15
positions:
icon: 'off'
indicator: 'off'
title: outside
minmax: 'off'
value: inside
title: HP Color LaserJet CP1515n
Regarding card-mod… well, I hate somehow CSS and modding, adding aditional components to my HA only if absolutely necessary 
so I’m trying to avoid this type of modifications as long as possible Maybe it’s time to change my mind
1 Like
I am sorry to hear it wasn’t working for you, I do have a CP1525nw and it was working perfectly but now that I went to check it it seems not to be working again, so I’ll have to take a look into that too
Thanks
1 Like
@RomRider OK, moving forward with cleanup of my config to switch everything to only stack-in-card for consistency of configuration and look. So far working great and I managed to move everything… but one card (well, have multiple instances of this for several VMs in my lab). So here is the card as it looks now:
The code for this card is:
cards:
- content: |
## {{ state_attr('sensor.esxi_vm_hassio', 'friendly_name') }}
type: markdown
- type: divider
- cards:
- content: |
OS: {{ state_attr('sensor.esxi_vm_hassio', 'guest_os') }}
IP: {{ state_attr('sensor.esxi_vm_hassio', 'guest_ip') }}
STATE: {{ state_attr('sensor.esxi_vm_hassio', 'state') }}
STATUS: {{ state_attr('sensor.esxi_vm_hassio', 'status') }}
type: markdown
- content: >
UPTIME: {{ state_attr('sensor.esxi_vm_hassio', 'uptime_hours' ) }} h
CPUs: {{ state_attr('sensor.esxi_vm_hassio', 'cpu_count') }}
RAM: {{ state_attr('sensor.esxi_vm_hassio', 'memory_allocated_mb') }}
MB
HDD: {{ state_attr('sensor.esxi_vm_hassio', 'used_space_gb') }} GB
type: markdown
mode: horizontal
type: 'custom:stack-in-card'
- type: divider
- cards:
- align_header: left
align_icon: left
animate: true
entities:
- entity: sensor.vm_hassio_cpu
index: 0
fill: fade
height: 100
hours_to_show: 1
icon: 'mdi:chip'
line_color: '#ff0000'
line_width: 2
lower_bound: 0
name: 'CPU Load:'
points_per_hour: 60
type: 'custom:mini-graph-card'
update_interval: 60
upper_bound: 100
- align_header: left
align_icon: left
animate: true
entities:
- entity: sensor.vm_hassio_mem
index: 0
fill: fade
height: 100
hours_to_show: 1
icon: 'mdi:memory'
line_color: '#0088ff'
line_width: 2
lower_bound: 0
name: 'Memory:'
points_per_hour: 60
type: 'custom:mini-graph-card'
update_interval: 60
upper_bound: 10000
mode: horizontal
type: 'custom:stack-in-card'
type: 'custom:vertical-stack-in-card'
As you can see 2 internal stack cards are replaced already by stack-in-card, but card wrapping everything around is still vertical-stack-in-card. If I replace it with stack-in-card I get errors associated with divider… So something wrong with nesting cards… which is a bit strange that it changes behavior of nested card:
Any idea if this can be fixed somehow? I’d really love to switch entirely to your card!
Change
- type: divider
with:
- type: entities
entities:
- type: divider
Yeah, I know the trick, but the divider won’t be whole card wide, but slightly narrower. Also vertical spacing between elements gets affected, as divider is then wrapped around by entities card. Thats why I went for this card, it allows to eliminate shadows around embedded cards and keep elements more compact, without playing with CSS.
Screenshot below demonstrates the problem with this approach - bottom divider is done this way.
Could you please try (no card to install, it’s just a trick):
- type: custom:hui-divider-row
edit: just tried, doesn’t work, will look at this later over the weekend
1 Like
@RomRider actually it kind works… All levels of nesting are stack-in-card, upper is normal divider, bottom is per your suggestion:
There is however small shadow visble just above the divider line, like normal card border.
@AhmadK, perhaps will try this one, once have a bit more time… But I never used this, so something new to learn…
it’s pretty new and was actually created no avoid doing what RomRider asked you to do 
Try it and at least you won’t get that red box
Is it by design that the card is vertically stacked within the view? I have multiple stack in card combining a custom button and entities however i have noticed that each card is now stacked vertically rather than overflowing like normal love lace cards.
This is a behaviour that was introduced lately with custom-card embedding cards. There is an open bug in the frontend repo regarding this issue.
1 Like
have a vertical stack I like to replace with the stack-in-card:
type: custom:stack-in-card #vertical-stack
cards:
- type: 'custom:button-card'
name: Set Hue Outdoors sensitivity
template: button_default_title_fixed
styles:
card:
- --keep-background: 'true'
- !include /config/lovelace/buttons/buttons_set_hue_outdoors_sensitivity.yaml
- type: entities
show_header_toggle: false
entities:
- input_select.select_hue_outdoors_motion_sensor
- entity: script.set_hue_outdoors_sensitivity
action_name: Set
As you can see I already added the keep-background to the ‘header’ which now works fine, but the second row, the include, doesn’t get its set colors correctly:
until after I click one of the sensitivities:
reloading the page, so not even a refresh, but a simple reload in the browser takes the colors out again to show the first blanked view.
the !include is a horizontal-stack of decluttering cards:
type: horizontal-stack
cards:
- type: custom:decluttering-card
template: set_hue_outdoors_sensitivity
variables:
- option: 'Very low'
- icon: mdi:numeric-0-box-multiple-outline
- label: Very low
- type: custom:decluttering-card
template: set_hue_outdoors_sensitivity
variables:
- option: 'Low'
- icon: mdi:numeric-1-box-multiple-outline
- label: Low
- type: custom:decluttering-card
template: set_hue_outdoors_sensitivity
variables:
- option: 'Medium'
- icon: mdi:numeric-2-box-multiple-outline
- label: Medium
- type: custom:decluttering-card
template: set_hue_outdoors_sensitivity
variables:
- option: 'High'
- icon: mdi:numeric-3-box-multiple-outline
- label: High
- type: custom:decluttering-card
template: set_hue_outdoors_sensitivity
variables:
- option: 'Very high'
- icon: mdi:numeric-4-box-multiple-outline
- label: Very high
Ive tried the keep-background on the include, or in the horizontal-stack, to no avail though.
What should I do in this case, please have a look?
to give you an idea of the view of the old vertical-stack:
always perfectly colored, albeit 3 separate horizontal rows…
You have an easy solution:
keep:
background: true
The other solution is to add somewhere --keep-background on this template template: set_hue_outdoors_sensitivity
1 Like
where should I put that?
like this:
type: custom:stack-in-card #vertical-stack
keep:
background: true
cards:
- type: 'custom:button-card'
name: Set Hue Outdoors sensitivity
template: button_default_title_fixed
# styles:
# card:
# - --keep-background: 'true'
- !include /config/lovelace/buttons/buttons_set_hue_outdoors_sensitivity.yaml
- type: entities
show_header_toggle: false
entities:
- input_select.select_hue_outdoors_motion_sensor
- entity: script.set_hue_outdoors_sensitivity
action_name: Set
edit
yes, like that
thanks!
another question please:
have this stack:
type: custom:stack-in-card
cards:
- type: glance
style: |
ha-card {
box-shadow: none;
background: url('/local/images/buienradar.png');
background-size: cover;
--keep-background: true;
}
title: Buienradar headline
show_header_toggle: false
entities:
- sensor.br_feel_temperature
- sensor.br_wind_force
- sensor.br_condition
- type: entities
title: Buienradar details
show_header_toggle: false
entities:
- type: custom:fold-entity-row
head:
type: section
label: Temp & condition
entities:
- sensor.br_temperature
- sensor.br_ground_temperature
- sensor.br_condition_code
- sensor.br_detailed_condition
- sensor.br_full_condition
- sensor.br_symbol
- sensor.br_wind_direction
- sensor.br_wind_direction_azimuth
- sensor.br_wind_force
- sensor.br_wind_gust
- sensor.br_wind_speed
## - sensor.br_irradiance
- type: custom:fold-entity-row
head:
type: section
label: Barometer
entities:
- sensor.br_precipitation
- sensor.br_precipitation_forecast_average
- sensor.br_precipitation_forecast_total
- sensor.br_humidity
- sensor.br_pressure
- sensor.br_barometer
- sensor.br_barometer_value
- sensor.br_stationname
- sensor.br_visibility
- type: picture
image: /local/images/buienradar_banner.png
tap_action:
action: url
url_path: https://www.buienradar.nl
of which the bottom picture is showing as detached. Is that to be expected with above code, or am I correct in thinking this should be attached?
please have a look? thanks!
update
this seems to have resolved itself, can only imagine it would have been a cache thing…
closed.