Problème drag & drop

Bonjour,

je m'adresse à vous car j'essaye de suivre le tutoriel JS sur la ré-organisation en drag & drop mais j'ai un léger couac !

J'aimerai faire un système tâches. La personne crée une tâche et toutes les tâches sont affichées. Ensuite, s'il veut l'indiquer comme terminée, il a juste à la glisser dans une zone prévue à cet effet et au moment où il lâche l'élément, un petit script AJAX se fait et le met en terminé.

Voici le code d'affichage pour UNE tache

<div class="col-lg-6">
                    <div class="panel">
                        <div class="panel-heading">
                            <h6 style="color: #969696">Par Ranarxhag <span class="pull-right" style="color: #27c24c; margin-right: 10px"><i class="glyphicon glyphicon-tasks"></i></span><span class="pull-right" style="color: #1c84c6; margin-right: 10px; cursor: pointer" data-toggle="modal" data-target="#new_tache"><i class="glyphicon glyphicon-eye-open"></i></span></h6>
                        </div>
                        <div class="panel-body">
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab accusantium assumenda atque doloremque ducimus</p>
                        </div>
                    </div>
                </div>

Vous l'avez vu, j'utilise le système de grille de Bootstrap pour positionner chaque tâche afin d'avoir un chouette rendu visuel.

Seulement, pour la vidéo de Grafikart, il dit qu'il faut positionner tous les éléments en absolu mais moi, quand je fais ça, ma mise en page est totalement détruite.

Auriez-vous une solution à mon problème ? :)

Merci !
Ranarxhag