diff --git a/converse.css b/converse.css
index 2e0980194..fc8610f92 100644
--- a/converse.css
+++ b/converse.css
@@ -390,7 +390,9 @@ span.spinner.hor_centered {
 }
 
 .chatroom .chat-body {
-    height: 274px;
+    height: -moz-calc(100% - 38px);
+    height: -o-calc(100% - 38px);
+    height: calc(100% - 38px);
     background-color: white;
     border-bottom-right-radius: 4px;
     border-bottom-left-radius: 4px;
@@ -409,7 +411,7 @@ span.spinner.hor_centered {
 
 .chatroom .participants {
     float: left;
-    height: 274px;
+    height: 100%;
     background-color: white;
     overflow: auto;
     border-left: 1px solid #AAA;
@@ -510,11 +512,6 @@ li.chat-info {
     padding-top: 10px;
 }
 
-div#chatrooms,
-div#login-dialog {
-    height: 274px;
-}
-
 p.not-implemented {
     margin-top: 3em;
     margin-left: 0.3em;
@@ -693,9 +690,8 @@ a.close-chatbox-button:active {
 }
 
 .chatroom-form-container {
+    height: 100%;
     color: #666;
-    padding: 5px;
-    height: 262px;
     overflow-y: auto;
     border-bottom-right-radius: 4px;
     border-bottom-left-radius: 4px;
@@ -1266,12 +1262,12 @@ form.add-xmpp-contact input {
     bottom: 1px;
     box-shadow: 1px 1px 5px 1px rgba(0,0,0,0.4);
     border-radius: 4px;
+    height: 324px;
 }
 
 .chatbox .box-flyout {
     background: white;
     width: 200px;
-    height: 324px;
 }
 
 .chatroom .box-flyout {
diff --git a/mockup.html b/mockup.html
index 3d895f860..4adc350b5 100644
--- a/mockup.html
+++ b/mockup.html
@@ -403,6 +403,7 @@
             <div class="chat-body">
                 <div class="chatroom-form-container">
                     <form class="chatroom-form">
+                        <!-- TODO: Make this a long form that scrolls -->
                         <legend>This chatroom requires a password</legend>
                         <label>Password: <input type="password" name="password"></label>
                     </form>