title: nested layout in GetUIKit
body: <p>I want to show this layout using getuikit.com:</p>
  
  <pre><code>- option 1
  - option 2. details: option 2a
  </code></pre>
  
  <p>I try as follows:
  (it works if you put this snippet in a test.html file; in stackoveflow, the <code>select</code> appears in the next line for some reason)</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-html lang-html prettyprint-override"><code>&lt;link href="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.1.6/css/uikit.min.css" rel="stylesheet"/&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.1.6/js/uikit.min.js"&gt;&lt;/script&gt;
      &lt;div class="uk-margin"&gt;
        &lt;div class="uk-form-controls"&gt;
          &lt;label&gt;&lt;input class="uk-radio" type="radio" name="aa"&gt; option1&lt;/label&gt;
          &lt;br/&gt;
          &lt;div class="uk-form-horizontal"&gt;
            &lt;label class="uk-form-label"&gt;&lt;input class="uk-radio" type="radio" name="aa"&gt; option2. detail:&lt;/label&gt;
            &lt;div class="uk-form-controls"&gt;
              &lt;select class="uk-select"&gt;
                &lt;option&gt;option 2a&lt;/option&gt;
                &lt;option&gt;option 2b&lt;/option&gt;
              &lt;/select&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>however, "option 2" appears with a different small font. How to solve this?</p>
  
  <p>Also, how to achieve this layout, with "details: ..." being indented under option 2?</p>
  
  <pre><code>- option 1
  - option 2. 
    details: option 2a
  </code></pre>
  
  <p>ps: I've read the docs <a href="https://getuikit.com/docs/form" rel="nofollow noreferrer">https://getuikit.com/docs/form</a> and related, but I find it difficult to understand the construction.</p>