title: how to make MJML <mj-text> elements display inline-block
body: <p>I'm new to <a href="https://mjml.io/api/documentation/" rel="noreferrer"><strong>mjml</strong></a> and I'm trying to find out if there is a way to make <code>&lt;mj-text&gt;</code> elements to display <code>inline-block</code> <strong>without</strong> using <code>&lt;mj-style&gt;</code> or inline css.</p>
  
  <p>I have an <code>&lt;mj-text&gt;</code> which renders dynamically-generated text  - so I have no way to foresee its width. I would like this container's background to end where the text ends and not fill the entire page's width (like block elements do).</p>
  
  <p>Here is and <a href="https://mjml.io/try-it-live/H1F2Q09PQ" rel="noreferrer">example</a> of the template I'm trying to render:</p>
  
  <pre><code>&lt;mjml&gt;
    &lt;mj-body&gt;
      &lt;mj-section&gt;
        &lt;mj-column&gt;
          &lt;mj-text align="left" container-background-color="#c3e16d" color="#60b7f1" font-size="14px"&gt;
            &lt;span&gt;Dynamically Generated Text&lt;/span&gt;
          &lt;/mj-text&gt;
        &lt;/mj-column&gt;
      &lt;/mj-section&gt;
    &lt;/mj-body&gt;
  &lt;/mjml&gt;
  </code></pre>
  
  <p>After some searching <a href="https://mjml.io/try-it-live/B1QQNCqP7" rel="noreferrer">I did manage to get it to work</a> using an <code>&lt;mj-style&gt;</code> block - but what I'm trying to figure out if there is a more proper way to do it using the <code>mjml</code> api.</p>