CSS overflow-x: visible; and overflow-y: hidden; causing scrollbar issue

Answer 1

I used the content+wrapper approach ... but I did something different than mentioned so far: I made sure that my wrapper's boundaries did NOT line up with the content's boundaries in the direction that I wanted to be visible.

Important NOTE: It was easy enough to get the content+wrapper, same-bounds approach to work on one browser or another depending on various css combinations of position, overflow-*, etc ... but I never could use that approach to get them all correct (Edge, Chrome, Safari, ...).

But when I had something like:

  

      
         
          ... content with too-much horizontal content ... 
      
  

... all browsers were happy.