diff --git a/app/assets/javascripts/merge_conflict_data_provider.js.es6 b/app/assets/javascripts/merge_conflict_data_provider.js.es6
index d2ae3f59da5b104fdfc72da8bfd6b9210272108d..b1f1e7bd78cc0d37239de988d1923c0e93624523 100644
--- a/app/assets/javascripts/merge_conflict_data_provider.js.es6
+++ b/app/assets/javascripts/merge_conflict_data_provider.js.es6
@@ -67,15 +67,38 @@ window.MergeConflictDataProvider = class MergeConflictDataProvider {
           }
           else {
             const lineType = type || 'context';
+
             file.parallelLines.left.push (this.getLineForParallelView(line, id, lineType));
-            file.parallelLines.right.push(this.getLineForParallelView(line, id, lineType));
+            file.parallelLines.right.push(this.getLineForParallelView(line, id, lineType, true));
           }
         });
+
+        this.checkLineLengths(file);
       });
     });
   }
 
 
+  checkLineLengths(file) {
+    let { left, right } = file.parallelLines;
+
+    if (left.length !== right.length) {
+      if (left.length > right.length) {
+        const diff = left.length - right.length;
+        for (let i = 0; i < diff; i++) {
+          file.parallelLines.right.push({ lineType: 'emptyLine', richText: '' });
+        }
+      }
+      else {
+        const diff = right.length - left.length;
+        for (let i = 0; i < diff; i++) {
+          file.parallelLines.left.push({ lineType: 'emptyLine', richText: '' });
+        }
+      }
+    }
+  }
+
+
   setInlineLines(data) {
     data.files.forEach( (file) => {
       file.inlineLines = []
@@ -208,14 +231,14 @@ window.MergeConflictDataProvider = class MergeConflictDataProvider {
       id,
       lineType,
       hasConflict,
-      isHead: hasConflict && isHead,
-      isOrigin: hasConflict && !isHead,
-      hasMatch: lineType === 'match',
-      lineNumber: isHead ? new_line : old_line,
-      section: isHead ? 'head' : 'origin',
-      richText: rich_text,
-      isSelected: false,
-      isUnselected: false
+      isHead       : hasConflict && isHead,
+      isOrigin     : hasConflict && !isHead,
+      hasMatch     : lineType === 'match',
+      lineNumber   : isHead ? new_line : old_line,
+      section      : isHead ? 'head' : 'origin',
+      richText     : rich_text,
+      isSelected   : false,
+      isUnselected : false
     }
   }
 
diff --git a/app/assets/javascripts/merge_conflict_resolver.js.es6 b/app/assets/javascripts/merge_conflict_resolver.js.es6
index 63b27f49ce160a478762156a288ac3ba11b5a9ab..76298150767bcf2855599cadf82d761ed42b81d0 100644
--- a/app/assets/javascripts/merge_conflict_resolver.js.es6
+++ b/app/assets/javascripts/merge_conflict_resolver.js.es6
@@ -1,11 +1,13 @@
 //= require lib/vue
 
 window.MergeConflictResolver = class MergeConflictResolver {
+
   constructor() {
     this.dataProvider = new MergeConflictDataProvider()
     this.initVue()
   }
 
+
   initVue() {
     const that = this;
     this.vue   = new Vue({