Preview mode is screwed up

[abudhakeer]

I'm submitting a...

• [x] Bug report

I am building a chrome extension with note taking ability in youtube. This based on vanilla JS and I added the easyMDE by adding the JS and CSS mentioned in installation steps.

<link rel="stylesheet" href="https://unpkg.com/easymde/dist/easymde.min.css">
<script src="https://unpkg.com/easymde/dist/easymde.min.js"></script>

The editor loads smoothly in the youtube (when i click the extension icon) and i can play with all the different markdowns.

But when i toggle to preview mode (toolbars in screenshots contain different icons because i was playing with various options, so ignore it.) the styling is screwed up and especially for bulleted list the dots are seen outside the boundary of the div enclosing textarea. See the attached screenshots for clairty.

When i debugged further i was able to figure out that this behaviour is seen only in YT. May be due to some existing styling done in youtube disturbs styling of easyMDE.

In youtube

In a different website

[abudhakeer]

I was able to resolve the issue by playing with the easymde.css file.

[metapodcod]

I was able to resolve the issue by playing with the easymde.css file.

how did you solve the problem? i have the same problem