diff --git a/web/public/style.css b/web/public/style.css
index 266cd05..518db8a 100644
--- a/web/public/style.css
+++ b/web/public/style.css
@@ -249,6 +249,17 @@ table.tvguide {
   text-align: right;
 }
 
+.filler-list .list-group-item {
+  min-height: 1.5em;
+}
+
+.filler-list .list-group-item .title {
+  margin-right: 5px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 /* Safari */
 @-webkit-keyframes spin {
   0% { -webkit-transform: rotate(0deg); }
diff --git a/web/public/templates/filler-config.html b/web/public/templates/filler-config.html
index 6e8d2e1..1824d1a 100644
--- a/web/public/templates/filler-config.html
+++ b/web/public/templates/filler-config.html
@@ -63,13 +63,14 @@
                 </div>
 
 
-                <div class="modal-body container list-group list-group-root" vs-repeat="options" dnd-list="content" ng-if="showList()">
+                <!--div class="modal-body container list-group list-group-root" vs-repeat="options" dnd-list="content" ng-if="showList()"-->
+                <div class="modal-body container list-group list-group-root filler-list" dnd-list="content" ng-if="showList()"  >
                     <div class="list-group-item flex-container"  style="cursor: default;" ng-repeat="x in content" dnd-draggable="x" dnd-moved="content.splice($index, 1)" dnd-effect-allowed="move">
                         <div class="program-start" >
                             {{durationString(x.duration)}}
                         </div>
                         <div ng-style="programSquareStyle(x, false)" />
-                        <div style="margin-right: 5px;">
+                        <div class="title" >
                             {{x.title}}
                         </div>
                         <div class="flex-pull-right">