center everything in a div with flex-center (centre)

i usually add this to my base css styles, as a way to easily center something in the middle of an element. 

then you just add this flex-center class and everything will be horizontally and vertically aligned. 

HTML

<div class='demo-box flex-center'>Demo Box<br>❤</div>

CSS

.demo-box {
  text-align:center;
  height:200px;
  width:200px;
  border:2px solid #444;
  padding:20px;
}
.flex-center {
  display: flex;
	align-items: center;
	justify-content: center;
	transition: all 1s;	  
}
Demo Box

Other Items in css

No Items Found.

Add Comment
Type in a Nick Name here
 
Page Views

This page has been viewed 513 times.

Search Code
Search Code by entering your search text above.
Welcome

This is my test area for webdev. I keep a collection of code snippits here, mostly for my reference. Also if i find a good site, i usually add it here.

❤👩‍💻🕹

Random Quote
There is no way to happiness. Happiness is the way.
Unknown