Alignment of buttons in the Card footer is so much easy when you are familiar with the float element. There is another way to align the left or right wherever you want to place the button in the footer of the card. In this article, you will learn how to align buttons in the footer section of a Bootstrap Card. Bootstrap’s cards provide a flexible and extensible content container with multiple variants and options.
Structure of Bootstrap card:
- Card Image
- Card Body
- Card Title
- Card Text
- Card Footer
- Left Button
- Center Button
- Right Button
Example: Use float-left, float-right and float-right to align the buttons on the card.
- Bootstrap 4 | Buttons
- How to get circular buttons in bootstrap 4 ?
- Bootstrap Buttons with Examples
- Bootstrap (Part-3) | Buttons, Glyphicons, Tables
- How to use grid for images in bootstrap card ?
- Why card images use data-src (not src) for image in Bootstrap 4 ?
- How to use links on card-img-overlay class in Bootstrap 4 ?
- How to display multiple horizontal images in Bootstrap card ?
- How to Display Validation Message for Radio Buttons with Inline Images using Bootstrap 4 ?
- How to design Responsive card-deck with fixed width in Bootstrap ?
- How to align navbar items to the right in Bootstrap 4 ?
- How to align button to right side of text box in Bootstrap?
- How to use Bootstrap to align labels with content into 4 columns ?
- How to Align Navbar Items to Center using Bootstrap 4 ?
- How to Align navbar logo to the left screen using Bootstrap ?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.