On Wed, Feb 18, 2009 at 8:09 PM, Bill Brown <macnim...@gmail.com> wrote:
> Casey wrote:
>>
>> <div>
>> <div>...</div>
>> <div>...</div>
>> <div>...</div>
>> </div>
>> The inner <div>s are all float: left'd. However, when the contents of
>> the <div>s is too wide for the browser, the line of DIVs break. Is
>> there a way to prevent this, other than setting a fixed width for the
>> container <div>? (Yes, the alignment of the <div>s is crucial.)
>
> Presumably, you want your divs to act like the cells of a table. In that
> case, something like this might work for you:
>
> CSS:
> ~~~
> .table-row-ish
> {
> white-space:nowrap;
> }
> .table-row-ish div
> {
> display: inline-block;
> display: inline !ie;
> zoom: 1 !ie;
> }
> ~~~
>
> HTML:
> ~~~
> <div class='table-row-ish'>
> <div>...</div>
> <div>...</div>
> <div>...</div>
> <div>...</div>
> <div>...</div>
> </div>
> ~~~
>
> Hope it helps.
> --Bill
>
Thanks! That works fairly well. I'm curious, what do "!ie" and the
zoom property do?) It works perfectly in Firefox, but in IE and
Safari, there's some quirk involving vertical alignment.
- Casey
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
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/
