diff --git a/common/lib/xmodule/xmodule/css/lti/lti.scss b/common/lib/xmodule/xmodule/css/lti/lti.scss
index dcbde33e59..97a8f62d54 100644
--- a/common/lib/xmodule/xmodule/css/lti/lti.scss
+++ b/common/lib/xmodule/xmodule/css/lti/lti.scss
@@ -1,6 +1,29 @@
 div.lti {
-    h2.error_message {
-        &.hidden {
+    // align center
+    margin: 0 auto;
+
+    h3.error_message {
+        display: block;
+    }
+
+    form.ltiLaunchForm {
+        display: none;
+    }
+
+    iframe.ltiLaunchFrame {
+        width: 100%;
+        height: 800px;
+        display: none;
+        border: 0px;
+        overflow-x: hidden;
+    }
+
+    &.rendered {
+        iframe.ltiLaunchFrame {
+            display: block;
+        }
+
+        h3.error_message {
             display: none;
         }
     }
diff --git a/common/lib/xmodule/xmodule/js/fixtures/lti.html b/common/lib/xmodule/xmodule/js/fixtures/lti.html
index 1e3439f412..50e712b72d 100644
--- a/common/lib/xmodule/xmodule/js/fixtures/lti.html
+++ b/common/lib/xmodule/xmodule/js/fixtures/lti.html
@@ -1,9 +1,9 @@
-<div align="center" id="lti_id" class="lti">
+<div id="lti_id" class="lti">
 
     <form
         action=""
         name="ltiLaunchForm"
-        id="ltiLaunchForm"
+        class="ltiLaunchForm"
         method="post"
         target="ltiLaunchFrame"
         encType="application/x-www-form-urlencoded"
@@ -34,11 +34,8 @@
 
     <iframe
         name="ltiLaunchFrame"
-        id="ltiLaunchFrame"
-        width="0"
-        height="0"
+        class="ltiLaunchFrame hidden"
         src=""
-        style="border: 0px; overflow-x: hidden;"
     ></iframe>
 
 </div>
diff --git a/common/lib/xmodule/xmodule/js/spec/lti/constructor.js b/common/lib/xmodule/xmodule/js/spec/lti/constructor.js
index 203d79f9bd..d6e56216b3 100644
--- a/common/lib/xmodule/xmodule/js/spec/lti/constructor.js
+++ b/common/lib/xmodule/xmodule/js/spec/lti/constructor.js
@@ -8,26 +8,20 @@
 
 (function () {
     describe('LTI', function () {
-        var documentReady = false,
-            element, errorMessage, frame,
+        var element, errorMessage, frame,
             editSettings = false;
 
         // This function will be executed before each of the it() specs
         // in this suite.
         beforeEach(function () {
-            $(document).ready(function () {
-                documentReady = true;
-            });
-
-            spyOn(LTI, 'init').andCallThrough();
             spyOn($.fn, 'submit').andCallThrough();
 
             loadFixtures('lti.html');
 
             element = $('#lti_id');
-            errorMessage = element.find('error_message');
-            form = element.find('form#ltiLaunchForm');
-            frame = element.find('iframe#ltiLaunchFrame');
+            errorMessage = element.find('.error_message');
+            form = element.find('.ltiLaunchForm');
+            frame = element.find('.ltiLaunchFrame');
 
             // First part of the tests will be running without the settings
             // filled in. Once we reach the describe() spec
@@ -36,32 +30,14 @@
             //
             // the variable `editSettings` will be changed to `true`.
             if (editSettings) {
-                form.attr('action', 'http://google.com/');
+                form.attr('action', 'http://www.example.com/');
             }
 
             LTI(element);
         });
 
         describe('constructor', function () {
-            it('init() is called after document is ready', function () {
-                waitsFor(
-                    function () {
-                        return documentReady;
-                    },
-                    'The document is ready',
-                    1000
-                );
-
-                runs(function () {
-                    expect(LTI.init).toHaveBeenCalled();
-                });
-            });
-
             describe('before settings were filled in', function () {
-                it('init() is called with element', function () {
-                    expect(LTI.init).toHaveBeenCalledWith(element);
-                });
-
                 it(
                     'when URL setting is empty error message is shown',
                     function () {
@@ -70,7 +46,7 @@
                 });
 
                 it('when URL setting is empty iframe is hidden', function () {
-                    expect(frame.css('display')).toBe('none');
+                    expect(frame).toHaveClass('hidden');
                 });
             });
 
@@ -95,15 +71,7 @@
                 });
 
                 it('when URL setting is filled iframe is shown', function () {
-                    expect(frame.css('display')).not.toBe('none');
-                });
-
-                it(
-                    'when URL setting is filled iframe is resized',
-                    function () {
-
-                    expect(frame.width()).toBe(form.parent().width());
-                    expect(frame.height()).toBe(800);
+                    expect(frame).not.toHaveClass('hidden');
                 });
             });
         });
diff --git a/common/lib/xmodule/xmodule/js/src/lti/lti.js b/common/lib/xmodule/xmodule/js/src/lti/lti.js
index 64a757eb28..e5b6885e1b 100644
--- a/common/lib/xmodule/xmodule/js/src/lti/lti.js
+++ b/common/lib/xmodule/xmodule/js/src/lti/lti.js
@@ -1,21 +1,9 @@
 window.LTI = (function () {
-    var LTI;
-
-    // Function LTI()
-    //
-    // The LTI module constructor. It will be called by XModule for any
-    // LTI module DIV that is found on the page.
-    LTI = function (element) {
-        $(document).ready(function () {
-            LTI.init(element);
-        });
-    }
-
-    // Function init()
+    // Function initialize(element)
     //
     // Initialize the LTI iframe.
-    LTI.init = function (element) {
-        var form, frame;
+    function initialize(element) {
+        var form;
 
         // In cms (Studio) the element is already a jQuery object. In lms it is
         // a DOM object.
@@ -24,26 +12,15 @@ window.LTI = (function () {
         // function. This will make it a jQuery object if it isn't already so.
         element = $(element);
 
-        form = element.find('#ltiLaunchForm');
-        frame = element.find('#ltiLaunchFrame');
+        form = element.find('.ltiLaunchForm');
 
         // If the Form's action attribute is set (i.e. we can perform a normal
-        // submit), then we submit the form and make it big enough so that the
-        // received response can fit in it. Hide the error message, if shown.
+        // submit), then we submit the form and make the frame shown.
         if (form.attr('action')) {
             form.submit();
-
-            element.find('.error_message').addClass('hidden');
-            frame.show();
-            frame.width('100%').height(800);
-        }
-
-        // If no action URL was specified, we show an error message.
-        else {
-            frame.hide();
-            element.find('.error_message').removeClass('hidden');
+            element.find('.lti').addClass('rendered')
         }
     }
 
-    return LTI;
+    return initialize;
 }());
diff --git a/lms/templates/lti.html b/lms/templates/lti.html
index 60b0672719..d1f0c1b236 100644
--- a/lms/templates/lti.html
+++ b/lms/templates/lti.html
@@ -1,4 +1,4 @@
-<div align="center" id="${element_id}" class="${element_class}">
+<div id="${element_id}" class="${element_class}">
 
     ## This form will be hidden. Once available on the client, the LTI
     ## module JavaScript will trigget a "submit" on the form, and the
@@ -6,31 +6,29 @@
     <form
         action="${lti_url}"
         name="ltiLaunchForm"
-        id="ltiLaunchForm"
+        class="ltiLaunchForm"
         method="post"
         target="ltiLaunchFrame"
         encType="application/x-www-form-urlencoded"
     >
+        <input name="launch_presentation_return_url" value="" />
+        <input name="lis_outcome_service_url" value="" />
+        <input name="lis_result_sourcedid" value="" />
+        <input name="lti_message_type" value="basic-lti-launch-request" />
+        <input name="lti_version" value="LTI-1p0" />
+        <input name="oauth_callback" value="about:blank" />
+        <input name="oauth_consumer_key" value="${oauth_consumer_key}" />
+        <input name="oauth_nonce" value="${oauth_nonce}" />
+        <input name="oauth_signature_method" value="HMAC-SHA1" />
+        <input name="oauth_timestamp" value="${oauth_timestamp}" />
+        <input name="oauth_version" value="1.0" />
+        <input name="user_id" value="default_user_id" />
+        <input name="oauth_signature" value="${oauth_signature}" />
 
-    <input type="hidden" name="launch_presentation_return_url" value="">
-    <input type="hidden" name="lis_outcome_service_url" value="">
-    <input type="hidden" name="lis_result_sourcedid" value="">
-    <input type="hidden" name="lti_message_type" value="basic-lti-launch-request">
-    <input type="hidden" name="lti_version" value="LTI-1p0">
-    <input type="hidden" name="oauth_callback" value="about:blank">
-    <input type="hidden" name="oauth_consumer_key" value="${oauth_consumer_key}"/>
-    <input type="hidden" name="oauth_nonce" value="${oauth_nonce}"/>
-    <input type="hidden" name="oauth_signature_method" value="HMAC-SHA1"/>
-    <input type="hidden" name="oauth_timestamp" value="${oauth_timestamp}"/>
-    <input type="hidden" name="oauth_version" value="1.0"/>
-    <input type="hidden" name="user_id" value="default_user_id">
-
-    <input type="hidden" name="oauth_signature" value="${oauth_signature}"/>
-    <input type="submit" value="Press to Launch" style="display: none"/>
-
+        <input type="submit" value="Press to Launch" />
     </form>
 
-    <h3 class="error_message hidden">
+    <h3 class="error_message">
         Please provide LTI url. Click "Edit", and fill in the
         required fields.
     </h3>
@@ -38,11 +36,8 @@
     ## The result of the form submit will be rendered here.
     <iframe
         name="ltiLaunchFrame"
-        id="ltiLaunchFrame"
-        width="0"
-        height="0"
+        class="ltiLaunchFrame"
         src=""
-        style="border: 0px; overflow-x: hidden;"
     ></iframe>
 
 </div>