css How to bind to the click event of the container when an element within the container is clicked_html/css_WEB-ITnose

<div class="btn-today glow three-btn">　　　　<span class="rb">本　　　　　　　　<span class="rt">ben</span>　　　　</span></div>

.btn-today:active{    background: rgb(255,255,255);}

When I click 'this' inside 45a2772a6b6107b401db3c9b82c049c2, the style btn-today:active cannot be activated. Clicking outside 45a2772a6b6107b401db3c9b82c049c2 can activate it.
Is there any way to solve this problem? Thanks. . . .

Reply to discussion (solution)

should be .rb:active{
background: rgb(255,255,255);
}

.btn-tody>span{
pointer-events: none;
}

.btn-tody>span{
pointer-events : none;
}

Can pointer-events ignore upper-level events or ignore and activate lower-level events? I tried it and there was no change.
I want the background of the container to change color. On the same page, IE has this problem, but FF and Chrome have no problem