在调整大小时，Div会向下移动

Question

当我调整浏览器大小时，Div正在转移。我在全屏看起来很好但是它将所有三个标题下降了大约4步。即使我减小字体大小也是一样的结果。 m，nfm，.asnfmd，nf，mdan fm，.d

.wrapper {
    width: 497px;
    height: 100px;
    margin: 0 auto;
    /* padding: 0 5%; */
    display: block;
}

/*beginning css*/
.michael {
    color: #EEE8AA;
    position: relative;
    text-transform: uppercase;
    font-size: 30px;
    float: left;
    display: inline-block;
    border: 1px #fff;
    /* max-width: 100%; */
    /* max-height: 100%; */
    /* left: 30%; */
    /* top: 0%; */
}

/*beginning css*/
.m {
    max-width: 100%;
}

/*beginning css*/
.michael {
}

/*beginning css*/
.ringhead {
    position: relative;
    /* max-width: 100%; */
    /* max-height: 100%; */
    float: left;
    border: 1px solid #000;
    display: inline-block;
    /* left: 50%; */
    /* top: 4%; */
}

/*beginning css*/
.ring {
    max-width: 80%;
    max-height: 60%;
}

/*beginning css*/
.christina {
    color: #EEE8AA;
    position: relative;
    float: left;
    border: 1px solid #000;
    /* top: 0%; */
    text-transform: uppercase;
    font-size: 30px;
    padding-left: 10%;
    /* max-width: 100%; */
    /* max-height: 100%; */
}

/*beginning css*/
.c {
    max-width: 80%;
    max-height: 60%;
}

/*beginning css*/
body {
    background-image: url("Images/Top Banner.jpg"),url("Images/Middle `enter code here`Banner.jpg"),url("Images/Bottom Banner.png");
    background-size: 100% 10%,100% 15%,100% 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

/*beginning css*/
.weddingWebsite {
    position: fixed;
    top: 55%;
    left: 55%;
    transform: translateX(-55%) translateY(-55%);
    max-width: 80%;
    max-height: 60%;
}

/*beginning css*/
.wedding {
    max-width: 80%;
    max-height: 60%;
}

HTML

<div class="wrapper">
    <div class="michael">
        <p class="m">Michael</p>
    </div>
    <div class="ringhead"><img alt="Wedding Ring" class="ring" height="60" src=
    "../Images//gold.gif"></div>
    <div class="christina">
        <p class="c">Christina</p>
    </div>
    <div class="weddingWebsite"><img alt="Wedding Website" class="wedding"
    height="350" src="Wedding%20Website.jpg" width="350"></div>
</div>