Alex Onsman has Published 203 Articles

Bootstrap .card class

Alex Onsman

Alex Onsman

Updated on 18-Jun-2020 09:07:37

233 Views

To create a card in Bootstrap, use the .card class and add card body as well −   Basic card You can also set the Bootstrap card title and card footer using the card-title and card-title class respectively.The following is the code to create a Bootstrap card −ExampleLive Demo ... Read More

Bootstrap 4 .float-left class

Alex Onsman

Alex Onsman

Updated on 18-Jun-2020 09:05:18

2K+ Views

Use the float-left class in Bootstrap to float an element to the left.To place it on the left −   I am on the left.   I am on the left. You can try to run the following code to implement the float-left class −ExampleLive Demo ... Read More

Wrap flex items in reversed order in Bootstrap on different screens

Alex Onsman

Alex Onsman

Updated on 18-Jun-2020 09:03:19

170 Views

To wrap flex items in reverse order on different screen sizes, you need to use the flex-*wrap-reverse class.The class gives options to reverse and wrap flex items on small, medium, large, and extra large screen sizes −Small Screen Size (flex-sm-wrap-reverse)   Goal 1   Goal 2   Goal 3   ... Read More

Float an element to the right with Bootstrap 4

Alex Onsman

Alex Onsman

Updated on 18-Jun-2020 09:00:40

115 Views

If you want to float an element on the right, you need to use the float-right class.Set it on the right −   The text is on right! Let us see an example to float element on the right −ExampleLive Demo   Bootstrap Example     ... Read More

Bootstrap 4 .card-subtitle class

Alex Onsman

Alex Onsman

Updated on 18-Jun-2020 08:32:24

310 Views

Use the card-subtitle class to set subtitle for the card.The card-subtitle class is used as shown below −SportsHere, I have set the subtitle as “Indoor” for an example. The subtitle class comes after the card-title Bootstrap class −   Sports   Indoor   Squash, Dart, Chess Let us see the ... Read More

Bootstrap 4 Button .btn-outline-secondary class

Alex Onsman

Alex Onsman

Updated on 18-Jun-2020 08:29:48

172 Views

Use the btn-outline-seondary class to set a grey outline in Bootstrap 4 to show less important information.The following is the code to set Bootstrap button to add grey outline −   More Let us see how to implement the btn-outline-secondary class −ExampleLive Demo       Bootstrap Example ... Read More

Float an element to the right on different screens with Bootstrap

Alex Onsman

Alex Onsman

Updated on 18-Jun-2020 08:28:05

1K+ Views

Use the float-*-right class in Bootstrap to float an element to the right. Different screen size includes setting the float for small, medium, large and extra large sizes.Let us see how to float and element to the right on small and medium size screen size −Small Screen Size   This ... Read More

How to work with Bootstrap 4 .float-*-right class

Alex Onsman

Alex Onsman

Updated on 18-Jun-2020 08:23:35

483 Views

If you want to float element on the right on different screen sizes, then use the float-*-right class i.e.The following is for small, medium, large and extra large devices −   This text is on the right (on small screen).   This text is on the right (on ... Read More

Set less important content with Bootstrap 4 card

Alex Onsman

Alex Onsman

Updated on 18-Jun-2020 08:21:57

63 Views

To set less important stuff in Bootstrap, use the card class with the bg-secondary contextual class as shown below −Set the card body as well using the card-body class −   Fitness Trackers Let us see how to set a card with less important content −ExampleLive Demo   ... Read More

Align a flex item at the end in Bootstrap 4

Alex Onsman

Alex Onsman

Updated on 18-Jun-2020 07:58:38

617 Views

Use the .align-self-end class to align flex item at the end in Bootstrap 4.The following is my div −Now you need to set the flex items, wherein I am aligning the 3rd flex item −   Item 1   Item 2   Item 3   Item 4 You can try ... Read More

Previous 1 ... 6 7 8 9 10 ... 21 Next
Advertisements