External CSS Stylesheet Overrides Internal Markdown Styling

I find that, for markdown documents, if I specify an external CSS stylesheet in Preferences > Media > Style Sheet, it will override internal css written for the document (page backgrounds, font sizes, etc).

(Plus, editing or removing the external stylesheet requires a re-launch of the app to bring the documents to their internally styled appearance.)

Is that supposed to happen? It goes against the usual priority of css styling.

I suppose that it’s supposed to happen (what would be the point of having an external stylesheet if it couldn‘t override the internal one?).
Also, why would that go „against the usual priority of css styling“? Stylesheets referenced in HTML override the browser defaults, too.

@chrillek I think @avatar’s point is that what you describe isn’t happening.

He is saying that the global css defined in preferences (the “browser defaults”) is overriding the css internal to the document. Which is the exact oposite of what you said, I think. (And you are, of course correct)

All that said, I’m sorry to say @avatar, but I just tested it and my internal css does override the global css. As expected and as @chrillek explained. So you seem to have something else going on.

@arasmus - Yes, I meant, the external style sheet is incorrectly overriding the style written inside the document. Odd that yours isn’t while mine is.

Looking further, it seems only to be affecting the body background colour.

I’m not that clued-up on Markdown syntax, but I see that using background:yellow is not affected whereas using background-color:yellow is. Thanks.

See this forum post regarding Markdown styling and the effects of external and internal styling…

First off, I’m sorry that I misunderstood your first post. I thought that you were talking about the internal stylesheet used by DT. Which of course is overriden by any style defined in your MD file or in the global CSS given in the settings of DT.

Now, to background vs. background-color.

The former is a short hand for several properties affecting the background of an element. Only one of them is the background color. So if you only want to specify the color, use background-color.

Then there’s the question of “what comes first”. Which can not be deduced from your posts, since you neither post the CSS nor the MD file. Anyway, there are several discussions on stackoverflow (e.g. html - CSS color vs. background-color vs. background? - Stack Overflow) and a more thorough explanation e.g. here https://techstacker.com/difference-between-background-and-background-color-in-css/
And, as always in matters of CSS, HTML and JavaScript, MDN knows more: background - CSS: Cascading Style Sheets | MDN

In any case, this has nothing to do with DT.

1 Like

I understand the CSS syntax. I’m just saying that something like body {background-color:#ccc;} is overridden by the external stylesheet, whereas body {background:#ccc;} (which I don’t used anywhere else) isn’t overridden.

And, as I say, this ‘overriding’ seems only apparent when styling the background colour on the body tag. Nothing else (so far) seems affected.

It has something to do with DEVONthink, since this doesn’t happen with regular CSS anywhere else.

Well I think this is my mistake - the overriding does occur elsewhere in the same way - with the body tag.

Seems odd. But DEVONthink is exonerated :slightly_smiling_face:

1 Like