How does css center a picture of unknown size horizontally and vertically in a container of known width and height

Editor to share with you how css makes the unknown size of the picture in the known width and height of the container horizontal vertical center, I believe that most people do not understand, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

Centers a picture of unknown size horizontally and vertically in a container of known width and height

# test {display:table-cell;*display:block;*position:relative;width:200px;height:200px;text-align:center;vertical-align:middle;} # test p {* position:absolute;*top:50%;*left:50%;margin:0;} # test p img {* position:relative;*top:-50%;*left:-50%;vertical-align:middle;} / * # test is the grandfather node of img, and p is the parent node of img. Know More: how does an unknown size picture center horizontally and vertically? / the above is all the contents of the article "how css makes an unknown size picture center horizontally and vertically in a container of known width and height". 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!