angular js bootstrap ng-repeat behaving wierd

angular js bootstrap ng-repeat behaving wierd

I am trying to display some data as widgets inside ng-repeat but angular
is behaving wierd. I don't seem to understand what is causing this. The
HTML where I am trying to put ng-repeat is this.
<div class="span3 widget-container-span">
<div class="widget-box">
<div class="widget-header
widget-header-small
header-color-dark">
<h6 class="smaller">{{ me.head
}}</h6>
<div class="widget-toolbar
no-border">
<label>
<input type="checkbox"
class="ace ace-switch
ace-switch-3" />
<span class="lbl"></span>
</label>
</div>
<div class="widget-toolbar">
<span class="label
label-warning">
1.2%
<i
class="icon-arrow-down"></i>
</span>
<span class="badge
badge-info">{{ me.label
}}</span>
</div>
</div>
<div class="widget-body">
<div class="widget-main">
<div class="alert alert-info">
{{ me.desc }}
</div>
</div>
</div>
</div> <!-- end widget box-->
</div><!-- end span3 widget container-->
If I put ng-repeat on the first div (span3 widget-container-span), the
widget dragging does not work.
If I put the ng-repeat in second div (div class = "widget box"), drag and
drop capability works but boxes come vertically stacked not horizontally
and spacing between them is uncounted. Its like a column drag and drop.
My guess - Container div stops to work when use angular ng-repeat.
Please guide what I am missing.
P.S. I am using partials.