Welcome to WebmasterWorld Guest from 220.127.116.11
Forum Moderators: not2easy
In the picture, some hair is extending downward out of the header box, and what I want to do is have the text links begin right below the header box, but also have the hair cover tiny parts of the links for effect, hence the z-index. My problem is that the links that are "under" the image, I can't click on them. Does anyone know of a way around this (to be able to click on the links under the image) while preserving what I want to do? Thanks.
- Thi Nguyen
i’m not an expert in css, but i think it’s not possible to do what you want. however, this is how i would solve it:
in an image editor crop the hair you want over your text.
put yor text links in a ul inside a div, use your newly created hair image as a background for the div, absolute position your header and your div.
of course, the text would still be over the hair, but i think this is the best way to merge your hair and your text links.
or you could also go to an image editor, crop the hair, and add the text right with the image editor in a layer below the hair, then, crop all the link options and save every link as a new image. just use a div for each image-link and absolute position your header and your image-links.
in this case you would accomplish the effect you want but you wouldn’t have text links, just image links, and maybe that’s not what you want…
hope it helps
The reason that your links do not hover is that the layer with the image is on the top level, so your mouse is actually hovering over the image, as opposed to the links on the div with the lower z-index.
In my opinion, the effort that it would take to achieve this result may not be worth it in the long run. But, that's just my €0.02!