What I’m trying to do
All I want is to justify my text my default using a css snippet. I have a clean vault where I test everything with no plugins installed.
Things I have tried
First thing to note, absolutely clueless about coding and how files work except the basics.
This vault has no plug ins, no themes, completely empty vault except the snippets.
I have used A-shell, Taio, and finally the ES File Explorer (The only one that found the .obsidian file, so this is the one I’m currently using) and any changes I made to the snippets folder, nothing appears in the list of css plugins.
I have a few CSS files of the snippets I want, so I dragged it into the snippets folder, like normally, (Yes they are CSS files, not TXT files or MD files) using ES File Explorer. But they do not appear, and I have trouble shooted everything that appeared when you google “CSS not appearing obsidian.”
I have also used the CSS Editor, as a final resort, and things finally began to appear, only for them to not work, enabled, disabled, rebuilding the vault, shutting down my iPad and reopening it.
I decided to clear up my snippets folder because I tried a few different snippets (some are Unrelated to justifying, I’ll list them down) , and it was piling up. Using ES File explorer, I deleted the files in my vault’s snippets folder. And the snippets did not delete. Now I just have a bunch of ghost snippets stacked in my vault that don’t work, can’t be deleted and just exist there. Yes I have retried every solution to get rid of the ghost snippets, and I searched my files for where these snippets could have possibly gone, but I can’t find anything. But this is a separate issue.
Css snippets seem completely broken on IOS? Or is it just me.
Snippets I’ve tried:
/* align-text justified source view and live preview */
.markdown-source-view.mod-cm6 .cm-line {
text-align: justify;
text-justify: inter-word;
}
/* align-text justified reading mode */
.markdown-preview-view p {
text-align: justify;
text-justify: inter-word;
/*- source view and live preview - mobile only -*/
.is-mobile .markdown-source-view.mod-cm6 .cm-line {
text-align: justify;
text-justify: inter-word;
}
/*
CSS for chaging the color of Headings in all modes (source mode, preview mode, reading mode)
Official documentation: https://docs.obsidian.md/Reference/CSS+variables/Editor/Headings
*/
/* Header colors */
body {
--h1-color: #B278F2;
--h2-color: #5E9BE1;
--h3-color: #FFC21F;
--h4-color: #46AC79;
--h5-color: #D07A40;
--h6-color: #D23838;
}
.HyperMD-header-1::after, h1,
.HyperMD-header-2::after, h2,
.HyperMD-header-3::after, h3 {
display: block;
content: "";
padding-bottom: 2px;
border-bottom: 1px solid gray;
}
/*
left-justified-main-w.css snippet
Remove the left margin when 'readable-line-width' is enabled,
effectively left justifying the text.
2023-07-13 Alex Nordstrom (mr_abomination)
*/
.markdown-source-view.mod-cm6.is-readable-line-width .cm-sizer,
.markdown-preview-view.is-readable-line-width .markdown-preview-sizer {
margin-left: 0px !important;
}
/*
Last updated 2024-11-18
This solution is provided by TfT Hacker. Learn more at https://tfthacker.com
*/
/* Embed an image to the right of the div */
div[data-path="0-Vault-Logo"] * {
display: none;
}
div[data-path="0-Vault-Logo"] {
order: -1;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
margin-bottom: 15px;
width: 100%;
min-height: 200px;
border-radius: 15px;
border: 2px solid rgb(199, 106, 40);
}
/*
Last updated 2024-11-18
This solution is provided by TfT Hacker. Learn more at https://tfthacker.com
*/
/* Embed an image to the right of the div */
div[data-path="0-Vault-Logo"] * {
display: none;
}
div[data-path="0-Vault-Logo"] {
order: -1;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
margin-bottom: 15px;
width: 100%;
min-height: 200px;
border-radius: 15px;
border: 2px solid rgb(199, 106, 40);
background-image:url(‘’)
}
