Here's the original page http://www.jameswmikesellphd.com/index-1.html. It's not terrible in IE6, at least at default size, but quickly breaks when text size is increased. It's worse in FF3, even at default, and breaks worse when scaled. The guy wants to keep the design and basic fixed-width centered content, but have it degrade gracefully when text-size is scaled. So, I said I would work on it.
Since he wants basically the same horizontal dimensions and layout, I decided to use ems for text sizes and for all vertical dimensions (except images, of course), and pixels for horizontal widths. In the end, I had to use a couple of pixel top/bottom margins and a conditional comment or two for tweaking to align the bottoms of the two columns. At present, I've got IE6 and FF3 giving pretty much the same presentation at default size, and the design degrading relatively gracefully with scaling. That is to say, the text maintains its relative size and positioning with respect to other text and to the images, and doesn't overwrite either other text or other elements. The bottom borders of the two side by side columns, of course, no longer match after scaling. Here's the result at present http://bytekrafterstech.com/index-1.html. The first three selections on the menu work, but before I start on the next page, I thought that I would ask here if there were any way to provide this kind of vertical elasticity and maintain even bottom borders on the two columns. I think that it might be relatively trivial if all elements in each column scaled the same with text size changes, but, of course, images do not. Then again, even without the images, varying text elements would also scale differentially. A heading at 1.4em will scale a different absolute amount than body text at, say, .8em, so if one column has no headings and the other has several there will be a difference in the vertical dimension of the columns after scaling. And the amount of text wrapping that occurs as text scales up also has to be considered. A short line might not cause a wrap for several increments, while a longer line might wrap on the first increment, and bingo, your column is one line longer right off the bat. So, am I chasing a chimera? I can finish the other two pages the way I did the others, with even bottom borders at default and graceful degradation when scaled. But, if in fact there is a way to accomplish vertical elasticity and maintain relative size of the two columns, I'd like to try it. In looking around, I found that a whole bunch of very big time sites have designs that either don't scale at all, or that shyte the bed pretty messily when scaled. I've done a lot of searching, and a LOT of experimentation using elements with colored backgrounds to observe results, but I'm damned if I can figure out a way to accomplish it. And logically it just seems that the factors mentioned above mitigate against the possibility. Still, there's a ton of CSS knowledge hanging around here, so I figure if anyone knows a way, someone here will. Thanks. cheers, scott ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
