2

My Distill Blog is not showing the scroll bar for wide codes and outputs.

It is possible to scroll on mobile devices (without the bar appearing), but in the Desktop browser not even that.

Also, I don't know how to set the code cells' width to match the body text's width.

I really couldn't find anything to help me manage the CSS needed to deal with this problem, and I think it's something related to alignment stuff.

Here is the visual problem: enter image description here

juliomalves
  • 42,130
  • 20
  • 150
  • 146

1 Answers1

3

You can add overflow: auto !important; to div with class sourceCode. !important must be there, because you are using it somewhere else and without this you cant overwrite it.

Here is example:

enter image description here

Kretiss
  • 657
  • 4
  • 15
  • Perfect! Thank you very much. – Filippe O. Gonçalves Mar 02 '21 at 21:08
  • Can you please upvote my answer and accept it? Thank you :) – Kretiss Mar 02 '21 at 21:12
  • Do you know how can I show the scroll button in mobile devices? The scroll works, but the button is hidden. – Filippe O. Gonçalves Mar 02 '21 at 21:14
  • Then you can accept it only.. I will be gratefull for that :) And for the scrollbar, that little tricky, because browsers doesnt support that css very much. And on the mobile devices, scrollbars are often little or not visible, so.. see this post https://stackoverflow.com/questions/22907777/make-scrollbar-visible-in-mobile-browsers and try something :) – Kretiss Mar 02 '21 at 21:18