CSS Snippet is only available on editing mode

Things I have tried

Hello. Hope you are having a great day. I just wrote a piece of code to make add Gradients to my heading. here is the code

.markdown-preview-view h1, .cm-header-1 {
    font-weight: 700;
    background: -webkit-linear-gradient(40deg, #209cff, #68e0cf)
    !important; -webkit-background-clip: text
    !important; -webkit-text-fill-color: transparent

What I’m trying to do

But this code is only working inside editing mode. can someone please help me how can I get this gradient look in both editing and reading mode at the same time?

Have you seen this:


Thank you so much. I edited this code and find out the single width: fit-content;
piece is fixing my whole problem. don’t know why but it works.

Here is the new code I hope it helps.

.markdown-preview-view h1, .cm-header-1 {
    font-weight: 700;
    background: linear-gradient(40deg, #209cff, #68e0cf);
    -webkit-background-clip: text;
    color: transparent;
    width: fit-content;
1 Like

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