css3 multi column floated image issue

Hi

here is the problematic page in Webkit browsers:
http://labs.webtemplateprofessional.com/twocities.html

the second image does not float to the right of the last column, but it is displayed below all the section text.

any ideas?

thanks

Yes it’s definitely a bug and a nasty one at that so is worth filing a bug report.:slight_smile:

yes, thanks - that fixed it
should I report the bug?

Hi,

It seems to be a bug in Safari.

I’ve had a play around with it and the only fix I can see is to add overflow:hidden to section which makes safari behave.


section {
    -moz-column-rule-style: inset;
    -moz-column-rule-color: rgba(0, 0, 0, .8);
    -moz-column-rule-width: 1px;
    -webkit-column-rule-style: inset;
    -webkit-column-rule-color: rgba(0, 0, 0, .3);
    -webkit-column-rule-width: 1px;
[B]overflow:hidden[/B]
}


Note that you also missed the opening anchor tags for your figcaption :slight_smile: