A Note About Internet Explorer

Digital Jedi

Staff member
Probably a lot of you still use IE as your main browser. And that's great. I don't see any reason why anyone shouldn't use a browser that meets their needs and their familiar with. I, personally, use Chrome, after migrating from IE to Firefox and a very brief stint in Opera. I usually have to open all three (and sometimes Safari) when developing for the web.

With that said, IE is also the bane of my existence, strictly from a developer's point of view. The non-techy explanation is that there are universal standards in place for coding for the web. These standards are, by and large, strictly adhered to by most modern browsers. Most. IE, on the other hand, doesn't, and hasn't always played by the rules.

And herein lies the problem you may encounter with this site. When most browsers were already adhering to these universal standards, IE required tricks and hacks to the code to make it work and look as the developer of the website intended. It often meant that something simply designed rendered great in Firefox, but required hours/days/weeks of rethinking and research just to make work in IE. To compound matters, the tricks often had to be version specific. Meaning, what worked in IE8, wouldn't necessarily work in IE9, so you had to come up with yet another hack. Most web developers you talk to will tell you how frustrating that can be.

For CoG, I had a vision of how I wanted the new site to look. And while I did make some IE specific modifications to the code, I realized that I would be spending far more time than I wanted developing specifically, or making sacrifices, for one type of browser. And in this age of web development that's moving rapidly forward, I decided that this wasn't acceptable.

So while I'll address most style issues that look super wonky in IE (most notable being the flexbox I used for the navbar), from now on I'll primarily be designing the site for only the most modern of browsers. That means, if you have Firefox, Chrome or any other free browser, you'll probably not notice anything wrong. If you have IE10 or above, you might not notice anything, either. Nor will you notice anything amiss in your very modern mobile web browsers. Not intentionally. But when it comes to older versions of Internet Explorer, I'm afraid I won't be spending the time to accommodate something that should have been properly rendering code that was a standard ten years ago. Know that this isn't me being persnickety about the matter. Just making a decision about the time I want to invest in supporting web browsers that should be on their way out.

For optimal experience of CoG, I would highly recommend switching from any older versions of IE to a more modern browser out there. Chrome and Firefox being a couple of my favorites. Or if any style issues you encounter aren't that big of a deal to you and don't diminish your experience, that's great, too. Thanks for reading my unintentionally long rant, and I hope you enjoy your time here on CoG. :peace:
For what it's worth, Safari on OSX (Mavericks) seems to do something wonky with the menus:


I'm not exactly sure why, but with Safari being webkit based and all I found this a bit odd.

...and for the record we'll leave out any OSX/Safari bashing for the time being. The latest Safari update is currently blowing Chrome out of the water performance-wise from what I'm experiencing and their web inspector tool is getting quite good 8^D
Interesting, because there's no reason Safari shouldn't support the flexbox property. I'd expect this on IE 8 or below, but not Safari. I'll look into. Generally, inconsistencies with Safari are few and far between.
Here's a shot of the computed CSS for the "new posts" menu item. Not sure if it helps.


If I get time later I'll try to drag through the code more and find the difference between this and Chrome (works fine in OSX).

It might matter, might not, but I am seeing a couple of token errors in the CSS too:

[Warning] Unexpected CSS token: } (style-b27d7ce8-00064.css, line 380)

...affected CSS rule
#featured ul.ui-tabs-nav li span{
font-size:11px; font-family:Verdana;

[Warning] Unexpected CSS token: } (style-b27d7ce8-00064.css, line 459)
...affected CSS rule
.radius-fix td.tcat:first-child { border-bottom-left-radius }
/* ||[ INNER CITY BLUES ]|| */

actually that looks to be it there, I think. border-left should have a value (even if 0) and I don't think border-bottom-left-radius is a proper labeling or property, unless I'm missing something with LESS or SASS, which I admit I'm not the most on par with yet. 8^D
Ah yes, radius-fix was a class I had setup to fix some issues with non-vbulletin extensions that seemed determined to find out how many tables could be nested on the same page. It was messing with some of my style rules. I didn't realize I hadn't finished it. However, it doesn't seem to have fixed the issue. It looks like Safari should be using the new syntax for flexbox. I'll try sticking in the old vendor prefixes and see if that corrects anything.

Yup, border-bottom/top-left/right-radius are all CSS3 properties. The new stuff is killer.
Oh, you mean composing CSS with a framework. Haven't even looked into it yet. And I'm probably shooting myself in the foot not doing so.
nah, no foot shooting to be had yet. I'm still more of a middle/back tier developer so I'm learning as well with the uber fancy HTML5/CSS3 stuff out there.

Let me know if you need me to poke at anything else.