Forum Moderators: not2easy
Like in this example, in IE, you can click the link, in Firefox you can't.
<HTML>
<HEAD></HEAD>
<BODY>
<DIV><A HREF="test">test</A></DIV>
<DIV style="position:absolute;top:0px;left:0px;width:100px;height:100px"></DIV>
</BODY>
</HTML>
Is there any workaround in Firefox, some sort of hack?
Using Z-index is the obvious suggestion, but in my case, that's not an option. Instead, I'd like to mimic the IE behavior in Firefox, if at all possible.
You hack IE, not FF
I would agree if the priority is about "standards", but that's a subjective thing to treat coding standards like some sort of constitutional law. The fact is that Amazon.com's of today are not W3C valid and IE is the most common browser. Therefore, without trying to getting embroiled in a debate about standards, I must reject that ultimatum as unhelpful and too "ivory-tower".
Note that if you remove the link, the text underneath is no longer selectable. This is just some feature/bug IE implemented for links.
You were looking for a workaround, but you say you can't use z-index? what are you looking for then? this is the CSS forum, and it's a stacking (z-index) issue. What other solutions can't you use? HTML, and javascript too?
[edited by: Xapti at 5:50 pm (utc) on Dec. 13, 2007]
There's nothing wrong with designing to standards
My issue is those who forgo practicality due to an almost blind devotion to standards. If following the standards generates more revenue, decrease page load, etc. then that's fine, but in most cases, there's a good reason why today's major retailers generally ignore standards. Catering to obesity has nothing to do with it.
Now I just discovered... Run a Google search for "IE event transparency" and it seems that Mozilla has/is been looking into it, so (if I understood correctly) it doesn't even seem to be a standards issue anyway.
If you have numerous small layers (like a snow falling effect) or floating ads with irregular shapes, it can be really nice and convenient (depending on the exact application) to use one big div and be able to click through the empty parts.
In hind site, I guess it's not a CSS question per se. I posted this, because I thought this issue would be interesting to some of you. I just didn't expect to get ambushed by the Web Standards Evangelists.
in the first instance I would've given a similar answer as ratman7 to your original question
Is there any workaround in Firefox, some sort of hack?
There are no Firefox/Opera/Safari hacks
To expand, if you want to use hacks then that is entirely up to you, but you have to do it other way around. FF is Standards Compliant - by the way do you know that the CSS 'Standards' are only recommendations they are not set in stone, if Mozilla chooses to follow the recommendations then that is their choice, we work with what there is - it would be so much easier for all concerned if there was an actual "standard" - but the recommendations/specifications are the closest thing we have to a manual. Them together with the knowledge of which browsers support what, and how they implement it, is part of our crazy world ;)
So the 'mantra/ around these parts:
..design for FF and hack for IE..
is not to do with ideals - its meant as sound, practical advice
Fact: IE is the one browser with 'legal' loopholes that enables 'hacks'/workarounds, unlike the good ol' days, and we can't help that, that is the way it is.
I don't consider myself a standard evangelist, more a specification realist.
In your OP you said:
Using Z-index is the obvious suggestion,
I must reject that ultimatum as unhelpful and too "ivory-tower".
The fact is that Amazon.com's of today are not W3C valid and IE is the most common browser.
Nobody actually mentioned anything about 'W3C validation', that is a different thing altogether and I'm sure folks would be quite happy to give you a FF hack if there were one.. we know it's possible to have a fully functional site that does not validate - in fact some here probably help write them ;)
Run a Google search for "IE event transparency"
In hind site, I guess it's not a CSS question per se. I posted this, because I thought this issue would be interesting to some of you. I just didn't expect to get ambushed by the Web Standards Evangelists.
The early CSS hackers HAD to know their 'standards' inside out in order to even invent hacks, much the same as any language I expect, so please give a little respect to the folks that take their time to try and help and don't throw 'labels' around, please :) - You just might need the 'evangelists' if you want a hack..
If you can give us the full example (if it's different from the OP) then perhaps we can find you the best way to get it work, for you
Suzy
[edited by: SuzyUK at 1:10 pm (utc) on Dec. 15, 2007]
whether or not it should actually be classed as a bug seems open to debate - the entire issue appears to have other repercussions. e.g. how would the :hover pseudo class, when applied to the AP div, then be treated? - but that is no help to you and way outside the scope of this question and up to the mozilla developers to figure out!
----
I ran a couple of tests and found that IE and Opera cope with a simple case but the if you try to apply a
:hover event to the AP div then only Opera gives the likely desired result - while this is of no help to you it does show that even IE is not quite treating the scenario 'properly' either although it's enough for your needs I still have not found any solution without using z-index, which is not surprising as the whole issue is based on Stacking Contexts [w3.org] - can you clarify why it is you can't use z-index on the link?
I have been able to find a solution which avoids using z-index on the link but involves specifying a negative z-index on the AP div and a z-index on an existing containing element - would that be an option you could use?
With the latter it is going to depend on the contents of the div whether this would be effective.. alternatively it seems that some use sniffing techniques and just don't show the AP div/effect to FF users..
And if I really needed to use inline-block, and someone hit me with the ultimatum that you don't hack Firefox, well, that's just unhelpful and I may just give up instead of finding some workaround (like using a -moz class)
Especially when the statement is so curt and bereft of context ("you can't hack firefox" or "you shouldn't hack firefox"?) is it any wonder that someone coming from a different angle could misinterpret that statement?
Or are we getting caught up with the definition of "hack"? I did originally ask if there was a "workaround in Firefox, some sort of hack?" which is worded vaguely enough that I hope we're not arguing about semantics.
The way I see it, if it works out in the end as elegantly as possible, then who cares if you work with the most popular browser first and then try a workaround with Mozilla? And sometimes that may mean doing something non-standard like using a proprietary IE element (like colored scrollbars or whatever) because you like it and it makes sense to you, and THEN you look at the other minority browsers who just don't get the same level of attention until the day they get more market share.
(Back to the original issue, I don't know that I'm at liberty to discuss the exact concept here... if I can find another moment during this busy holiday time, will try to post a similar example later for discussion)