Questions tagged [bootstrap-5]

Bootstrap 5 is the fifth major version of the popular frontend component library. The Bootstrap framework aids in the creation of responsive, mobile-first websites and web apps.

Bootstrap 5 is the fifth major version of the popular frontend component library and open source toolkit for developing with HTML, CSS, and JavaScript. The Bootstrap framework aids in the creation of responsive, mobile-first websites and web apps.


Key changes in v5:

  • Dropped the jQuery dependency
  • Dropped support for Internet Explorer (10 and 11)
  • Updated grid and layout
  • Updated forms
  • CSS custom properties added to many components

Latest version available: v5.0.0


Helpful resources

5709 questions
1
vote
1 answer

How to init Bootstrap Popover in Webpack Rails project

So I followed the bootstrap doc on who to init the popover, but it doesn't work. It threw this error. How do I fix this? Uncaught TypeError: bootstrap.Popover is not a constructor These are the codes. test_popover.html
1
vote
1 answer

How to have large-text breadcrumbs with heading tags in Bootstrap 5?

I want large heading text breadcrumbs, but using heading tags breaks breadcrumbs. Any ideas?
Seltonu
  • 95
  • 1
  • 9
1
vote
1 answer

Bootstrap 5+ carousel with cards based on viewport (screen size)

I have been searching quite some time for this but unfortunately all questions/answers are mostly 6/8 years old. Now that Bootstrap has evolved so much, I want to ask the question as maybe someone knows how to do this. My requirement is to have a…
Mecanik
  • 1,539
  • 1
  • 20
  • 50
1
vote
1 answer

Is there a way to have text in the title of a border with Bootstrap5?

I'm trying to have it so that text goes in the border of an element. I'm currently using Bootstrap 5 and jQuery. I've tried to use fieldset and legend elements however that does not seem to acheive this. This is the result I'm trying to get where…
HJP
  • 47
  • 4
1
vote
2 answers

POST method doesn't recieve any information from Form (DJANGO & BOOTSTRAP)

I have a form which registers a new user, I used Bootstrap 5 to make it look nice. However, when I press the submit button the form does not validate. The error it shows when I write print(form.errors) says that every field is required, which means…
B3CTOR
  • 45
  • 5
1
vote
1 answer

Bootstrap Accordion/Collapse Uncaught TypeError: Illegal invocation

I am using Bootstrap 5 accordion/collapse feature, my code seems to be in line with BS5 docs, but have an issue similar to this one on StackOverflow from a few months ago: Bootstrap Accordion Throws TypeError: Illegal invocation Here is the browser…
Webkraft Studios
  • 492
  • 5
  • 18
1
vote
2 answers

Align center a div and align right another div in the same row

I have 3 divs, I want to align "div2" to the center of the page and "div3" at the end while being in the same row. I've been trying some things like the "d-flex justify-content-center" that I'm currently using or making "div1" a row and giving…
Tbko
  • 13
  • 5
1
vote
3 answers

How to change the default accordion svg icon on bootstrap 5

I would like to change the default bootstrap icon for accordions Instead of the default arrow icon, I would like to use the and the bootstrap icons. One icon when accordion it's…
Cheknov
  • 1,892
  • 6
  • 28
  • 55
1
vote
0 answers

Why does my modal only work in the first dynamically generated accordion, but not for any of the others?

I'm fairly new to using TypeScript, React and Bootstrap modals in general, however I'm pretty confident that I have avoided the most common mistakes like using the same id and data-bs-target in multiple places. Basically I have a dynamic list of…
malthe.w
  • 77
  • 10
1
vote
1 answer

How to extend bootstrap utilities classes in Nextjs Typescript project

I have installed sass in next js and bootstrap, I can now access bootstrap variables and can reasign values of variables however when I try to extend a utility class from bootstrap it gives me error : SassError: The target selector was not…
Sadaf Sid
  • 1,510
  • 3
  • 17
  • 30
1
vote
3 answers

How to select all and cancel in table?

I used this page to create this code https://getbootstrap.com/docs/5.0/forms/checks-radios/#indeterminate When I click the checkbox with id=(flexCheckIndeterminate), all the checkboxes below it will be selected, and click it again, all the…
Safaa
  • 33
  • 3
1
vote
3 answers

Drawing a line between a logo and text

I am using bootstrap 5 and I need to draw a thin line after the logo.png below. There should be no spaces between the line and logo and still no spaces between the text and line.
Baba
  • 2,059
  • 8
  • 48
  • 81
1
vote
1 answer

Why does my Bootstrap carousel only move once?

I'm trying to implement a Bootstrap Carousel into my website however I am having an issue with it where it will only move once and will become unresponsive. I've checked the ordering of the files and that doesn't seem to be an issue. So this has…
HJP
  • 47
  • 4
1
vote
1 answer

Why is this bootstrap drop down not working?

I know there are a lot of other similar questions and I have tried most of them, but nothing seems to work. It just does not expand to show the dropdown items. I have included this in the head
user14583977
  • 73
  • 1
  • 6
1
vote
1 answer

Why are my react-router Links not working when put inside a Bootstrap 5 dropdown navbar button?

I literally copy-pasted the navbar from the Bootstrap page and changed "class" for "className" in each case because I'm working in React. Then I just put the inside the item, but even if I replace the with the it doesn't work…