What is the well equivalent class in Bootstrap 4

Question

In bootstrap-3 there is  well class which adds a rounded border around an element with a gray background color and some padding    lt div class  well  gt Basic Well lt  div gt    But  I didn t find any  well class in bootstrap-4  Is there any tag equivalent to  well in bootstrap-4

User · Answer

Wells are dropped from Bootstrap with the version 4.

You can use Cards instead of Wells.

Here is a quick example for how to use new Cards feature:

<div class="card card-inverse" style="background-color: #333; border-color: #333;">
  <div class="card-block">
    <h3 class="card-title">Card Title</h3>
    <p class="card-text">This text will be written on a grey background inside a Card.</p>
    <a href="#" class="btn btn-primary">This is a Button</a>
  </div>
</div>

User · Answer

Sure officially version says the cards are the new replacements for Bootstrap wells  But Cards are a quite broad Bootstrap components now  In simple terms  you can also use Bootstrap Jumbotron too

User · Answer

Update 2018     card has replaced the well   Bootstrap 4   lt div class  card card-body bg-light  gt       Well  lt  div gt    or  as two DIVs      lt div class  card bg-light  gt       lt div class  card-body  gt                   lt  div gt   lt  div gt     Note  in Bootstrap 4 Alpha  these were known as card-block instead of card-body and bg-faded instead of bg-light   http   codeply com go rW2d0qxx08

User · Answer

I m mading my classes well for class alert  for me it looks like it s getting nice  but some tweaks are sometimes needed as to put the width 100    lt div class  alert alert-light  style  width 100    gt     lt strong gt Heads up  lt  strong gt  This  lt a href     class  alert-link  gt alert needs your attention lt  a gt   but it s not super important   lt  div gt

User · Answer

This worked best for me    lt div class  card bg-light p-3  gt    lt p class  mb-0  gt Some text here lt  p gt   lt  div gt

User · Answer

None of the answers seemed to work well with buttons  Bootstrap v4 1 1   lt div class  card bg-light  gt       lt div class  card-body  gt           lt button type  submit  class  btn btn-primary  gt              Save          lt  button gt           lt a href     class  btn btn-secondary  gt              Cancel          lt  a gt       lt  div gt   lt  div gt

User · Answer

Card seems to be  discarded  LOL  I found the  well  not working with bootstrap 4 3 1 and jQuery v3 4 1  just working fine with bootstrap 4 3 1 and jQuery v3 3 1  Hope it helps

User · Answer

Looking for a one line option       lt div class  quot jumbotron bg-dark quot  gt  got a team   lt  div gt           https   getbootstrap com docs 4 0 components jumbotron

[css] What is the '.well' equivalent class in Bootstrap 4

Examples related to css

Examples related to twitter-bootstrap

Examples related to twitter-bootstrap-3

Examples related to bootstrap-4

Examples related to twitter-bootstrap-4