Bootstrap Wells

In Bootstrap, .wells class is used to add a rounded border around a component with a gray background color and some padding.

Basic wells:

The .well class is used to create basic well.

Example:

<div class="container">
 <h2>Well</h2>
 <div class="well">Basic Well</div>
</div>

OUTPUT:

Small Well:

.well-sm class after .well class is used to create a small-sized well.

Example:

<div class="container"> 
 <h2>Well Size</h2> 
 <div class="well well-sm">This is Small Well</div>  
</div>

OUTPUT:

Normal Well:

It is the default swell size.

Example:

<div class="container"> 
 <h2>Well Size</h2>  
 <div class="well">This is Medium Well (By Default)</div>  
</div>

OUTPUT:

Large Well:

.well-lg class after .well class is used to create a large-sized well.

Example:

<div class="container"> 
 <h2>Well Size</h2>
 <div class="well well-lg">This is Large Well</div> 
</div>

OUTPUT: