How to change the cards width?

[lachezar-gizdov]

Goal

Previously I can choose with the native HA styling the width of the card, I see that is gone from bubble card and as I understand is something that can be done using custom css styles? I tried with some css but can't get the card to take let's say 80% of the width of the column and nest one more card next to it

Source Yaml

type: custom:bubble-card
card_type: climate
entity: climate.office_ac_room_temperature
name: Air Conditioner
show_state: true
show_attribute: true
show_icon: true
force_icon: false
show_last_changed: false
hide_temperature: false
state_color: true
button_action:
  tap_action:
    action: more-info
grid_options:
  columns: 12
icon: ""
show_name: true
step: 1
sub_button:
  main:
    - name: HVAC modes menu
      select_attribute: hvac_modes
      state_background: false
      show_arrow: false
      sub_button_type: select
  bottom: []
attribute: current_temperature

Which step did you already try?

.bubble-button-card-container {
    width: 80% !important; /* Adjust percentage or px as needed */
    margin: 0 auto;       /* Optional: Center the card */
  }

Problem

No response

Read the documentation

• I have read the documentation