I would say you just have to get all those browsers. All the browsers that count are free anyway. Most of them have their own quirks so there is no one that can replace them all when previewing.

Internet Explorer - Is quirky as hell, but it's the most common family of browsers.
Firefox - Has few quirks in the rendering, but they do exist.
Opera - The latest version actually renders correctly and does it fast too.
Safari - Is not very quirky, but suffers from using bolder characters that can mess up menus and such. There's a Windows version as well.
Lynx - A text browser that doesn't use CSS at all, good for checking your site for blind people. Also, it renders about the same as search engines render your site, so it's good for SEO.

I always design in Firefox since there are some kick ass add-ons I use all the time, then I check the site in the other browsers from time to time. I also use the "Total Validator" plugin in Firefox which lets me get screenshots of my site in various browsers on various systems.

As for the centering, I always use the following way:

position: relative;
This lets me position the element. I can use other values as well, but the "position" attribute needs to be present in order to use the "left" attribute later on.

width: 500px;
Also needed for use later on. This method can't be used on relative widths, there are other ways for that. Make sure the width is an even number for perfect placement. (Odd numbers work too, but then your box will lean one pixel to right or left.)

left: 50%;
This places the left side of the element smack in the center of the screen. If I resize the viewport it will adjust itself.

margin-left: -250px;
Now we just pull back the box to place it in the center. The number should always be half of the width.

This method works in all major browsers with the only drawback being that if the viewport is made smaller than the box the scrollbar won't extend to make the left part visible, but it's a minor problem.