diff --git a/mail/js/app.js b/mail/js/app.js
index 2c7f5df59c..8459b5d9be 100644
--- a/mail/js/app.js
+++ b/mail/js/app.js
@@ -438,10 +438,12 @@ app.classes.mail = AppJS.extend(
 		var splitter = this.et2.getWidgetById('mailSplitter');
 		if (typeof splitter == 'undefined' || splitter == null) return;
 		var splitterDN = splitter.getDOMNode();
-		// check if DOM Node has class that contains docked; then we assume the bar docked, whatever our class var states
-		for (var i=0; i < splitterDN.childNodes[1].classList.length;i++) if (splitterDN.childNodes[1].classList[i].search(/docked/)>=0) this.mail_previewAreaActive = false;
-		//if this.mail_previewAreaActive but clientHeight of childNode is 0, assume this.mail_previewAreaActive incorrect
-		if ( this.mail_previewAreaActive && splitterDN.childNodes.length > 2 && splitterDN.childNodes[2].clientHeight < 15) this.mail_previewAreaActive=false;
+
+		if(splitter.isDocked())
+		{
+			this.mail_previewAreaActive = false;
+		}
+
 		//this.et2.getWidgetById('mailPreviewHeadersFrom').set_disabled(_value);
 		//this.et2.getWidgetById('mailPreviewHeadersTo').set_disabled(_value);
 		//this.et2.getWidgetById('mailPreviewHeadersDate').set_disabled(_value);
diff --git a/mail/templates/default/app.css b/mail/templates/default/app.css
index 2151f4e791..4a54d73f65 100644
--- a/mail/templates/default/app.css
+++ b/mail/templates/default/app.css
@@ -5,8 +5,8 @@ textarea
 }
 
 .defaultProfile { color:#000000; font-weight:bold !important; }
-	
-			
+
+
 .quoted1 { color:#660066; }
 .quoted2 { color:#007777; }
 .quoted3 { color:#990000; }
@@ -165,21 +165,21 @@ A.sieveRowInActive
 {
 	FONT-SIZE: 11px;
 	height : 14px;
-	padding: 0;	
+	padding: 0;
 	color: Silver;
 }
 
 .bodyDIV {
-	position:absolute; 
-	background-color:white; 
-	top:134px; 
-	bottom:0px; 
-	width:100%; 
+	position:absolute;
+	background-color:white;
+	top:134px;
+	bottom:0px;
+	width:100%;
 	border-top: 1px solid #efefdf;
 }
 
 .bodyDIVAttachment {
-	bottom:80px; 
+	bottom:80px;
 }
 
 #attachmentSpanAllDIV{
@@ -189,24 +189,24 @@ A.sieveRowInActive
 }
 
 #attachmentDIV {
-	position:fixed; 
-	background-color:#efefdf; 
-	bottom:0px; 
+	position:fixed;
+	background-color:#efefdf;
+	bottom:0px;
 	min-height:80px;
-	max-height:239px; 
-	width:100%; 
-	border-top: 1px solid silver; 
+	max-height:239px;
+	width:100%;
+	border-top: 1px solid silver;
 	overflow:auto;
 }
 
 #popupattachmentDIV {
-	position:top; 
-	background-color:#efefdf; 
-	bottom:0px; 
+	position:top;
+	background-color:#efefdf;
+	bottom:0px;
 	min-height:80px;
-	max-height:239px; 
-	width:100%; 
-	border-top: 1px solid silver; 
+	max-height:239px;
+	width:100%;
+	border-top: 1px solid silver;
 	overflow:auto;
 }
 
@@ -214,7 +214,7 @@ pre {
  white-space: pre-wrap; /* Mozilla, since 1999 */
  white-space: -pre-wrap; /* Opera 4-6 */
  white-space: -o-pre-wrap; /* Opera 7 */
- width: 99%; 
+ width: 99%;
 }
 
 /*
@@ -371,7 +371,8 @@ input[type=button] {
 .mailDisplay, #mail-index_mailPreview {
 	overflow: hidden;
 	position: relative;
-	margin-top: 3px;
+	padding-top: 3px;
+	background-color: white;
 }
 #mail-compose_fileselector {
 	width: 245px !important;
@@ -432,7 +433,7 @@ input[type=button] {
 	right: 0;
 }
 #mail-index_previewAttachmentArea {
-	background-color:#efefdf; 
+	background-color:#efefdf;
 	max-height: 3em;
 	max-width: 50%;
 	position: absolute;
@@ -442,7 +443,7 @@ input[type=button] {
 	top: 25px;
 	border: 1px solid red;
 	opacity: 1;
-	-moz-opacity:1:
+	-moz-opacity:1;
 	filter: Alpha(opacity=100);
 	display: inline-block !important;
 }
@@ -482,18 +483,18 @@ input[type=button] {
 	margin:0px;
 }
 .mailDisplayAttachments {
-	background-color:#efefdf; 
+	background-color:#efefdf;
 	height: 121px;
 	position: fixed;
 	bottom: .1em;
 	border: 1px solid red;
 	opacity: 1;
-	-moz-opacity:1:
+	-moz-opacity:1;
 	filter: Alpha(opacity=100);
 }
 /*
 #divGenTime {
-	background-color:#efefdf; 
+	background-color:#efefdf;
 	max-height: 10%;
 	position: fixed;
 	bottom: 1px;