Hover over code triggers overflow change on the crayon-main container

[dingo-d]

trafficstars

When ever I hover over my code, I get a change in the .crayon-main container from overflow: hidden to overflow:auto, and in some cases that causes the code to flicker. Is there any way to stop that from happening?

From what I see the changes appear in the crayon.min.js on lines 1217 and 585

You can see the issue here for instance: http://madebydenis.com/adding-custom-controls-to-your-customization-api/

[mengguang]

I have the same problem.

[philscott-rg]

Hit the same problem - I've put this in the site styles which seems to be okay as a workaround:

table.crayon-table[style] { width: 100% !important; }

[eladkarako]

^{_{Here  is  a}}  magic  ^{_{solution  :]     place it just before the </body>:}}

<script>
NodeList.prototype.forEach = Array.prototype.forEach;
NodeList.prototype.map     = Array.prototype.map;

document.querySelectorAll('div[id^="crayon-"][class*="crayon"]').forEach(function(element){
  var container = document.createElement("pre");
  container.innerText = element.querySelectorAll('div.crayon-line').map(function(line){ return line.innerText; }).join("\n");

  element.parentElement.replaceChild(container, element);
});
</script>