Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

In markdown.preview, CSS's 1em does not correspond to .fontSize. #219520

Closed
RokeJulianLockhart opened this issue Jul 1, 2024 · 6 comments
Closed

In markdown.preview, CSS's 1em does not correspond to .fontSize. #219520

RokeJulianLockhart opened this issue Jul 1, 2024 · 6 comments
Assignees
@mjbvz
Labels
markdown Markdown support issues *question Issue represents a question, should be posted to StackOverflow (VS Code)

Comments

@RokeJulianLockhart
Copy link

RokeJulianLockhart commented Jul 1, 2024 •
edited
Loading

Does this issue occur when all extensions are disabled? Yes
VS Code Version code-insiders-1.91.0-1719555839.el8.rpm
OS Version cpe:/o:fedoraproject:fedora:40

Steps to Reproduce

I've set markdown.preview.fontSize to 13 px:

"markdown.preview.fontSize": 13 // Matches my OS.

Yet, I noticed when setting :not(h1) {font-size: 1em;}:

<style>
  :not(h1) {font-size: 1em;}  /* this should render larger than `markdown.preview.fontSize` - mine is set to 13px. */
  :is(h1) {font-size: 1.5em;} /* demonstrates that it appears to scale correctly (at least, past `0.9em`) but is merely set to an arbitrary constant. */
</style>

...that this set the font size much too large. 13px renders it as I expect, so why isn't 1em set to the markdown.preview.fontSize, as it should be?
@mjbvz
Copy link
Collaborator

mjbvz commented Jul 2, 2024 •
edited
Loading

When you set :not(h1) { ... } , that also applies to the <body> and overrides the configured markdown.preview.fontSize font size on the page. It then ends up going to the default font size for the browser

You should exclude body from the :not too

@mjbvz mjbvz closed this as completed Jul 2, 2024
@mjbvz mjbvz added *question Issue represents a question, should be posted to StackOverflow (VS Code) markdown Markdown support issues labels Jul 2, 2024
@RokeJulianLockhart
Copy link
Author

#219520 (comment)

@mjbvz, that's exactly what I'm confused by - each em should be taking its value from markdown.preview.fontSize. Otherwise, when I scale anything other than <body> by 1em, it'll correspond to the "browser default", instead of markdown.preview.fontSize. Shouldn't the browser default correspond to markdown.preview.fontSize...?

@mjbvz
Copy link
Collaborator

mjbvz commented Jul 2, 2024

each em should be taking its value from markdown.preview.fontSize

Try debugging the page with the dev tools. markdown.preview.fontSize is set on the body element and your custom css is overriding it so that there is no configured font size for the page

@RokeJulianLockhart
Copy link
Author

RokeJulianLockhart commented Jul 2, 2024 •
edited
Loading

#219520 (comment)

@mjbvz, when no font size is configured, I would expect the browser to fall back to markdown.preview.fontSize, rather than whatever seemingly arbitrary value it uses instead. After all, the value it's using has to be applied from somewhere - I presume a config file somewhere?

@mjbvz
Copy link
Collaborator

mjbvz commented Jul 2, 2024

No we use a style sheet just like a normal webpage

@RokeJulianLockhart
Copy link
Author

RokeJulianLockhart commented Jul 2, 2024 •
edited
Loading

#219520 (comment)

@mjbvz, do you know where your style sheet is specified? If I can modify the values in it, that'll give me a better picture as to what the embedded browser defaults to.

@vs-code-engineering vs-code-engineering bot locked and limited conversation to collaborators Aug 16, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@mjbvz mjbvz

Labels
markdown Markdown support issues *question Issue represents a question, should be posted to StackOverflow (VS Code)
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@mjbvz @RokeJulianLockhart