Kien Tran’s Daily Blog

Daily Mind Dump

Filed under CSS

View all posts on posterous with this tag »

Google Gives Up on IE, Creates Chrome Browser Plugin for IE

If you can't install Google Chrome and you must use Internet Explorer, there's a way to use Google Chrome's rendering engine inside IE: Google Chrome Frame. After installing the plug-in, you can test it by adding cf: in front of any URL from the address bar.
via googlesystem.blogspot.com

Not even the mighty Google with their army of developers has been able to defeat the monster that is Internet Explorer's non-standard and inanely quirky rendering engine. As a solution akin to visualizing an old server with software you can't upgrade, Google has now released a plugin that embeds the Chrome (Webkit) rendering engine inside an IE window.

It seems to be a pretty seamless solution comparatively speaking. The real trick will be how open will IT departments be to their users installing 3rd party plugins for their browsers.

Of course there is resistance from some designers saying that graceful degradation is still important. While I agree with this for the most part, there is a line that has to be drawn...usually around the time I've spent over twice as much time fixing IE rendering issues as I spent developing the site in the first place.

Posted
Views
and 0 Comments

Gotchas with writing custom Posterous Themes

As I was creating a custom theme for my Posterous blog, I ran into a few gotchas that the dev team should consider looking into.

The biggest glaring issue is the way they handle ordered/unordered list elements.  For some reason, Posterous seems to want to override the style settings for these elements with it's own settings due to the fact they use a global style definition for list elements! Here are the offending lines in Posterous's main CSS file "post.css"



li { margin-top: 5px; }


li { list-style-type: none; }


ul li { list-style-type: disc; }


ol li { list-style-type: decimal; }

Note that yes, there are 2 definitions of "list item" style.  As you can see since these are classless definitions, they will take priority over anything that is not explicitly defined, which includes the common "zeroing out the padding margin" trick that many developers use.

 * { padding: 0px; margin: 0px; }

Even though my included stylesheet is included after theirs, if I do not explicitly define the list styles they will be overridden in the priority system.  It's a very easy fix, but it is something that should be fixed on Posterous's end in my opinion.

 #profile ul li { margin-top: 0px; }

This will override their settings with my own. As you are designing your Posterous themes, keep that in mind if things seem out of place. Firebug is amazingly useful to see what styles are being inherited and which styles are being overridden.

Posted
Views
and 1 Comment
Fans (1)