Jquery sortable, over, on side or under

Question

I use sortable to sort divs.
Is it possible to sort divs left or right, and not just up or down?
I created a fiddle with boxes. I can arrange them over and under eachother but not on the side of echother. Is that possible?

UPDATE Also i'd like to choose, if the block is staying on the side or under/over, for each box!

Fiddle: http://jsfiddle.net/3qr8z83v/

HTML

<div class="col-lg-2 well" id="blocks">
  <div class="block" id="block1">1</div>
  <br>
  <div class="block" id="block2">2</div>
  <br>
  <div class="block" id="block3">3</div>
  <br>
  <div class="block" id="block4">4</div>
  <br>
</div>
<div class="col-lg-2 well" id="dropzone"></div>

CSS

.block {
  width: 30px;
  height: 30px;
  background-color: blue;
  color: white;
  text-align: center;
}

JS

$('#blocks').sortable({
  connectWith: '#dropzone',
});
$('#dropzone').sortable({
  connectWith: '#blocks',
});

Answer 1

Jquery sortable cannot work as a grid. i will have to use droppable for that.

Answer 2

floating left sortable div might work so add the CSS #blocks>div { float: left; }

Although you might need to adjust your dropzone.

Answer 3

Something like this

#dropzone .block
{
    float:left !important;
}

#dropzone
{
    display:flex;
}

Answer 4

Remove br tag form your markup and float: left to this class .block {} Demo