body { font-family: Arial, sans-serif; margin: 0; padding: 0; } #chatroom { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100vh; background-color: #f9f9f9; } #messages { height: 60vh; width: 80%; padding: 10px; background-color: #fff; border: 1px solid #ccc; overflow-y: scroll; box-sizing: border-box; } #user-input { display: flex; width: 80%; margin-top: 10px; } #message-box { flex: 1; padding: 5px; font-size: 16px; border: 1px solid #ccc; border-right: none; border-radius: 5px 0 0 5px; } #send-btn { padding: 5px 10px; font-size: 16px; background-color: #4CAF50; color: #fff; border: none; border-radius: 0 5px 5px 0; cursor: pointer; } #send-btn:hover { background-color: #45a049; } JS