Opera pass click to overlaped button

<div style="width: 100px; height: 25px; position: relative;">
    <input type="button" style="width: 100px; height: 25px;" onclick="alert(1);" value="Input"/>
    <div style="top: 0px; left: 0px; bottom: 0px; right: 0px; position: absolute; background-color: #000000; opacity: 0.3;"></div>
</div>
<br/>
<div style="width: 100px; height: 25px; position: relative;">
    <button style="width: 100px; height: 25px;" onclick="alert(1);">Button</button>
    <div style="top: 0px; left: 0px; bottom: 0px; right: 0px; position: absolute; background-color: #000000; opacity: 0.3;"></div>
</div>

When I click on first button(<input>) in Opera 11.01, button don't pressed, because next <div> overlaps <input>. But if I click on second button(<button>), it is visually pressed(event OnClick isn't called). Such behavior is observed in Opera only, in Firefox and Chrome behavior is normal - buttons aren't pressed. What's wrong?

Example on jsFiddle

Updated: Behavior:

• Click to first button in Chrome. It's not clickable, alert doesn't appear. Correct;
• Click to second button in Chrome. It's not clickable, alert doesn't appear. Correct;
• Click to first button in Opera. It's not clickable, alert doesn't appear. Correct;
• Click to second button in Opera. Button visually clicked(!!) - button's style changed to state "pressed", alert doesn't appear. Incorrect - Button shouldn't be pressed, because it is blocked by div. Behavior should coinci开发者_如何学编程de with first button;

Try adding a z-index on the div

<div style="width: 100px; height: 25px; position: relative;">
    <button style="width: 100px; height: 25px;" onclick="alert(1);">Inpute</button>
    <div style="top: 0px; left: 0px; bottom: 0px; right: 0px; position: absolute; background-color: #000000; opacity: 0.3; z-indeX: -1;"></div>
</div>
<br/>
<div style="width: 100px; height: 25px; position: relative;">
    <button style="width: 100px; height: 25px;" onclick="alert(1);">Button</button>
    <div style="top: 0px; left: 0px; bottom: 0px; right: 0px; position: absolute; background-color: #000000; opacity: 0.3; z-index: -1;"></div>
</div>

Updated: JsFiddle