When looking at my existing code, I noticed that the ul is positioned all the way at the bottom of the page, extending past the predefined box.
I attempted to resolve this issue by using the CSS properties position:fixed and bottom:0
.box {
width: 900px;
height: 450px;
}
.box ul {
list-style: none;
text-align: center;
position: fixed;
bottom: 0;
}
.box li {
display: inline-block;
}
.box a{
text-decoration: none;
color: blue;
width: 150px;
display: block;
}
My expectation was for the ul to be aligned with the bottom of the box initially and then adjust its placement slightly by adding padding or margin, so it doesn't sit directly at the very bottom of the box.