css setting for tag p not defined

[timeislove]

hello,

used your package to output md to html. tried to change the fonts in your rendered html output but failed.

then found out the following:

css setting defined for .markdown-body class and almost all the descendants except tag p. html reference to .markdown-body class in tag article all text in your rendered html output is bracket by tag p within article, but not directly under tag article.

hence the css setting to .markdown-body class does not have any effect on the text (as bracket by tag p).

[facelessuser]

Can you post an example of what you are trying to do? I'm not really following what you are saying. Post an example and describe what you are hoping the desired results to be.

[timeislove]

hello,

here below part of css codes in your rendered html output file:

''' .markdown-body { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; color: #333333; overflow: hidden; font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif; font-size: 16px; line-height: 1.6; word-wrap: break-word; }

'''

and here below the reference by html:

'''

pls voice out your outstanding works and obstacles ASAP

''' as you see css defined for .markdown-body class and most of its descendant (except tag p - not shown in the code above as there are too many), but in html the text to be displayed is within tag p under article (which is referred to class markdown-body), so, style defined (or any change in style) in .markdown-body would not affect the text display. so, i would suggest, either 1) add css for .markdown-body p; or 2) put the text to be displayed directly within tag article (i.e. not bracket by tag p)

[facelessuser]

Yes, we generally style all text in the document. If you want to specifically style p tags differently, then you have to use a more specific CSS selector.

I still haven't seen an example illustrating an issue you are having. What problem are you trying to solve? Or better said, what are you trying to do that isn't working?

[timeislove]

@facelessuser

hmmm.... ok, put it this way...

if you put all text to be displayed within tag p, why do you define the css style in a class .markdown-body?

i suppose to define the class .markdown-body is provide the convenience if one want to change the text display style, he/she would just require modify this class?

[facelessuser]

I'm not 100 percent sure text only occurs in p tags, there are lots of plugins. I would argue most text should be in p tags, but that is not guaranteed.. Specifying a default text for the entire container covers this. After that, if a sub element, stuch as block code, requires a different font, we override the default for that element.

[timeislove]

@facelessuser

ok, so as you assume most of the text is within tag p, why did you include tag p as a descendant to the class markdown-body in your css codes?

you defined almost all possible descendant but except tag p.

[facelessuser]

I really don't understand. P is a descendant: https://github.com/facelessuser/MarkdownPreview/blob/master/css/markdown.css#L983.

We target it when we need to. And when we don't need to, we don't.

[timeislove]

@facelessuser

seems diff to explain to you. here below part of the css code in your output html.

''' .markdown-body { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; color: #333333; overflow: hidden; font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif; font-size: 16px; line-height: 1.6; word-wrap: break-word; } '''

pls try generate a html from any sample md and alter the style in this class .markdown-body.

see if any effect on the display text, you would see what i meant.

[facelessuser]

Okay, here we go. In these examples I will override font-size with 20px. (I realize now I should of probably used a more dramatic size 🤷‍♂ , you may need to preview the images in another tab to visualize the size difference).

First, here is the text unaltered:

Here we override everything in .markdown-body. Obviously anything with more specificity that explicitly sets font-size of course will override anything in .markdown-body, but the base font is now 20px:

Lastly, we target p tags with a 20px setting. Anything not under a p tag will be unaffected. Notice the list items that are generated without being wrapped in p tags (if you specify Markdown lists with spaces between them, then the items are wrapped in p tags, but we didn't in this example):

Hopefully that illustrates better what I am saying. You can override whatever you want. Whatever you are alluding to with the p tag is a non-issue.

[facelessuser]

As it was never clear what was needed/wanted here, closing the issue.