freeCodeCamp Challenge Guide: Create Bootstrap Wells

freeCodeCamp Challenge Guide: Create Bootstrap Wells
0.0 0

#1

Bootstrap has a class called well that can create a visual sense of depth for your columns.

Nest one div element with the class well within each of your col-xs-6 div elements.

<div class="container-fluid">
  <h3 class="text-primary text-center">jQuery Playground</h3>
  <div class="row">
    <div class="col-xs-6">
      <div class="well">

      </div>
    </div>
    <div class="col-xs-6">
      <div class="well">

      </div>
    </div>
  </div>
</div>

#3

Just in case you want to use the class “well” in your projects, be sure you are not using Bootstrap version 4. The Bootstrap version 4 does not have the class “well”. If you want to use this class, try with the version 3 of bootstrap.

You could try with the class “card” if you are using bootstrap 4 and beyond, I recommend you to search for it.


#4

why do you have to make a whole new line of div elements. Is it not possible to just space after col-xs-6 and add the well class?