To set positive action to a card in Bootstrap, use the bg-success class with the card classSet positive action and use “card bg-success” −Now add the body of the card using the card-body class −   India won by 7 wickets You can try to run the following code to ... Read More

Use the .justify-content-* class in Bootstrap to align flex items from start, end, center, between, etc.For justify-content-start, the justified flex items would be aligned like −For justify-content-end, the justified flex items would be aligned like −For justify-content-around, the justified flex items would be aligned like −Let us see how to ... Read More

Use the card-body class in Bootstrap to set container for the content of the card −   Body of card1 Now add it in the Bootstrap card class −       Body of card1   You can try to run the following code to set the container ... Read More

Create a grid of cards with Bootstrap 4, using the card-columns class −   Set the card classes inside the card-columns class −             One       Let us see an example stating the usage of card-columns class −ExmapleLive Demo       Bootstrap Example                             Demo                             One                                       Two                                       Three                    

Reverse the order of flex items using the flex-column-reverse class in Bootstrap 4.Set the flex-column-reverse class as shown below −Add the flex items to include in your Bootstrap 4 −   Demo 1   Demo 2   Demo 3 The following is an example to implement the flex-column-reverse class −ExampleLive ... Read More

Use the justify-content-*-around class in Bootstrap to align flex items around on different screen sizes −justify-content-sm-around : Justify content on small screen size justify-content-md-around : Justify content on medium screen size justify-content-lg-around : Justify content on large screen sizeFor an example, let us see how to align flex items for ... Read More

To set subtitle after a title in Bootstrap card, use the card-subtitle class.Let us see how −   Set Subtitle here Add the above after the card-title class and inside the card-body class −   Sports   Indoor   Squash, Dart, Chess You can try to run the following code ... Read More

If you want to wrap flex items in Bootstrap, then use the flex-wrap class. To wrap, use −       India   US   UK   Australia   Denmark You can try to run the following code to avoid wrapping of flex items −ExampleLive Demo     ... Read More

Use the flex-*-wrap class like flex-lg-wrap, flex-sm-wrap, flex-md-wrap, etc to wrap flex items on different screen sizes −The following is the code snippet for the flex items wrap on small screen size using the flex-sm-wrap class −   Poland   Netherlands   Ireland   Brazil You can try to run ... Read More

If you want to remove float from an element, then Bootstrap 4 has a class called float-none.This removes the float −   This text is on the left (float removed). Default is left. On setting the float-none class, the text moves on the left, which is laso the default alignment ... Read More