Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

168
Views
how to prevent pointer-events:none affect a button insdide of element with this style

I want the button inside the .container to be clickable, even though it has the pointer-events:none property.

The context is this: in my real code, I must prevent that a parent div (something to the style of the div that has the class .container) cannot be dragged, or click pressed and dragged somewhere.

I think if there is a way to solve this, my problem is solved. this is my code:

function myFunction(){
 alert("click")
}
.container{
  width:30vh;
  height:30vw;
  background:red;
  display:flex;
  justify-content:center;
  align-items:center;
  pointer-events:none;
}
<div class="container">
  <button onclick="myFunction()">click</button>
</div>

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Add pointer-events: all or pointer-events: auto to the style of your button.

function myFunction(){
 alert("click")
}
.container{
  width:30vh;
  height:30vw;
  background:red;
  display:flex;
  justify-content:center;
  align-items:center;
  pointer-events:none;
}

.container button{
  pointer-events: all;
}
<div class="container">
  <button onclick="myFunction()">click</button>
</div>

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!