[Fixed] Align image and text inside <div> horizontally and vertically


I want to align image and text inside a div horizontally and vertically. My code:

<div style="white-space:nowrap" (click)="sidenav.toggle()">
  <img alt='image' style="margin-top: 1vw;display: inline;" width="25" height="35" src="../assets/menu-white-18dp.svg">
  <span style="display:inline; white-space:nowrap;" > KRON</span>

Currently it’s looking like this:
enter image description here

I want the ‘KRON’ to be aligned with the image. What did I do wrong?


Use Flexbox

  display: flex;
  justify-content: center;
  align-items: center;

Leave a Reply

(*) Required, Your email will not be published