title: How to make button with icon at left side without line break?
body: <p>With tailwindcss I make button with icon at left side, but I got that icon and buttons are on different lines and to fix it I wrapped these 2 elements with <code>flex items-start justify-between</code> classes :</p>
  <pre><code>&lt;div class=&quot;flex&quot;&gt;
      &lt;button type=&quot;submit&quot; class=&quot;bg-gray-500 text-white hover:bg-purple-500 p-2 rounded text-sm w-auto&quot;&gt;
          &lt;div class=&quot;flex items-start justify-between&quot; &gt;
          &lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 20 20&quot; fill=&quot;currentColor&quot;&gt;
              &lt;path fill-rule=&quot;evenodd&quot; d=&quot;M6.707 4.879A3 3 0 018.828 4H15a3 3 0 013 3v6a3 3 0 01-3 3H8.828a3 3 0 01-2.12-.879l-4.415-4.414a1 1 0 010-1.414l4.414-4.414zm4 2.414a1 1 0 00-1.414 1.414L10.586 10l-1.293 1.293a1 1 0 101.414 1.414L12 11.414l1.293 1.293a1 1 0 001.414-1.414L13.414 10l1.293-1.293a1 1 0 00-1.414-1.414L12 8.586l-1.293-1.293z&quot; clip-rule=&quot;evenodd&quot; /&gt;
          &lt;/svg&gt;
          Cancel
          &lt;/div&gt;
      &lt;/button&gt;
  </code></pre>
  <p>But in result icon is hidden at all and I see only Cancel button.
  How to fix it ?</p>
  <p><strong>MODIFIED BLOCK:</strong>
  My PhpStorm show hint that div is not allowed inside of <code>&lt;button&gt;</code> tag, so I tried to wrap
  with span, like</p>
  <pre><code>&lt;button type=&quot;submit&quot; class=&quot;bg-gray-500 text-white hover:bg-purple-500 p-2 rounded text-sm w-auto&quot;&gt;        
      &lt;span class=&quot; flex items-start justify-start&quot;&gt;
          &lt;span class=&quot;&quot;&gt;
              &lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 20 20&quot; fill=&quot;currentColor&quot;&gt;
                  &lt;path fill-rule=&quot;evenodd&quot;
                        d=&quot;M6.707 4.879A3 3 0 018.828 4H15a3 3 0 013 3v6a3 3 0 01-3 3H8.828a3 3 0 01-2.12-.879l-4.415-4.414a1 1 0 010-1.414l4.414-4.414zm4 2.414a1 1 0 00-1.414 1.414L10.586 10l-1.293 1.293a1 1 0 101.414 1.414L12 11.414l1.293 1.293a1 1 0 001.414-1.414L13.414 10l1.293-1.293a1 1 0 00-1.414-1.414L12 8.586l-1.293-1.293z&quot;
                        clip-rule=&quot;evenodd&quot;/&gt;
              &lt;/svg&gt;
          &lt;/span&gt;
          &lt;span&gt;
              Cancel
          &lt;/span&gt;
      &lt;/span&gt;        
  &lt;/button&gt;
  </code></pre>
  <p>But icon is not visible anyway.</p>