Michael ORourke wrote:
> http://www.basalweb.com/test/dltest3.html
> Ok, a few issues... The doctype was xhtml 1.0 strict and I
> didn't close the <br> tags. Fixing this exposed overflow
> issues with IE so I added overflow:auto to all selectors. So
> far so good. Unfortunately, the results in Opera 9 show all
> the divs centered, but now they're all stacking (according to
> browsershots). I'm thinking it's an issue with width as
> opposed to display, but I'll do some more testing.
Mixture of display: table / table-cell / inline-block may work for such
cases in most browsers, but the mixture that you have got now is a bit
strange... You have:
.featureItem2 {
display: table-cell;
}
/*\*/
html .featureItem2 {
display: inline-block;
}
/**/
The second rule overrides the first, so all browsers that support
inline-block use that one. I guess your intention was to feed the second
rule to IE only. If so, you can change that with:
* html .featureItem2, *+html .featureItem2 {
display: inline-block;
}
In this way Opera will use table-cell with better results.
Some notes/caveats:
- the problem with Opera now is that its shrink-to-fit computation for a
table including inline-blocks doesn't seem too good.
- table-cell and inline-blocks have different behaviors. If in your case you
may have so many (or so big) blocks that they do not fit in a 'line' the
results will differ (do you want them to wrap or to overflow?) You should
also check the case of blocks not all having the same height (unless you set
a fixed height for them.)
- the above hack that I wrote to feed IE only is not the most reliable one
(in the part *+html for IE7.)
Best regards,
Bruno
--
Bruno Fassino http://www.brunildo.org/test
______________________________________________________________________
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/
