Shulou(Shulou.com)06/01 Report--

Editor to share with you how css uses flexbox layout to achieve box center, I believe most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

Using flexbox layout

.div1 {width: 100px; height: 100px; border: 1px solid # 000000; display: flex; / *! * flex-direction: columnist! Writable but not writable * / justify-content: center; align-items: center;} .div2 {height: 40px; width: 40px; background-color: red;}

Effect:

The above is all the content of the article "how css uses flexbox layout to achieve box centering". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.