From 672bbf55568006c8a2b8e3222a2ae03549e76881 Mon Sep 17 00:00:00 2001
From: pipeline <pipeline@syncfusion.com>
Date: Thu, 22 Jun 2017 12:34:46 +0000
Subject: [PATCH] feature(EJ2-2363): EJ2-2363 Modal Dialog positioning-Using
 CSS

Modal Dialog positioning-Using CSS
---
 src/dialog/modal.html | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/dialog/modal.html b/src/dialog/modal.html
index 982c46d2..20e10b98 100644
--- a/src/dialog/modal.html
+++ b/src/dialog/modal.html
@@ -1,12 +1,9 @@
-<div id="target" class="col-lg-8 control-section">
-    <div class="content-wrapper">
-        <div id="modalDlgWrapper" class="content-wrapper">
-            <button id="dialogBtn" type="button">Open</button>
-            <div id="modalDialog">
-            </div>
-        </div>
+<div id="target" class="col-lg-8 control-section" style="height:350px;">
+    <div style="position:relative; top:10px; left:10px;">
+        <button id="dialogBtn" type="button">Open</button>
+    </div>
+    <div id="modalDialog">
     </div>
-</div>
 </div>
 
 
@@ -31,11 +28,15 @@
         In this demo, we enabled the modal in Dialog and check the "Close on overlay click" option if you want to close the Dialog
         on overlay click.
     </p>
-    <p>More information on the modal behavior of dialog can be found in this 
+    <p>More information on the modal behavior of dialog can be found in this
         <a target="_blank" href="http://ej2.syncfusion.com/documentation/dialog/getting-started.html#modal-dialog">
         documentation section</a>.</p>
 </div>
 <style>
+    #target .control-wrapper {
+        margin: 0px;
+    }
+
     @media screen and (min-width: 150px) and (max-width: 480px) {
         .control-section {
             margin-bottom: 30px;