George John has Published 1081 Articles

Bootstrap navbar-static-top class

George John

George John

Updated on 12-Jun-2020 17:24:14

674 Views

To create a navbar that scrolls with the page, add the .navbar-static-top class. This class does not require adding the padding to the .ExampleLive Demo           Bootstrap Example                                                       Car Accessories                                                Car Cover                Car Mobile Holder                Car Mobile Charger                                

Bootstrap .nav-justified class

George John

George John

Updated on 12-Jun-2020 17:12:22

344 Views

Make tabs or pills of equal widths as of their parent at screens wider than 768px using class .nav-justified along with .nav, .nav-tabs or .nav, .nav-pills respectively. On smaller screens, the nav links are stacked.ExampleLive Demo           Bootstrap Example                                 Subjects                       Home             Team             Authors             MVPs              

Set disabled links with Bootstrap

George John

George John

Updated on 12-Jun-2020 16:46:15

4K+ Views

For each of the .nav classes, if you add the .disabled class, it will create a gray link that also disables the :hover state.You can try to run the following code to set disabled links −ExampleLive Demo           Bootstrap Example         ... Read More

Usage of btn-xs Bootstrap class

George John

George John

Updated on 12-Jun-2020 16:13:38

188 Views

Create an extra small button using the btn-xs Bootstrap class. You can try to run the following code to implement the btn-xs class:ExampleLive Demo           Bootstrap Example                                                       Subject                                             Programming             Web Dev             Database             Networking                    

Change the size of Bootstrap input groups

George John

George John

Updated on 12-Jun-2020 16:09:08

2K+ Views

Change the size of the input groups, by adding the relative form sizing classes like .input-group-lg, input-group-sm, input-group-xs to the .input-group itself.You can try to run the following code to change the size of input groups in Bootstrap:ExampleLive Demo           Bootstrap Example                                                                   @                                                       @                                                       @                                

Set disabled state for Bootstrap Buttons

George John

George John

Updated on 12-Jun-2020 15:13:00

247 Views

To set disabled state, use the disabled class.You can try to run the following code for the disabled state of a button −ExampleLive Demo           Bootstrap Example                                 The following are some buttons:                Default Button                      Disabled Button          

Clearfix Bootstrap class

George John

George John

Updated on 12-Jun-2020 14:58:47

348 Views

Use the .clearfix class to clear the float of any element in Bootstrap.ExampleYou can try to run the following code to implement the clearfix class:Live Demo           Bootstrap Example                                                       Quick Float to left                                 Quick Float to right                    

sr-only Bootstrap class

George John

George John

Updated on 12-Jun-2020 14:53:35

421 Views

Hide an element to all devices except screen readers with the class .sr-only.You can try to run the following code to implement the sr-only Bootstrap −ExampleLive Demo           Bootstrap Example                                                                      Email address                                                        Password                                                

Create block level button with Bootstrap

George John

George John

Updated on 12-Jun-2020 14:43:49

296 Views

To create a block level button, use the .btn-block class.You can try to run the following code to add a block level button −ExampleLive Demo           Bootstrap Example                                       The following are block level buttons:                Block level Primary button                      Block level button          

img-rounded Bootstrap class

George John

George John

Updated on 12-Jun-2020 14:37:56

297 Views

Use the img-rounded Bootstrap class to style your image and give it rounded corners:ExampleLive Demo           Bootstrap Images                                 Styling images with Bootstrap       Original Image             Rounded Image          

Advertisements