Exclude one callout from CSS

[LSKY]

hi!
I’ve come here because I have a problem with my CSS. It could be resolved by me not using it as it’s pretty not-useful but only about aesthetics, but here we are.

I customized a lot of my callouts, and for the white theme I wanted them with a coloured border. No problem, I achieved this with

.callout {
        border: 1px solid rgba(var(--callout-color), 0.1); 
}

The problem I’m facing is that I also use a CSS snippet called “multi-column” (in this repo) that allows me to have two callouts side by side, with this syntax:

> [!multi-column]
>
>> [!example]
>
>> [!example]

Here there’s a screen of what I see… (sorry but right now I’m on mobile, usually I work on my laptop).

However, the coloured border affects ALL callouts, also the > [!multi-column], so I find myself having two borders: the proper one, of the callout, and the one of the multi-column.
Is there any way to exclude the multi-column from having the border?

[efemkay]

@LSKY

you may use css :not() selector with css attributes [data-callout="multi-column". this will apply to all callout except for [!multi-column]. obsidian has the callout tag as data-callout attributes, so [!note] will have attribute .callout[data-callout="note"]

.callout:not([data-callout="multi-column"]) {
    border: 1px solid rgba(var(--callout-color), 0.1); 
}

[LSKY]

thank you!! it worked