What is the difference between Bootstrap .container and .container-fluid classes?

Quick version: .container has one fixed width for each screen size in bootstrap (xs,sm,md,lg); .container-fluid expands to fill the available width. The difference between container and container-fluid comes from these lines of CSS: Depending on the width of the viewport that the webpage is being viewed on, the container class gives its div a specific fixed width. These lines don’t exist in any form for container-fluid, … Read more

Bootstrap popover is not working

From the Docs on Popovers: Opt-in functionality:For performance reasons, the Tooltip and Popover data-apis are opt-in, meaning you must initialize them yourself. So you must call .popover() manually in JavaScript like this: Or you can use whatever selector you want Here’s an example using StackSnippets. Show code snippet Note: This is similar to the answer … Read more

What are these attributes: `aria-labelledby` and `aria-hidden`

HTML5 ARIA attribute is what you’re looking for. It can be used in your code even without bootstrap. Accessible Rich Internet Applications (ARIA) defines ways to make Web content and Web applications (especially those developed with Ajax and JavaScript) more accessible to people with disabilities. To be precise for your question, here is what your attributes are … Read more

What is the `data-target` attribute in Bootstrap 3?

data-target is used by bootstrap to make your life easier. You (mostly) do not need to write a single line of Javascript to use their pre-made JavaScript components. The data-target attribute should contain a CSS selector that points to the HTML Element that will be changed. Modal Example Code from BS3: In this example, the button has data-target=”#myModal”, if you … Read more