Order div elements with css
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Chat</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="header"> <h1 id="titleRoom"></h1> <h3>Online Users:</h3> <div id="online_users"></div></br> <button id="buttonRoom" type="button" name="button">Create Chatroom</button><button id="buttonLobby" type="button" name="button">Back Lobby</button></div> <div class="chatArea"> <ul class="messages"></ul> </div> <div class='inputContainer'> <input class="inputMessage" placeholder="Type here..."/><button id="sendButton" type="button" name="button">Send</button> </div> <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script> <script src="/socket.io/socket.io.js"></script> <script src="/js/client.js"></script> </body> </html> I need to have always on top <div id="header">, always in buttom <div class='inputContainer'> and in the middle (occuping the rest of the page) <div class="chatArea"> without that <div class="chatArea"> override or be overridden by <div id="header"> or <div class='inputContainer'>. does anyone know the css code to do that?
Costuma ter perguntas como essa?
Aprenda de maneira mais eficiente, de graça:
