Cross Browser problem

[Den-Dezyn]

Hi i am designing my first portfolio in my content section of my page i am using the -moz-column-count:3; /* Firefox */ -webkit-column-count:3; /* Safari and Chrome */ column-count:3; column-width:250px; column-gap:20px; to display my content with text and images.In firefox it looks like the image below but in other browsers the first images shifts to the middle column and the ship gets chopped in half i wondered if anyone could direct me towards a fix for this problem.

[gongpex]

Hi i am designing my first portfolio in my content section of my page i am using the -moz-column-count:3; /* Firefox */ -webkit-column-count:3; /* Safari and Chrome */ column-count:3; column-width:250px; column-gap:20px; to display my content with text and images.In firefox it looks like the image below but in other browsers the first images shifts to the middle column and the ship gets chopped in half i wondered if anyone could direct me towards a fix for this problem.

if in CSS when you using pxfor example:column-width:250px;in column-count you must using px toofor example:column-count:3px;I hope this can help you

[Fmdpa]

in column-count you must using px too

Check out this page. You are specifying how many columns should be displayed. Pixel values are only used for properties that specify the size of something.

[Den-Dezyn]

Fmdpa thats where i learnt about it but it doesnt answer my cross browser problem though.gong thats wrong you cannot give a pixels size to a column quantity only to the column width and column gap.

[dsonesuk]

I think the problem is that the use of column-width, gap etc is css3, which is still in development, and so browsers are making up their owns rules on how to implement these css3 styling, which will be different for different browsers.Also I think the css3 column width, would mainly be for text rather than images, but the smaller images seem to work fine, it only becomes a problem when the image is wider than the column widths created.To fix:Since the image seems as though it is at the end of content container, why not just do that! place it below the content container, and place another image of same height to sit beside it.

[Den-Dezyn]

Thanks dsonesuk i guess your right and it will only work properly in time as css3 becomes user friendly in all browsers, as for the ship pic its actually before the text in the third column which is why i thought i have a problem. As its all just testing content i will be more careful in my choice of images when i replace it with the final content.