diff --git a/calendar/js/app.js b/calendar/js/app.js
index f842bf48df..e9f4393178 100644
--- a/calendar/js/app.js
+++ b/calendar/js/app.js
@@ -267,7 +267,7 @@ app.classes.calendar = AppJS.extend(
 							var dM = this.dropEnd.getAttribute('data-date').split("|")[2];
 						}
 						var dataResize = event.target.getAttribute('data-resize').split("|");
-						this.innerHTML = '<div style="font-size: 1.1em; text-align:center; font-weight: bold; height:100%;"><span style=" position: absolute; bottom: 0; align: center; ">'+dH+':'+dM+'</span></div>';
+						this.innerHTML = '<div style="font-size: 1.1em; text-align:center; font-weight: bold; height:100%;"><span class="calendar_timeDemo" >'+dH+':'+dM+'</span></div>';
 					}
 					else
 					{
@@ -328,7 +328,7 @@ app.classes.calendar = AppJS.extend(
 					if (dpOwner == null) dpOwner = dgOwner;
 					if (dpOwner === dgOwner )
 					{
-						ui.helper[0].innerHTML = '<div class="calendar_d-n-d_timeCounter">'+timeDemo+'</div>';
+						ui.helper[0].innerHTML = '<div class="calendar_d-n-d_timeCounter"><span>'+timeDemo+'</span></div>';
 					}
 					else
 					{
diff --git a/calendar/templates/default/app.css b/calendar/templates/default/app.css
index 38fdd1b7ed..4a758dd004 100644
--- a/calendar/templates/default/app.css
+++ b/calendar/templates/default/app.css
@@ -548,6 +548,27 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
  *
  */
 //Class for div to show forbiden drop
+.calendar_d-n-d_timeCounter > span {
+	position: absolute;
+	background-color: #808080;
+	color: white;
+	left: 0;
+	width: 100% !important;
+	align: center;
+	border: dashed white 1px;
+	border-radius: 1px;
+}
+.calendar_timeDemo {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    background-color: #808080;
+    color: white;
+    width: 100%;
+    align: center;
+    border:dashed white 1px;
+    border-radius: 1px;
+}
 .calendar_d-n-d_forbiden
 {
 	background-color: red;
diff --git a/calendar/templates/pixelegg/app.css b/calendar/templates/pixelegg/app.css
index 9e5bdc91a2..756508e6e8 100755
--- a/calendar/templates/pixelegg/app.css
+++ b/calendar/templates/pixelegg/app.css
@@ -547,6 +547,27 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
  * Calendar Drag and Drop
  *
  */
+.calendar_d-n-d_timeCounter > span {
+  position: absolute;
+  background-color: #808080;
+  color: white;
+  left: 0;
+  width: 100% !important;
+  align: center;
+  border: dashed white 1px;
+  border-radius: 1px;
+}
+.calendar_timeDemo {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  background-color: #808080;
+  color: white;
+  width: 100%;
+  align: center;
+  border: dashed white 1px;
+  border-radius: 1px;
+}
 .calendar_d-n-d_forbiden {
   background-color: red;
   height: 100%;