title: Children of flex box don't align to bottom (flex end)
body: <p>I'm just introducing myself to <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/flex?v=control" rel="nofollow noreferrer">flexbox</a> and from what I understand if I have a <code>flex</code> parent, then I can align the children of the parent that are on a single row with the <code>align-items</code> rule. However, my children are not changning their alignment as seen here: <a href="https://jsfiddle.net/b9L09gsa/" rel="nofollow noreferrer">https://jsfiddle.net/b9L09gsa/</a></p>
  
  <p>The content remains at the top instead of at the bottom like I would like. The idea is to have the logo div and nav items align neatly at the bottom. Clearly I don't understand something, any help would be great!</p>