So designers now days and in general like to get really fancy! Thats great it looks great I get it... However it doesn't make life easy and one situation I tried to cut a corner and found myself in a situation. Needless to say most browsers support this so I am good with it... Basically the design called for an overlaying border that was 1px all the way around an image. Yes I could have done 4 images and connected them.. But that is messy so I just positioned absolute bla bla bla... BUT! Then when I needed to click on something below it lo and behold the stinking overlay stole it! So here is the CSS fix...
pointer-events: none;
