Category Archives: Bootstrap Questions And Answers

Bootstrap enable scroll bars


Bootstrap enable scroll bars– You can override the default css by your own to enable the scrolling.


Bootstrap enable scroll bars Example

You can add the following css in bootstrap to enable the page scrolling-

Bootstrap enable scroll bars Example:

html, body {
    overflow: visible;
}

Bootstrap hide modal JavaScript


Bootstrap hide modal JavaScript– It is pretty quick to hide modal in JavaScript. We can hide bootstrap Modal using jQuery.


Bootstrap hide modal JavaScript Example

You can hide the bootstrap modal simply as below-

Bootstrap hide modal JavaScript Example:

$('#myModal').modal('hide');

So the above example will hide the myModal.

Bootstrap Add Text Align in Table Column


Bootstrap Add Text Align in Table Column– We can use bootstrap predefined classes to add the text align in table cell.


Bootstrap Add Text Align in Table Column Example

You can use following predefined classes for the alignment in table column-

  • Text Align Center– Use Class text-center to align text center in table column.
  • Text Align Left– Use Class text-left to align text center in table column.
  • Text Align Right– Use Class text-right to align text center in table column.

Bootstrap Add Text Align in Table Column Example:






Text left. Text center. Text right.
Text left. Text center. Text right.

Try it »

If you run the above example it will produce output something like this-

Bootstrap Add Text Align in Table Column

Bootstrap create column height same


Bootstrap create column height same By default column height is not same so we need to add our own css class to make column height same as other. Here in this article we are going to add our own css to make all columns height same. You can use our online editor to edit and run the code online.


Bootstrap create column height same Example

You can create custom class to make all columns height same. Here is an exmaple-

Bootstrap create column height same Example:









Column 1
Column 2
Column 3

Try it »

As you can see we have made middle column height 200px now other columns will have the same height.

If you run the above example it will produce output something like this-

Bootstrap create column height same

Bootstrap Add Space Between Rows


Bootstrap Add Space Between Rows Css, Add Margin – Sometimes we require custom space between rows, we can override the default behavior of row.


Bootstrap Add Space Between Rows | Margin Example

For Bootstrap version > 4 you can use the spacer class mt-n, where n can be 1 or 2. Here is simple example-

Bootstrap Add Space Between Rows Css Example:

If you are using Bootstrap version < 4, You can create custom class simply as below and add margin as per your requirement.

Bootstrap Add Row Margin Example:

                           








Row 1

Row 2

Row 3

Row 4

Try it »

If you run the above example it will produce output something like this-

Bootstrap Add Space Between Rows

Bootstrap grid without padding


Bootstrap grid without padding- We can create our own custom class to override the default behavior such as remove padding, margin etc. Here in this article we are going to explain how you can remove padding from grid in Bootstrap.


Bootstrap grid without padding | Remove Padding Example

You can create your custom class and add the following css to remove padding from column-

Bootstrap Grid Remove Padding Css| Example:





Col 1
Col 2

So you can remove padding from any grid column in Bootstrap.

Bootstrap check modal shown hidden


Bootstrap check modal shown hidden– We can check whether the bootstrap modal is shown or hidden using jQuery. Here in this article we are going to explain how to check whether the modal is shown or hidden in Bootstrap.


Bootstrap check modal shown hidden | JavaScript | jQuery Example

Using jQuery you can check that modal has in class or not-

|Bootstrap check modal shown hidden Example:


So using the above java script you can check whether the bootstrap modal is open or not.

Bootstrap fixed footer


Bootstrap fixed footer– You can use navbar-fixed-bottom class to make footer fixed.


Here is an example of sticky/fixed footer in bootstrap-

Bootstrap fixed footer Example:


Bootstrap table remove border


Bootstrap table remove border– Sometimes we need borderless table in bootstrap, we can override the default functionality by our own class. Here in this article, we are going to explain how you can create the borderless table in Bootstrap. You can also use our online editor to edit and run the code online.


Bootstrap table remove border Example

You can create custom class simply as below to remove the table border/stripe-

Bootstrap table remove border Example:



....
...

Try it »

If you run the above example it will produce output something like this-

Bootstrap table remove border