/CSS/How to set text in center in flex item

How to set text in center in flex item

How center content in css by using flex

	display: flex;
    width: 60%;
    justify-content: center;
    margin: 0 auto;

How to set text in center in flex item

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

html,
body {
  height: 100%;
}

.list {
  display: flex;
  justify-content: center;
  flex-direction: column;  /* <--- I added this */
  align-items: center;   /* <--- Change here */
  height: 200px;
  width: 100%;
  background: silver;
}

.list li {  
  background: gold;
  height: 20%; 
}

Source: stackoverflow.com

Similar codes

5 votes277 views4 answers
Display none tailwind
CSS
11 votes252 views3 answers
Filter for css white color
CSS
10 votes251 views5 answers
Media query for max width and height
CSS
0 vote296 views2 answers
Fix materialize form label not working
CSS
1 vote255 views1 answer
To make the content of the select2 RTL or LTR
CSS
3 votes264 views2 answers
How to zoom iin by default in html page
CSS
145 votes326 views6 answers
Import bootstrap in react
CSS Bootstrap
3 votes242 views3 answers
Can you control another div on hover css
CSS
4 votes258 views2 answers
Transform scale
CSS
0 vote247 views1 answer
Css for chrome only
CSS