How to overlap divs and be able to access both?

[djjd47130]

It's a little complicated to explain without a picture, but I'm trying to make a menu bar with angled lines between the items. Overlapping two items I have accomplished, using div's with background images (transparent png's) but when hovering over one actually activates the one next to it, because it's overlapped.

Here's an attempt to draw what I want:
----------------------------------------------------
/ First Menu Item / Another item / A 3rd item /
----------------------------------------------------

The slashes (/) represent the angled lines which should show between each menu item. Again, I have them overlapped OK and perfectly lined up, but since the one to the right is on top of the one to the left, hovering over any area around the angled divider, whether to the right or left of the line, activates the item to the right of the line. How can I make the mouse activate the item to the left when pointing just barely to the left of this angled line?

JD Solutions

 

[Vragabond]

http://www.cssplay.co.uk/menus/tab_overlap.html

http://www.cssplay.co.uk/menus/overlap.html

http://www.cssplay.co.uk/menus/overlap_two.html

Check out how Stu Nichols did his. You can check his other examples, while on the page.

[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]