JSFiddle - React, Tailwind, and code Playground

HTML

<body>
	<div class="header">
			<a href="#"><div class="photo"></div></a>
            <div class="footer"></div>
	</div>
</body>

CSS

body {
    margin:0; padding:0; background: #999;
}
.header {
    background-color: #422;
    /* border: solid 1px red; All problem goes away if I add border to header */
}
.header .photo {
    width: 150px;
    height: 150px;
    border-radius: 75px;
    background: #660;
    margin:50px auto;
}
.footer {
    height:50px;
    background: #303;
    margin-bottom:50px;
}