html - How to use height: auto property in css with JQuery custom content scroller when calling mCustomScrollbar() manually -

I'm trying to use the JQuery custom scroll-bar script on my jekyll powered github site. I would like to use it for scrolling code blocks in each page, as if for each code block there is a horizontal or vertical (or both) scroll bar, if overflow occurs, however, there are variations in the different code blocks heights and hence the plugin Has to work with CSS property max-height: nPx instead of height: nPx .

The problem is that if I define only the maximum-height: nPx without height: nPx property (which I do not like because I want the height is automatic / different with the content), the whole code block falls as if the scrollbar completely disappears, with the content.

Maximum-height defined with height: Setting nPx Content and scrollbar work fine: apart from this there is no alternative: my In case, height must be

I use max-height.html maximum-height > Example, see the example of the author in the MCustomScrollbar is not called manually because I'm doing this because I Area "copy-paste can not."

What am I missing here?

You can try that I have updated your JSFold example - see. Simply include styles and scrollbars from github.io and apply it to your container when the document is ready.

Do not forget to add the class to the scrollbar - Scrollbar is completely customizable via CSS classes. List of ready-to-use classes available on In your example, I have the background

  .scrollbar-light & gt; Using the square  scrollbar-light . .scroll-element {background-color: yellow; }