- Trending Categories
- Data Structure
- Networking
- RDBMS
- Operating System
- Java
- MS Excel
- iOS
- HTML
- CSS
- Android
- Python
- C Programming
- C++
- C#
- MongoDB
- MySQL
- Javascript
- PHP
- Physics
- Chemistry
- Biology
- Mathematics
- English
- Economics
- Psychology
- Social Studies
- Fashion Studies
- Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Found 626 Articles for CSS Framework
10K+ Views
Use the float-right class in Bootstrap to place an element on the right.The default text alignment is on the left and use the float-right class to align text on the right as in the following code snippet − This text is on the right. It can be used on any other element as well, for example, , , etc − On the right You can try to run the following code to implement the float-right class −ExampleLive Demo Bootstrap Example Example This text is on the right. This text is on the left. Float Removed
57 Views
To align gathered items from the start, use the .align-content-start class in Bootstrap 4.Set the items as shown below − Work 1 Work 2 Work 3 Work 4 Work 5 Work 6 You can try to run the following code to implement the align-content-start in Bootstrap 4 −ExampleLive Demo Bootstrap Example Align Flex Items Work 1 Work 2 Work 3 Work 4 Work 5 Work 6 Work 7 Work 8 Work 9 Work 10 Work 11 Work 12 Work 13 Work 14
127 Views
Use the btn-outline-light class in Bootsrap 4 to set light grey outlined button.To include it on the web page, set it as a class in the element as shown in the following code snippet −Let us see an example to implement the btn-outline-light class −ExampleLive Demo Bootstrap Example Demo Button Below is a light grayed outline button: Sample
69 Views
To set blue outlined Bootstrap 4 button, use the .btn-outline-primary class.Add a blue outline to a button − Blue outline You can try to run the following code to implement the btn-outline-primary class in Bootstrap −ExampleLive Demo Bootstrap Example Bootstrap 4 You can see blue outline below: Blue outline
381 Views
Use the card-header class to create header of a Bootstrap card − This is the header After including the card header, you can add the card body and footer as shown in the following code snippet − This is demo content. This is the footer. You can try to run the following code to implement the card-header class in Bootstrap 4 −ExampleLive Demo Bootstrap Example Demo Heading This is the header This is demo content. This is the footer
67 Views
To stretch a flex item on different screens in Bootstrap 4, use the .align-self-*-stretch class.To strect in on different screens, you need to use align-self-sm-stretch, align-self-md-stretch, align-self-lg-stretch, etc. Below is an example for small screen size − A-one B-one C-one D-one You can try to run the following code to stretch a flex item on different screen sizes −ExampleLive Demo Bootstrap Example Align Specific Flex Item and Stretch A-one B-one C-one D-one Small Screen Size A-one B-one C-one D-one Medium Screen Size A-one B-one C-one D-one Large Screen Size A-one B-one C-one D-one
266 Views
Use the float-none class in Bootstrap to remove float from an element.The default for a text is always left; therefore removing float will place the text on the left −You can try to run the following code to remove float from an element −ExampleLive Demo Bootstrap Example Demo This text is on the left (on small screen). This text is on the left (on medium screen). This text is on the left (float removed). This text is on the left (on extra large screen). This text is on the left (float removed).
88 Views
Use the btn-outline-danger class in Bootsrap 4 to indicate danger with red outlined button.The following is an example to set a button that indicates danger with red outline − Danger The class is added using the btn and btn-outline-danger class in Bootstrap −class="btn btn-outline-danger”Let us see an example to implement the btn-outline-danger class −ExampleLive Demo Bootstrap Example Animals Animals are in danger. To know what, you need to click below: Danger
172 Views
Set orange outline for a Bootstrap 4 button, using the btn-outline-warning class and indicate warning action.The following includes the orange outline on a button − Rejected The class is added just as any other class added to any element in Bootstrap. For a Bootstrap button, I used the element.You can try to run the following code to implement the btn-outline-warning class −ExampleLive Demo Bootstrap Example College Placements Selected Students Rejected Students Result Awaited List of selected and rejected students: Selected Rejected
78 Views
To add information to a card in Bootstrap 4, use the bg-info class.Use the card class with the bg-info class:Add the card body after that using the card-body class − Demo Text You can try to run the following code to add information −ExampleLive Demo Bootstrap Example Festival Celebration Reach till 5PM