Bootstrap Bootstrap 5

Question 1

Which Bootstrap modal option prevents the modal from closing when the user clicks outside of it (on the backdrop)?

Accepted Answer

data-bs-backdrop='static'

Answer

Setting `data-bs-backdrop='static'` makes the modal non-dismissible by clicking the backdrop; the modal only closes via its close button or programmatic call.

Question 2

In Bootstrap's grid system, what happens when column widths in a row add up to more than 12?

Accepted Answer

Columns wrap to the next line

Answer

Bootstrap's grid is based on CSS flexbox with `flex-wrap: wrap`, so columns exceeding a total of 12 units wrap to a new line automatically.

Question 3

What is the purpose of the Bootstrap `stretched-link` class?

Accepted Answer

Extends the clickable area of a link to cover its entire containing block

Answer

`stretched-link` uses a `::after` pseudo-element to make the containing block fully clickable, commonly used in cards to make the entire card clickable via a single anchor tag.

Question 4

Which Bootstrap JavaScript method programmatically shows a modal dialog that is already initialized?

Accepted Answer

Modal.show()

Answer

The Bootstrap Modal instance method `show()` programmatically displays the modal, equivalent to a user clicking a button with `data-bs-toggle='modal'`.

Question 5

What does the Bootstrap class `container-fluid` do differently from `container`?

Accepted Answer

It spans the full width of the viewport at all screen sizes without max-width constraints

Answer

`container-fluid` always spans 100% of the viewport width, while `container` has responsive max-width breakpoints that constrain its width at larger screens.

Bootstrap Practice Test

Bootstrap Practice Test

Bootstrap Bootstrap 5