<pre><!DOCTYPE html> <html> <head> <title>Horizontal and Vertical alignment</title> <style> .container { height: 200px; width: 400px; border: 2px dashed #4b2869; display: table-cell; text-align: center; vertical-align: middle; position: relative; } .container1 { height: 200px; width: 400px; border: 2px dashed #4b2869; display: table-cell; text-align: center; vertical-align: bottom; position: absolute; } </style> </head> <body style="background-color:#646464;"> <div class="container">container</div> <div class="container1">container1</div> </body> </html>
.center { display: flex; justify-content: center; align-items: center; height: 200px; border: 3px solid green; }
<div class="container1 center">container1</div>
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)