848718 - javascript style.height disables <a href>

Status: RESOLVED INVALID

(Core :: General, defect)

Description

[[e-mail]]

Attachment: test.html

User Agent: Mozilla/5.0 (Windows NT 5.1; rv:18.0) Gecko/20100101 Firefox/18.0
Build ID: 20130201065344

Steps to reproduce:

4 <div> blocks, 3 relative under each other, 4th absolute same height as 2nd <div>.
determine height of 2nd and 4th div and set height to largest of the two,
so that 3rd <div> is under 2nd and 4th <div>
2nd <div> contains <a href=""> elements.




Actual results:

Call to javascript to set the height:
function set_height(objid, h) {
	document.getElementById(objid).style.height = h + "px";
}
After this call, links in the div with changed height are not functioning.
Without the call, links are functioning: Change the javascript function to:
function set_height(objid, h) {
//	document.getElementById(objid).style.height = h + "px";
}
and links do function as links

Comment 1

[Boris Zbarsky [:bzbarsky]]

The page gives cms_right_div, which is otherwise empty, a nonzero height.  This div is positioned on top of the link in the cms_left_div, so clicks go to the cms_right_div, not to the link.  You can see this easily by adding a background to the cms_right_div.

I get this behavior in every single browser I have here (Chrome, Opera, Firefox, Safari), not surprisingly.

You want to set a z-index on the cms_left_div or cms_right_div or both to change the ordering, or change their order in the source, or set pointer-events accordingly if you want things to be transparent to events.

Comment 2

[[e-mail]]

Thank you very much for the answer, it helps a lot.
The right-div should have a left offset.
With the offset it works fine.

I tested it in Internet Explorer, in that browser the links worked.
Considering the overlap of the right and left div in the test-file,
the behavior in IE is probably not the desired behavior.

Comment 3

[Boris Zbarsky [:bzbarsky]]

IE has some weirness where transparent things are sometimes but not always also transparent to events, which is what might have been going on here.