Question

I’ve seen this behavior for years. Checkboxes and radios buttons can not be covered by DIV elements. No matter what z-index use.Is there some solution?

Besides, I am using simpletip (can’t use qtip). If you know about another jquery tooltip ready to use that work around this… I have my wallet open. THX

Answer 1

Ok, now we can work.

First off: This probably has nothing to do with your problem, but it can lead to other problems: Your HTML is riddled with errors:

http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fnomikos.info%2Fprivate%2Fwp%2Foptions-general.php.html

Most importantly a span may not contain a block element such as a div. Most of the errors is because you are using HTML syntax instead of XHTML syntax. It maybe easier just to use a HTML DOCTYPE, than fixing all the XHTML errors.

---

Your actual problem is that z-index only applies to elements that are positioned (absolute, relative, fixed) and since your “tooltip” isn’t z-index has no effect.

You’ll need to explain what you want it to do. Until then I can just give general suggestions:

You could make sure that the “tooltip” doesn’t become wider than the surrounding span. Currently it’s 300px wide and since the spans are flexible it spills out, when the spans become too small.

Or you give the “tooltip” position: absolute and smaller top and left values (BTW the current top and left values are currently useless, because they also only apply to positioned elements) and it’s parent span position: relative.