Firefox, Internet Explorer, Chrome, and Safari

Remember when I said there was a problem with my template layout that caused it to display funny in every browser except Firefox? Well I finally got around to fixing it and thought I’d share the solution with you all. I figured it might be helpful to someone.

Why The Difference?

The different browsers display things slightly different sometimes because they use different “kits” (or rather — rendering engines)
to parse the HTML/CSS/JavaScript and convert all that code into the page you see (I’m trying to keep this in layman’s terms as much as possible).

Who Uses What?

Firefox uses Gecko
Chrome and Safari use Webkit
Internet Explorer uses Trident
Opera uses Presto

What To Do?

For code you only want used by Webkit (Safari & Chrome):
follow the guide here — http://css-tricks.com/how-to-create-an-ie-only-stylesheet/

For code you only want used by Trident (Internet Explorer):
follow the guide here — http://www.evotech.net/blog/2008/09/css-hack-for-google-chrome-and-safari-31/

Alex

Alex runs his own business designing websites and mobile apps, loves spending time with his wife and kids, and is still very much a kid at heart. He enjoys reading comic books, watching TV/Movies, playing video games, playing with action figures and Legos, and playing football and basketball.

More Posts – Website – Twitter – Facebook