Markdown Code Block - Font Size - easy way to change?

DEVONthink
1

This is simple problem: → for this below … in Markdown doc but the font is too large.
What is the simple css style code to change the font size ?

$ mysql -u root -p
2

There’s information on CSS for markdown here:

1 Like
3

CHRILLEK … your CSS PDF is awesome - thanks for pointing me in that direction.

But - I think I asked my question incorrectly. :frowning:

This is a MARKDOWN code block ```SQL … some code … ```

mysql> GRANT ALL PRIVILEGES ON *.* TO 'donnie'@'%' WITH GRANT OPTION;
mysql> FLUSH PRIVILEGES;

I want to CHANGE the FONT SIZE of the code block with CSS.

Perhaps I am not understanding from the CSS guide you shared - what I need to do … there is some CSS class or type that I need to change the <style> … </style> for … I just dont have a clue where to start. Or, what to change ?

I apologize for my sophomoric question - perhaps a simple example might open my brain ?

4

Here’s what I always suggest: convert the MD to HTML in DT. Then open that HTML in your browser (it won’t show DT item url images, but that doesn’t matter here). Open your browser’s deveoper tools. Check out the part of the HTML that you’re interested in and play around with the CSS settings for it.

Where to put the CSS and all that is described in the posts I linked to.

5

chrillek is the man …

recipe:

  1. Write your Markdown example
  2. Add a code block with ```SQL … some code … ``` or whatever
  3. In DT convert to HTML (with right click convert)
  4. Open the HTML in browser and use developer inspection to drill to HTML/CSS style sheet params
  5. Find the CSS block of interest - and play with font-size
  6. Code a simple CSS <style> modifier and place in markdown doc, it applies to all blocks

What I ultimately posted in the head of my Markdown is this:

<style>
pre[class*=language-]
{font-size: 0.8em;} 
</style>

and magic happens … reduced all the code block font so it is reads better.

So easy when you are not dumb … Thanks Chrillek !!!

2 Likes
6

You’re welcome. I’d suggest to put that in a global stylesheet so that it gets automatically applied to all MD documents. Manually adding the style element is a bit tedious, I think.