为何我DIV重叠了!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="SES_Web.Index" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel = "stylesheet" type =" text/css" href ="Css/Index.css" />
    <title>XXXXX</title>
</head>
<body>
    <form id="form1" runat="server">
        <div id ="Top">
            <div id="logo">

            </div>
        </div>
        <div id ="Center">

        </div>
        <div id ="buttom">

        </div>
    </form>
</body>
</html>

body {
    margin: 0 auto;
    text-align: center;
    background-color: aqua;
}
    body div {
        border: solid 1px red;
        margin-left: auto;
        margin-right: auto;
    }
#Top {
    Position: Reletive;
    width: 1024PX;
    height: 100PX;
}
#Center {
    Position: Reletive;
    border: solid 1px red;
    width: 1024PX;
    height: 100PX;
    margin-left: auto;
    margin-right: auto;
}
#Buttom {
    Position: Reletive;
    border: solid 1px red;
    width: 1024PX;
    height: 100PX;
    margin-left: auto;
    margin-right: auto;
}
#logo {
    Position: Reletive;
    width: 1024PX;
    height: 100PX;
    background-image: url(../Imgaes/LOGO_01.png);
    background-repeat: repeat;
    margin-left: auto;
    margin-right: auto;
}

Buttom的大小写

Position: Reletive;也不对呀，相对定位是relative，不写这句本身就会逐次向下排版的，你这应该不是div重叠，而是div是空的高度为0所以不显示

Position: Reletive
相对定位，元素相对于原来的位置定位。不脱离文档流，页面上保存有它的位置，占位空间依然存在.
https://www.jianshu.com/p/9ead8dfb34cc