Over the past few weeks I’ve been redoing the Mid Hudson Astronomical Association website. It looks like this:
Yes, it’s dark, but that’s when astronomy happens. The site is built on Drupal, as I’ve gotten some experience there recently doing sites for the Poughkeepsie Farm Project and MHVLUG. For people that want to know more about the tech side, I’ll be giving a talk in January at MHVLUG.
I did come across one really odd thing in working on the three boxes (I was calling them chicklets, but they look less like that with content in them). Round corners in CSS are awesome (thank you w3c). IE9, at least the version in Adobe Browser labs, still doesn’t support it (really Microsoft? I thought you were getting down with the standards). While a TD can have a round background, it’s border is always square (I almost understand why, but it definitely limits what you can do. It also took me a while to realize this was happening as the round is subtle enough on the front page). Div height 100% doesn’t work inside a TD (it seems like it should, but no one implemented it that way).
So the only way to get 3 columns that correctly degrade to 2 columns (50% of screen each) when one is missing (there will not always be a special event), have round borders, and be the same height is…. jquery. While on the one hand, it seems crazy, on the other hand, yay for jquery. You can view the source on the website to see how I did it.
It's always more complicated 
I’m using ShadedBorder (http://www.ruzee.com/blog/shadedborder) for rounded corners in the web app I work on. I tried a *bunch* of things to get corners to work in IE, and this was the most consistent. Our app supports IE7 and up. This library claims to work with IE6 as well, but I haven’t tested that. You can use it with jQuery or Prototype.
LikeLike
Good link, I might check it out. Honestly, as long as Microsoft keeps ignoring the standards, I’m fine with having the content I create look worse over there. Given that it’s a hobby and not a job, it’s a luxury I’ve got. 🙂
LikeLike
I did a happy dance when we dropped support for IE6. I’m hoping IE9 is as compliant as they say it will be. Adding some HTML5 goodness to our app soon – IE users will instead see a notice saying they need to change browsers if they want the new ui candy. Basically, we have to add the html5 support or possibly lose new clients, who are demanding it.
LikeLike