Instead of align-content, you might be looking at align-items, depending on what you are trying to achieve. I assume you want to center these items.

So your .flex-content class could look like this:

.flex-content {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    height: 5rem; //set height here instead of header
}

Hope it helps.

You posted way too little information for a reliable answer, but anyway: To get flex-items to stack vertically, you have to add flex-direction: column; to the flex container.

I’m really new to html and css, so this is my first full attempt at making a nav bar, items in nav bar stuck to the top of the page, please tell me where things went wrong

https://codepen.io/galia-s/pen/GRojmwV

.flex-content {
  display: flex;
  margin: auto 3.25rem;
  align-items: center;
}