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

HTML

Paulo De Alencar Cabral
Paulo De Alencar Cabral
4,609 Points

Modal Windows isn't showing.

Modal Windows isn't showing on my website, I'm the same steps from the video and I don't know what could be wrong there. I'm using the same ID in the modal and the button, and nothing changes. Someone may help me please?

1 Answer

Paulo De Alencar Cabral
Paulo De Alencar Cabral
4,609 Points

<div class="col-lg my-5 order-lg-3 bg-white"> <h2 class="mb-1 display-6">Looking for apply?</h2> <p>Our class will start in Fall 2022. to apply click in the button below.</p> <button type="button" class="btn btn-dark btn-lg my-5" data-toggle="modal" data-target="#apply">Apply Now!</button> </div>

 </div>
 <!--Modals Starts-->
          <div class="modal fade" id="apply" tabindex="-1" role="dialog" aria-labelledby="apply-text" aria-hidden="true">
            <div class="modal-dialog" role="document">
              <div class="modal-content">
                <div class="modal-header">
                  <h5 class="modal-title" id="exampleModalLabel">Apply Right Now</h5>
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                  </button>
                </div>
                <div class="modal-body">
                  Form Application goes here...
                </div>
                <div class="modal-footer">
                  <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                  <button type="button" class="btn btn-primary">Save changes</button>
                </div>
              </div>
            </div>
          </div>