How to make outline callout?

Custom CSS & Theme Design
1

Hi

I find this code for this but it dosnt work, can someone help me?

/* Even columns */
.callout[data-callout="even-columns"] {
  /* Removes padding and background colour from the container */
  padding: 0;
  background-color: transparent;
}
.callout[data-callout="even-columns"] > .callout-content {
  /* Arranges the content in columns */
  display: grid;
  /* minmax sets the minimum width of a column. Make the columns 'skinnier' by setting 15rem to a smaller number */
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: 12px;
}
.callout[data-callout="even-columns"] > .callout-title {
  /* Hides the callout title */
  display: none;
}

This is what should do:

image
image1266×375 69.3 KB

3

I don’t see any borders on my end, but it looks something like this

Screenshot 2023-10-12 133249

if you write the content like this

> [!even-columns] Title
> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do  
>
> quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea

Have a look here for some great options ready to go:

4

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.