<!Doctype html> <html> <head> <meta charset="UTF-8"> <title>test</title> <style> *{margin:0;padding:0;} body{background: green;} #main{width:100%; height:100%; background: yellow; margin-top:50px; } </style> </head> <body> <div id="main"> </div> </body> </html>
After adding the header declaration <!Doctype html>, the div cannot be displayed. After removing it, it can be displayed normally. The same situation occurs when tested in IE11 and chrome browsers. What is the problem?
You can see it by adding a border to main