0

Consider the following fiddle: http://jsfiddle.net/xNSm2/

In this scenario I've got a div with a background-image of a triangle. I also have a div underneath it.

I need both of those divs to be clickable.

I cannot have the red div sit on top of the green div. Red must be underneath.

The only solution I can think of is to have the green div have a diagonal border, rather than a square one. Is this possible?

Allen S
  • 3,471
  • 4
  • 34
  • 46
  • `.underlyingDiv {z-index: 2}`. Is it okay for you, or you want to get the "Green div clicked" notice only when you click into green background (not in the whole square link now)? – pavel May 31 '14 at 09:18
  • That's exactly right @panther - I'd like it to only be noticeable when the background image is clicked, not the empty space. – Allen S May 31 '14 at 09:25
  • [http://stackoverflow.com/questions/3680429/click-through-a-div-to-underlying-elements] check this link it may be helpful to you – ashok_p May 31 '14 at 12:52
  • This may help as well: [http://stackoverflow.com/questions/12837391/how-to-make-a-triangular-shaped-link-without-using-image-map](http://stackoverflow.com/questions/12837391/how-to-make-a-triangular-shaped-link-without-using-image-map) – MilkyTech May 31 '14 at 14:22

0 Answers0