[CSS Snippet] Justify, just not in the code block!

I love … OK, I LOVE justified text, so I have applied a snippet to the Obsidian.

/* Justify text in reading mode */
.markdown-preview-view p {
  text-align: justify;
  text-justify: inter-word;
}

/* Justify text in source view and live preview */
.markdown-source-view.mod-cm6 .cm-line {
  text-align: justify;
  text-justify: inter-word;
}

But it starts bothering me in code-blocks dataviewjs.

So I add this part:

/* Prevent justification inside code blocks and enable wrapping */
.markdown-source-view.mod-cm6 .HyperMD-codeblock,
.markdown-source-view.mod-cm6 .HyperMD-codeblock-bg,
.markdown-source-view.mod-cm6 .HyperMD-codeblock .cm-line {
  text-align: left !important;
  text-justify: none !important;
  white-space: pre-wrap !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

… to get it nicely:

image

This is it! I just wanted to share my “snippet highlight of the day” with you :slight_smile:

Cheers, Marko :nerd_face: