title: Bootstrap form spacing issues with form-inline and form-group?
body: <p>So I'm trying to create a basic layout for someone to enter their name and address, and it currently looks something like: </p>
  
  <p><a href="https://i.stack.imgur.com/1Yr77.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1Yr77.png" alt="enter image description here"></a></p>
  
  <p>So, I'm basically stacking like this: </p>
  
  <pre><code>&lt;div className='form-inline'&gt;&lt;/div&gt;
  &lt;div className='form-group'&gt;&lt;/div&gt;
  &lt;div className='form-inline'&gt;&lt;/div&gt;
  </code></pre>
  
  <p>But why is there a space between the <code>'form-group'</code> and the <code>'form-inline'</code>? Is there anything I can do to take it out? </p>
  
  <p>To do this, I used this structure: </p>
  
  <pre><code>          &lt;form action="" className="form-inline"&gt;
                      &lt;div className="form-group"&gt;
                          &lt;input
                              className="form-control"
                              placeholder="First Name"
                              }}
                          /&gt;
                      &lt;/div&gt;
                      &lt;div action="" className="form-group"&gt;
                          &lt;input
                              className="form-control"
                              placeholder="Last Name"
                          /&gt;
                      &lt;/div&gt;
                  &lt;/form&gt;
                  &lt;form action="" className="form-group"&gt;
                      &lt;input
                          className="form-control"
                          placeholder='Street'
                      /&gt;
                  &lt;/form&gt;
                  &lt;form action="" className="form-inline"&gt;
                      &lt;div className="form-group"&gt;
                          &lt;input
                              className="form-control"
                              placeholder='City'
                          /&gt;
                      &lt;/div&gt;
                      &lt;div className="form-group"&gt;
                          &lt;input
                              className="form-control"
                              name='state'
                              placeholder='State'
                              maxLength='2'
                              size='2'
                              type='text' 
                          /&gt;
                      &lt;/div&gt;
                      &lt;div className="form-group"&gt;
                          &lt;input
                              className="form-control"
                              name='zip'
                              type='text'
                              placeholder='zip'
                              maxLength='5'
                              size='5'
                          /&gt;
                      &lt;/div&gt;
                  &lt;/form&gt;
  </code></pre>
  
  <p>Any help is greatly appreciated as I'm new to bootstrap, thanks!! </p>