button not working inside a fixed wrapper-CodePudding

I have a wrapper with the following CSS.

#wrapper
{
    position: fixed;
    overflow: auto;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    border: 5px solid#00beee;
}

and a button which onclick triggers the window.print() to print a multiple pages form. Now the issue is whenever I click the button no onclick event is being triggered. The reason for this was the CSS of the wrapper. Is there any wayout to resolve this issue as I need the wrapper to print multiple pages form with a border.

CodePudding user response：

Can you provide your JS code as well? I've tried to reproduce it in codepen and works perfectly fine: https://codepen.io/akowalska622/pen/mdMGbYG

const btn = document.querySelector('button');
btn.addEventListener('click', () => {
  window.print()
})

Also I don't see the reason why CSS would block your JS event listener

CodePudding user response：

There is nothing wrong with the css fragment, it works in the following context:

<div id="wrapper">
  <button onclick="alert('pressed')">Press me!</button>
</div>

https://jsfiddle.net/h4a8jdum/

I think you should add more info, where is your button, how does it relate to the wrapper...