diff options
| -rw-r--r-- | src/Chat/Chat.css | 11 | ||||
| -rw-r--r-- | src/Chat/Chat.tsx | 4 |
2 files changed, 9 insertions, 6 deletions
diff --git a/src/Chat/Chat.css b/src/Chat/Chat.css index 7924811..bee333e 100644 --- a/src/Chat/Chat.css +++ b/src/Chat/Chat.css @@ -1,12 +1,13 @@ -#chat-inner { - height: 250px; +.chat-inner-wrapper { + height: 500px; overflow-y: auto; overflow-wrap: normal; + display: flex; + flex-direction: column-reverse; + } .entry-box { - position: absolute; - bottom: 0; - min-height: 20%; + margin-top: 5px; } .chat { min-height: 80vh; diff --git a/src/Chat/Chat.tsx b/src/Chat/Chat.tsx index cc185a9..538f308 100644 --- a/src/Chat/Chat.tsx +++ b/src/Chat/Chat.tsx @@ -106,7 +106,9 @@ const ChatWrapper = ( }) return ( <div className="chat"> - <div id="chat-inner"> + <div className="chat-inner-wrapper"> + <div id="chat-inner"> + </div> </div> <span className="entry-box"><input id="data-entry"></input><button onClick={() => sendData()}>Send</button></span> </div> |