Every time before I put a website online, I do some cross browser tests. And so did I yesterday before I launched this blog. Everything worked like a charme in Firefox 3.5 and Safari 4 on my laptop running Windows Vista. Even in Internet Explorer 8, the results where fairly good.
Nevertheless, some people reported in the comments that there would be a lot of CSS bugs.
So what did I do wrong? Well, I had assumed that Safari 4 on my Windows computer would be equal to Safari 4 on a Mac. I also thought that, with testing my layout in Firefox 3.5 on Windows Vista, I’d make sure that it looked the same in Firefox on any Mac or Windows XP/Windows7 computer.
Apparently, it does not. There seem to be some differences. Luckily, I found a fast and easy way to check your layout in different browsers:
Adobe Browserlab
Browserlab is a free flash-based service that lets you create real time screenshots of any webpage in a variety of browsers and operating systems. You can even split your screen and use two browsers at a time. The good thing about is that the two windows scroll simultaneously when you use any of the scroll bars. This makes it easy to compare various elements, like a comment form for example, in different browsers.
In contrast to other free services like Browsershots.org where you have to wait several minutes until you can see the screenshots, Browserlab takes only around 5 seconds to load.
Ok, that’s it. Go and give it a try here: Adobe Browserlab.
How do you do cross browser tests? Feel free to comment here!