title: plotly.js legend overlap the graph
body: <p>Please see example screenshot - I cannot reproduce except on this site, it seems to be some conflict with the css but any ideas what? </p>
  
  <p>Normally, plotly moves the legend at the top if there is not enough horizontal space. However, this example shows that the legend overlaps the graph. Even if I make the legend orientation horizontal, it still overlaps the graph.</p>
  
  <p>Do you have any ideas why it could happen?</p>
  
  <p><a href="https://i.stack.imgur.com/IsQ1a.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/IsQ1a.png" alt="enter image description here"></a></p>