Markdown Previewer - Certain markdowns not working

Markdown Previewer - Certain markdowns not working
0

#1

Tell us what’s happening:

In particular inline code (single back-tick), code block (triple back-tick), and block quote (>) are not working for some reason.

I did a search for the problem but couldn’t find any information on this.

Here is a link of my project (basic skeleton) in codepen
https://codepen.io/edtay/full/BPgLoN/

Would greatly appreciate if someone here could help me figure out. Thanks in advance.

Your code so far

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer


#2

Just to verify if I am answering my own question correctly.

It is not the markdown previewer was not working as intended. But rather, I will need to style the inline code, code block, and block quote elements in the css?


#3

Yes. You need to style the HTML in the #preview element.

Try writing this CSS rule:
code { background: black }

And your code will be highlighted with a black background.


#4

It’s cause codepen sort of “forbids” or renders them as is. I had a problem for my technical doc page so i used this.