There seems to be an issue with my <footer>. All child elements of the <footer> are appearing outside of it.
Does anyone know how I can properly place child elements inside the <footer> and align them from left to right?
footer{
background-color: black;
height: 100px;
}
footer > a,
#link{
display: flex;
align-items: center;
justify-content: center;
width: 100px;
height: 100%;
background-color: yellow;
}
#damn{
background-color: red;
width: 100px;
height: 100px;
}<footer>
<a href="#">
<div id="link">
here we go again
</div>
</a>
<div id="damn">
</div>
why the hell
</footer>