如何让小的div在大的div中垂直居中
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>居中</title> <style> #first{ border: thin solid gold; background-color: #dddddd; width: 600px; height: 600px; /*这条语句可以让div#first*水平居中*/ /*margin: 0 auto;*/ /*这条语句可以让div#first*水平垂直居中*/ position: absolute; left: 50%; top: 50%; margin-left: -300px; margin-top: -300px; } #second{ border: thin solid gold; background-color: aquamarine; width: 400px; height: 400px; position: absolute; left: 50%; top: 50%; margin-left: -200px; margin-top: -200px; } </style> </head> <body> <div id='first'> <div id="second"></div> </div> </body> </html>