Code get out of bounds from html / Code is not wrapping

[Unfresh25]

It's my first time using rmarkdown and also using distill. I've been working well while using default style for rmarkdown and html_document. My problem is that when I decided to change to distill_article I got a problem when code was displayed. I got into the default css and I found that if I remove the following line:

@media (min-width: 768px){
d-article pre, d-article div.sourceCode, d-article div.sourceCode pre {
overflow: hidden !important;
}
}

from the generated html, it works well but if I try to publish it I get error while publishing.

Is there a way to fix it?

[technocrat]

Try using the markdown syntax by fencing with triple backticks.

[Unfresh25]

Mmmm, maybe it could works. But I already solved it by just setting a css as a theme.

The css is like:

@media (min-width: 768px){
d-article pre, d-article div.sourceCode, d-article div.sourceCode pre {
overflow: auto !important;
}
}

I only add in that case bcs it only had problems when width was more the 768px.

[cderv]

@Unfresh25

but if I try to publish it I get error while publishing.

What type of error do you get ?

@Unfresh25

But I already solved it by just setting a css as a theme.

If your question's been answered (even by you!), would you mind choosing a solution? It helps other people see which questions still need help, or find solutions if they have similar problems. Here’s how to do it:

FAQ: How do I mark a solution?

If your question has been answered, don't forget to mark the solution! How do I mark a solution? Find the reply you want to mark as the solution and look for the row of small gray icons at the bottom of that reply. Click the one that looks like a box with a checkmark in it: [image] Hovering over the mark solution button shows the label, "Select if this reply solves the problem". If you don't see the mark solution button, try clicking the three dots button ( ••• ) to expand the full set of options. When a solution is chosen, the icon turns green and the hover label changes to: "Unselect if this reply no longer solves the problem". Success! [solution_reply_author] …