diff --git a/apps/files/css/detailsView.css b/apps/files/css/detailsView.css
index 51aaf393751f8c0fc161031a833dcf11b60316e6..ec0d5ac21108955b5fe9721c3e9e879d66722f26 100644
--- a/apps/files/css/detailsView.css
+++ b/apps/files/css/detailsView.css
@@ -1,14 +1,18 @@
 
 
 .app-files .detailsView.disappear {
-	margin-right: -359px;
+	visibility: hidden;
+}
+
+.with-sidebar {
+	width: 80%;
 }
 
 .app-files .detailsView {
-	position: fixed;
-	width: 350px;
+	position: absolute;
+	width: 20%;
 	top: 44px; /* main header's height */
-	right: 9px;
+	right: 0;
 	left: auto;
 	bottom: 0;
 	background-color: white;
@@ -18,6 +22,7 @@
 	transition: margin-right 300ms;
 	overflow-x: hidden;
 	overflow-y: auto;
+	visibility: visible;
 }
 
 .app-files .detailsView {
diff --git a/apps/files/js/detailsview.js b/apps/files/js/detailsview.js
index d4495cd8dabf6e5070540e8b79e78f9f9f3903a1..0cf4ade0767bf33e36239b6da29d7a7242c51996 100644
--- a/apps/files/js/detailsview.js
+++ b/apps/files/js/detailsview.js
@@ -80,7 +80,9 @@
 			this._detailFileInfoViews = [];
 
 			this.$el.on('click', 'a.close', function(event) {
-				self.$el.addClass('disappear');
+				self.$el
+					.addClass('disappear')
+					.siblings('.with-sidebar').removeClass('with-sidebar');
 				event.preventDefault();
 			});
 
diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js
index a03c4e1754f644c84fe2723325a34f83dfdf976b..7e94d5c3d4e58bfbca9188d426d2d6798345c0ef 100644
--- a/apps/files/js/filelist.js
+++ b/apps/files/js/filelist.js
@@ -214,7 +214,7 @@
 			if (_.isUndefined(options.detailsViewEnabled) || options.detailsViewEnabled) {
 				this._detailsView = new OCA.Files.DetailsView();
 				this._detailsView.addDetailView(new OCA.Files.MainFileInfoDetailView());
-				this.$el.append(this._detailsView.$el);
+				this._detailsView.$el.insertAfter(this.$el);
 				this._detailsView.$el.addClass('disappear');
 			}
 
@@ -301,6 +301,7 @@
 
 			if (!fileInfo) {
 				this._detailsView.$el.addClass('disappear');
+				this.$el.removeClass('with-sidebar');
 				this._detailsView.setFileInfo(null);
 				return;
 			}
@@ -312,6 +313,7 @@
 			this._detailsView.$el.scrollTop(0);
 			_.defer(function() {
 				self._detailsView.$el.removeClass('disappear hidden');
+				self.$el.addClass('with-sidebar');
 			});
 		},