[Bug] Image flashes then disappears when using `background-image` css property

[iamhrigved]

Problem

https://github.com/user-attachments/assets/6fb91654-8b6f-4ba3-8fba-9febe23b158e

This happens when I refresh my ~/.config/waybar/style.css file by making a change and saving it.

This is my config

"custom/claude": {
    "format": "  ",
    "tooltip": true,
    "tooltip-format": "Open Claude AI!",
    "on-click": "brave --app=https://claude.ai",
}

#custom-claude {
    background-image: url("/home/hrigved/Pictures/Icons/claude.png");
}

More Context

The Arch logo you see, is a waybar/image module and not a background-image css property.

[iamhrigved]

Solved. Forgot to add background-size: cover;