title: How to make overflow-y scroll without changing overflow-x to auto?
body: <p>I know this is a duplicated question.</p>
  
  <p>And below link is the answer the most nearest with my question that I've found.</p>
  
  <p><a href="https://stackoverflow.com/questions/6421966/css-overflow-x-visible-and-overflow-y-hidden-causing-scrollbar-issue">CSS overflow-x: visible; and overflow-y: hidden; causing scrollbar issue</a></p>
  
  <p>In this link, the <a href="https://www.w3.org/TR/css3-box/#overflow-x" rel="nofollow noreferrer">W3C spec</a> says:</p>
  
  <blockquote>
    <p>The computed values of ‘overflow-x’ and ‘overflow-y’ are the same as
    their specified values, except that some combinations with ‘visible’
    are not possible: if one is specified as ‘visible’ and the other is
    ‘scroll’ or ‘auto’, then ‘visible’ is set to ‘auto’. The computed
    value of ‘overflow’ is equal to the computed value of ‘overflow-x’ if
    ‘overflow-y’ is the same; otherwise it is the pair of computed values
    of ‘overflow-x’ and ‘overflow-y’.</p>
  </blockquote>
  
  <p>What I want to know is, are there any new solution of this.</p>
  
  <p><a href="https://jsfiddle.net/Canet/n4tvvora/3/" rel="nofollow noreferrer">The problem of mine is in this fiddle.</a></p>
  
  <p>I made 'sidebar' class of 'BootStrap' simple in a fiddle of mine.</p>
  
  <pre><code>overflow-x: visible;
  //overflow-y: scroll;
  </code></pre>
  
  <p>You can see that I commented out 'overflow-y: scroll' of class '.panel' in css part.</p>
  
  <p>In this case, 'hover' will work but 'scroll' won't.</p>
  
  <p>When if I clear that comment out, 'hover' won't work but 'scroll' will.</p>
  
  <p>What I wanna see is, 'hover' and 'scroll' working together.</p>
  
  <p>Does anyone have any ways or ideas to fix this?</p>
  
  <p>Or are there still no way to solve this problem?</p>