Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS Bootstrap Basics Building Forms With Bootstrap Structured Form Layouts with the Grid

Thomas Barkel
PLUS
Thomas Barkel
Courses Plus Student 7,222 Points
Posted by Thomas Barkel
Thomas Barkel
Courses Plus Student 7,222 Points

Register button not displaying correctly

My form looks great besides the Register button. Alignment and spacing are off and the linebreak is not appearing to separate the CC info with the Register button. 

      <div class="form-row">
      <label class="col-lg-12">Expiration Date:</label>

        <div class="form group col-lg-8">
          <select class="custom-select form-control" id="exp-month">
  <option value="1">1 - January</option>
  <option value="2">2 - February</option>
  <option value="3">3 - March</option>
  <option value="4">4 - April</option>
  <option value="5">5 - May</option>
  <option value="6">6 - June</option>
  <option value="7">7 - July</option>
  <option value="8">8 - August</option>
  <option value="9">9 - September</option>
  <option value="10">10 - October</option>
  <option value="11">11 - November</option> 
  <option value="12">12 - December</option>
</select>  
         </div>

          <div class="form group col-lg">

            <select class="custom-select form-control" id="exp-year">
  <option value="2016">2016</option>
  <option value="2017">2017</option>
  <option value="2018">2018</option>
  <option value="2019">2019</option>
  <option value="2020">2020</option>
</select> 

         </div>

        <hr class="mb-4">
        <button type="submit" class="btn btn-primary btn-lg">Register</button>
      </div>          

    </form>

 <!--/registration form-->
        </div>
        </div>
      </div>
    </div>
Henry .
Henry .
52 Points
Henry .
Henry .
52 Points

Can you show us how you would like the register button to appear with using something like Paint and positioning it?

2 Answers

Elizabeth Stone
Elizabeth Stone
6,469 Points
Elizabeth Stone
Elizabeth Stone
6,469 Points

You have placed your button inside the div for the Expiration Date section. If you move the closing </div> tag (shown right below your <button> tag) above your <hr> tag then it should work. Hope that helps!

André Larsen
André Larsen
9,652 Points
André Larsen
André Larsen
9,652 Points

You seem to have a closed </form> tag, but I can't seem to find the opening <form tag>. Think that could do it? :)