CSS Multi-column Layout - Chrome does not allow to have the right column longer than the left?

i just coded my website. I am a photographer so all my content are pictures. Every single picture is organized in a div- Box.

I used a flexible multi-column Layout:

.content {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
max-width:1400px;
}

Explorer and Firefox works perfect, but Chromedoes not allow the right column to be longer than the left and it looks horrible:

http://www.rosioffenbach.com/tarotpt1.html

A looooooot of whitespace at the right side.

I am very thankful for your help. I have to say that I am a beginner.

I tried

-webkit-column-fill: balance; -webkit-column-fill: balance-all; But i did not work

.content {
width:70%;
position: relative;
margin-right: auto;
margin-left: auto;
padding-top:1%;
max-width:1400px;
}


.content {
  -webkit-column-count: 1;
  -webkit-column-gap: 3%;
   -moz-column-count: 1;
 -moz-column-gap: 3%;
  column-count: 1;
  column-gap: 3%;
}

I want that as in firefox and explorer the columns are as equal as possible, and that includes the option that the right column is longer than the left.

Try removing display: inline-block from .contentstrecke{ }. After that removal, Firefox and Chrome look identical.