Boostrap multiple inputs inside a input-group
<p>I need to do something pretty simple but for several days I'm working on but no luck.
I need to do something like this:</p>

<p><a href="https://i.stack.imgur.com/URVNc.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/URVNc.png" alt="enter image description here"></a></p>

<p>So I need one input, space, 2 inputs next to each other, space, a button.</p>

<pre><code>&lt;div class="container"&gt;
    &lt;form class="form-inline"&gt;
        &lt;div class="form-group"&gt;

            &lt;div class="input-group"&gt;
                &lt;input type="text" class="form-control" placeholder="field1"/&gt;
            &lt;/div&gt;


            &lt;div class="input-group"&gt;
                &lt;input type="text" class="form-control" placeholder="field2"/&gt;
                &lt;input type="text" class="form-control" placeholder="field3"/&gt;
            &lt;/div&gt;


        &lt;/div&gt;


        &lt;button type="submit" class="btn btn-success"&gt;My button&lt;/button&gt;
    &lt;/form&gt;

    &lt;/div&gt;
</code></pre>

<p>and it gives this:</p>

<p><a href="https://i.stack.imgur.com/ajtiS.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ajtiS.png" alt="enter image description here"></a></p>

<p>I have no idea what I'm doing wrong.</p>

<p>Thanks for any idea.</p>

<p>C.C.</p>