fix(Layout): use flex layout for chat list instead of fixed calc

watson-developer-cloud · May 20, 2019 · 66ed091 · 66ed091
1 parent 1850e4e
commit 66ed091
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/public/css/app.css b/public/css/app.css
@@ -73,6 +73,8 @@ div {
 }
 
 .chat-column {
+  display: flex;
+  flex-direction: column;
   height: 90%;
   padding: 0.9375rem 0 0.625rem 0;
   margin: auto;
@@ -82,6 +84,7 @@ div {
 }
 
 .user-typing {
+  flex: 0;
   border: none;
   color: #8d25e8;
   margin: 0.75rem;
@@ -93,7 +96,7 @@ div {
   margin: 0.75rem;
   overflow-y: auto;
   overflow-x: hidden;
-  height: calc(100% - 4rem);
+  flex: 1;
 }
 
 .message-inner {