title: How to display two divs that contain multiple lines on the same line
body: <p>I am trying to display two divs on the same line but one of them contains multiple lines, so the text of the second div is starting after the last line of the first div.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.contact1 {
     display: inline;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;html&gt;
    &lt;body&gt;
      &lt;div id="test"&gt;
          &lt;div class="contact1"&gt;&lt;h3 class="contact1"&gt;&lt;br&gt;Text1&lt;br&gt;
          Text2&lt;br&gt;Text3&lt;/h3&gt;&lt;/div&gt;
          &lt;div class="contact1"&gt;&lt;h3 class="contact1"&gt;test&lt;/h3&gt;&lt;/div&gt;
      &lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>This is the result:</p>
  
  <p><img src="https://i.imgur.com/UIC6Hnc.png" alt=""></p>
  
  <p>But I want "test" to start next to the first line of the first line, like this:</p>
  
  <p><img src="https://i.imgur.com/foxFwhS.png" alt=""></p>
  
  <p>I would try to move it with the properties <code>top</code> or <code>bottom</code> but I do not think it is the best fix since I think it might display different when watching the website from different screens (mainly when watching it from the phone).</p>
  
  <p>Is there any way to achieve this?</p>