How Can I Have An Image On The Same Line As Text In Html

I am in HTML, and I want to make a professional header. My problem is that when I put my logo into my div and then put some links also in that div it splits them onto different lin

Solution 1:

You can make a table and put them in it:

<table><tr><th><imgsrc="https://smallbusinessbc.ca/wp-content/themes/sbbcmain/images/circle-icons/icon-education.svg"width="50px"height="50px"></th><th>
    Write your stuff!
  </th></tr></table>

You can use any image and any text

Solution 2:

Use display:flex as shown below:

.nav{
  border:1px solid black;
  display:flex;
}
.links{
  margin-left:auto;
}

<divclass="nav"><divclass="logo">LOGO</div><divclass="links">About Us | Contact Us</div></div>