On May 26, 2011, at 11:53 PM, Joergen W. Lang wrote:

> I am trying to cook up an example of the CSS3 multiple columns layout module 
> with a floated image in the text. Test page is here:
> 
> http://www.joergen-lang.com/test/multicol.html
> 
> This works fine in recent FFs. Chrome seems to "eat" the line above the 
> image. Safari drops the floated image completely.
> 
> I am using some headings, paragraphs an a left-floated image inside a div 
> container.
> 
> Implementation issues?

Partly - the Safari 5 implementation is based on an older version of the draft 
(observe the width of the columns between Safari 5 and Chrome 10+, Gecko 
1.9.2+), and it has bugs. Both issues work correctly in recent webkit nightlies.

David is right that putting the image inside the <p> allows it to show in 
Safari 5. Setting the column-width in percentages make it work the same in 
Safari 5 as Gecko 1.9.2+, WebKit nightlies/Chrome.

What Opera 11.11 does with column balancing has me seriously puzzled :-p.

> Error on my side?

Yes ! :~)
You need to at least specify a column-rule-style for the column-rule to display.
‘column-rule’ is a shorthand and works just the same as the ‘border’ shorthand. 
The default '-style’ is ‘none’. The ‘-color’ is optional; if not specified, it 
takes the <color> computed for the element.

Thus: column-rule: 4px solid;

Here is my test file, for the record:
http://dev.l-c-n.com/_temp2/multicol.html

Philippe
--
Philippe Wittenbergh
http://l-c-n.com/






______________________________________________________________________
css-discuss [css-d@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/

Reply via email to