Most of you will find this post to be boring, but I'm hoping that a select few of you will think its the coolest thing since sliced bread. Now, I'm not sure if I'm the first to figure this out, but I did figure it out on my own. So if you have heard of this before don't jump down my throat. After all, what do I know? I'm not a scientist...
Yesterday I was working with a SPRY Accordion, which if you don't know is an AJAX script that comes with Adobe Dreamweaver. Here was my problem: I was using a DOCTYPE to tell IE to stop being quite so dumb and act a little bit more like a grown-up browser that is actually compliant with web standards. This allowed my Accordion to work in IE. However, it still didn't force IE7 to use the overflow style properly. Whenever I would use the accordion it would bring up a horizontal scroll bar half way down the page. It looked like I was using frames or something. Anyway, because of company policy I couldn't just turn the horizontal scroll bar off with overflow-y. I also couldn't just set it to visible because Mozilla Firefox and other browsers perform different actions than IE when you set the overflow style to visible.
I needed a way to tell IE7 and just IE7 what to do. The common IE hacks like !important and *HTML don't work in IE7 anymore because MS is just smart enough to remove all of the hacks that web designers use to fix the bugs in IE, but not smart enough to fix the bugs that we needed the hacks for in the first place. After hours of banging my head against the wall, I finally snapped a little bit and just started inserting random characters into my CSS until I found a way to fool IE7.
So here it is; If you put a forward slash just before a style it will prevent compliant browsers from reading the style but IE7 still reads it. Below is an example. If you look at this box in any browser other than IE it will appear red, but look at it in IE7....Bam! that box is green!
I hope you all enjoy that little hack, I know I will.