Use em or px for <div>'s?

Using px for <div>s and em for everything else vs. em for everything

[EmptyTag]

I'm close to going live with a new website (or thought I was), and I'm somewhat satisfied with everything thus far. The design works equally well in various versions of FF, Opera, IE, Safari, Konqueror, Lynx, etc. The only browsers that I have tested that show signs of trouble are IE Mac 5.2 and Win IE 5.0, and I believe I can get these fixed, I just haven't focused on these yet as a priority. Whether I should is even questionable.

Now to the meat of the post:

I have designed without tables, and I used "em" units for almost everything that matters except border widths, etc. In other words, all the "containing" <div>s are "em". This in my opinion looks fine when a user increases the text size via his / her browser as all elements increase proportionally. The graphics stay fixed in size, but because they stay smaller than the <div>s that contain them, the layout stays acceptably pleasing and doesn't break up.

However, if for some reason a user decreases the text size enough, graphics remain fixed in size and, as the <div>s get smaller, the graphics extend beyond <div> borders. Additionally, any text that flowed around images is forced downward thus extending beyond the <div>s. This does not happen in Opera as Opera allows for dynamically re-sizing graphics along with the text, so the main containing <div>s and everything inside them simply becomes vanishingly small in proportion to the original size (in other words, Opera re-sizing looks great, i.e. proportionally the same, whether re-sizing text up or down). Without any graphics, all of the browsers re-size the design equally well up or down.

Question:

Is the design acceptable, considering it only breaks up after some downward text sizing, and remains stable and pleasing with text enlargement? Or, should I go back and change the <div>s to px so that the "containers" remain static whether text size is enlarged or decreased at the browser? The latter change (using "px" for <div>) is a compromise as well because I tend to like the containers to grow proportionally with the text, but at least with "px" the layout wouldn't break up when downsizing text.

Bottom-line:

Is the preference among designers and users here to constrain <div> "containers" and only allow the text to resize, or allow everything to enlarge proportionally and not worry about how it re-sizes when text is substantially decreased in size?

[mzhao]

I personally prefer relative sizes to fixed sizes, even though that may happen. Unless that sort of thing happens when text is shrinked just a little, you should be alright.