CSS Align logo same height as text

Question

How can I align the logo and the text link next to it on the same height? Is this something done with display: inline-block; ?

a {
  text-decoration: none;
  color: blue;
}

<nav>
  
  <a href="google.be"><img alt="logo" src="https://vignette.wikia.nocookie.net/simpsons/images/5/51/Wikimedia_logo.png/revision/latest/scale-to-width-down/50?cb=20100313090805"> wikipedia</a>
</nav>

Answer 1

You can use flexbox, as noted in another answer. You can also use the vertical-align property

a {
  text-decoration: none;
  color: blue;
}

img {
  vertical-align: middle;
}

<nav>

  <a href="google.be"><img alt="logo" src="https://vignette.wikia.nocookie.net/simpsons/images/5/51/Wikimedia_logo.png/revision/latest/scale-to-width-down/50?cb=20100313090805"> wikipedia</a>
</nav>