Css not working on only iphone app read mode


editing mode

reading mode

In the desktop version, both Edit mode and Reading mode display the line spacing and paragraph spacing correctly with my custom CSS.


editing mode

reading mode
However, in the mobile version, the CSS works only in Edit mode — it doesn’t apply at all in Reading mode.
Is there something else I need to add or change to make the CSS apply in mobile Reading mode as well?

I’ve included the CSS I’m using below.

/* Line spacing adjustment /
.cm-contentContainer {
line-height: 1.4;
}
/
Paragraph spacing adjustment */
.markdown-source-view :is(.cm-line + .cm-line) {
padding-top: 0.6em !important;
}

/* Line spacing for Reading mode /
.markdown-preview-view br {
content: ‘’;
display: block;
margin-top: 9px;
}
/
Paragraph spacing for Reading mode */
.markdown-preview-sizer.markdown-preview-section p{
margin: 0px 0px 30px 0px ;
}

I suspect it has to do with the fact that certain UI will have to look different to fit on mobile well, and this is true for reading mode. You can target mobile with a specific selector iirc.

(post deleted by author)

I tried adding mobile-specific classes like .is-mobile, but when I do that, the styles don’t apply at all.
At this point, I haven’t been able to find any solution to the problem and have basically given up…