Is it possible to apply the CSS3 property -moz-column-width in XUL, and if so to which elements?
Re-reading ROC's original blog post here: http://weblogs.mozillazine.org/roc/archives/2005/03/gecko_18_for_we.html doesn't suggest it isn't
possible.
I had been hoping to create a multi-column list view from it, which didn't work. Then I tried the XUL below, to get dynamic re-flow:
<xul:box flex="1" style="overflow: auto;">
<xul:description flex="1" style="-moz-column-width:100px;">
<xul:label value="abc"/>
<xul:label value="xyz"/>
<xul:label value="123"/>
...
</xul:description>
</xul:box>
And that didn't work either, and finally I tried just plain:
<xul:description flex="1" style="-moz-column-width:100px;">
Lots of text
...
</xul:description>
<xul:textbox flex="1" style="-moz-column-width:100px;"
value="Lots of text"
</xul:textbox>
None of which I can get to work.
However, if I use:
<xul:box flex="1" style="overflow: auto;">
<html:div flex="1" orient="horizontal" style="-moz-column-width:100px; height: 100px;">
<xul:label value="abc"/>
<xul:label value="xyz"/>
<xul:label value="123"/>
...
</html:div>
</xul:box>
It works like an absolute charm. Why do I need to use HTML elements to do this?
Any thoughts much appreciated (Using 1.9.1)
Cheers,
N
I don't think it makes sense to apply the column properties to XUL
elements, since they only make sense in certain types of layout
systems. If you want to use them, you can put a block inside of the
XUL and use the column properties on that block.
-David
--
L. David Baron http://dbaron.org/
Mozilla Corporation http://www.mozilla.com/