问题遇到的现象和发生背景
登陆页面两侧留白
问题相关代码，请勿粘贴截图
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>欢迎来到登陆界面</title>
<style>
*{
margin:0 0;
padding:0 0;
}
body {
margin:0px;
padding:0px;
border:0px;
}
/**/
.container {
position: relative;
margin:0 0;
padding:0 0;
min-height: 160px;
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
}
.top{
margin: 0;
padding: 0;
}
.top .background {
margin:0;
z-index: 1;
width: 100%;
height: 100%;
object-fit:cover;
}
.top .earth {
margin:0;
z-index: 2;
background-attachment: fixed;
}
</style>
</head>
<body>
<div class="container">
<div class="top">
<img class="background" src="1.png"/>
<img class="earth" src="地球.png"/>
<p>在线打卡</p>
</div>
</div>
</body>
</html>
运行结果及报错内容
我的解答思路和尝试过的方法
初始化css，将所有标签的padding和margin设置为0
我想要达到的结果
清除两侧白边
