Stack Overflow
Stack Overflow

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 do I prevent the span from hiding text when the screen gets smaller?

I am using bootstrap 5 for a form I am making. I have a file input element that looks like this on a computer screen: But when I test it out for a mobile it looks like this: Here's the code:
thisdanguy
  • 13
  • 5
1
vote
2 answers

Custom color theme not working correctly on Bootstrap, React, SCSS project

I'm trying to use custom colors with my bootstrap/react/scss setup. The custom color I'm using is "clear". Strangely using className="btn-clear" on a button component does make the button in the custom color (correct behaviour), but using…
Joseph Fletcher
  • 156
  • 1
  • 9
1
vote
0 answers

ngbootstrap carousel not working as expected

Right now I am working on a basic website where I require a carousel. Tried with bootstrap carousel but found that on clicking prev/next icon, angular router kicks in and navigates to home url (as routed to home component when invalid url…
Nayan J
  • 27
  • 9
1
vote
1 answer

divide page into one section in web design

I'm trying to make a sidebar that collapses when using a phone. But after the first three images the images on the next line start below the sidebar instead of beside it. The top part is ok, but when scrolling down to the other images they don't…
Grim
  • 67
  • 8
1
vote
2 answers

How can I toggle between Bootstrap 5.1.0 modals?

I simply copied the example from Bootstrap 5 docs, but the first modal is not hidden if I open the 2nd modal from within the modal popup. Why? You can see that the backdrop is also a bit darker for the 2nd popup, which is because the 2nd one is…
membersound
  • 81,582
  • 193
  • 585
  • 1,120
1
vote
1 answer

Navbar state - manually change from normal state to collapsed state

I have the following navbar:
1
vote
1 answer

Display Bootstrap Modal for Selected Table Item

I'm trying to create a simple buddy list for a web application. I'm looping through an SQL table to retrieve the current user's buddy list. Each row in the table has a button to display a modal of the selected user's ID. The current issue I'm having…
kdarling
  • 59
  • 2
1
vote
0 answers

How to add Bootstrap 5 padding uniformly across sides?

I am trying to experiment with Bootstrap 5 within React, but somehow fail to understand the padding and margin. Consider the following code: const Breadcrumbs = (props) => { return (
…
Daniel
  • 1,398
  • 4
  • 20
  • 47
1
vote
0 answers

Add bootstrap 5 to angular 12

This is crazy and maybe stupid but this is what is happening I created a new clean Angular12 project ng new proj --strict (I selected scss). I added bootstrap 5 npm install bootstrap I added the following line to styles sections "styles": [ …
Hakan Fıstık
  • 16,800
  • 14
  • 110
  • 131
1
vote
1 answer

Nested bootstrap 5 accordions not collapsing open panels

I have some page content broken up with nested bootstrap accordions. I am using bootstrap 5. The parent accordion is split between continents, with each panel then containing another accordion split between countries. My parent accordion acts as…
Mark Seymour
  • 111
  • 4
  • 16
1
vote
1 answer

Bootstrap nav-tab not conveying visually "active" state correctly

I can click on my tabs and my tab-content displays like I expect, but my "active" nav tab is not displaying properly and I'm not sure how to troubleshoot the issue. See a picture below for reference. My Nav-menu The far left tab is "active" yet the…
Franklin
  • 121
  • 1
  • 2
  • 8
1
vote
4 answers

Remove Border on Bootstrap 5 navigation-toggler using regular css

I am looking to remove the light grey border on the mobile 'hamburger' menu. I am using font-awesome and Bootstrap 5 (drought in through CDN) to create it, but can't seem to remove the rounded border. html
1
vote
0 answers

How do I make collapse sections close when another collapsible element is expanded?

I'm currently having some trouble with creating a collapsible element in bootstrap 5. What I want is other sections to close when a different collapsible element is clicked (similar to an accordion). I want it so that only one section can be opened…
jchillaxin
  • 13
  • 4
1
vote
1 answer

Lazy load Modal Bootstrap in Reactjs

I using Bootstrap 5. In a function component, I have a modal like this: return (
{/* Button trigger modal */}
Nguyễn Tuấn Kiệt
  • 188
  • 2
  • 10
1
vote
0 answers

How can I make a dropdown as a navbar-toggler?

What I'm trying to do is make on my own a webpage with bootstrap. I want to, instead of a navbar-toggler, put a dropdown. I am not fully familiar with JS yet. For this reason, I wanted to do it with only bootstrap. I put a @media to change the…
user16648942
1 2 3
…
99
100