6,480 questions
-3
votes
0
answers
23
views
Why is my web display not full when I add aos js? (bootstrap5) [closed]
I'm a junior web developer and I want to create a portfolio website using Bootstrap 5. When it's finalized, I want to add animations using AOS JS. However, when I add these, the website doesn't ...
0
votes
0
answers
38
views
ASP.NET QuickGrid: Style clash between QuickGrid default theme and bootstrap table
Repro:
Create the default Visual Studio Blazor Server Template with sample pages.
Add a nuget reference to Microsoft.AspNetCore.Components.QuickGrid (10.0.0)
Replace the weather page with a similar ...
- 173k
1
vote
3
answers
123
views
`Conflicting assets with the same target path` with `bootstrap-table`
I've updated my developer tools in Windows 11 to use the updated .NET 9/10 of November 2025 update. I have not updated my projects to .NET 10, so the projects are running in .NET 9. I have one ...
- 1,601
1
vote
1
answer
55
views
Building sass with gulp - includePaths not having any effect
I am attempting to build a sass file that imports bootstrap from the node_modules folder.
I have added the bootstrap source folder to the includePath list.
But for some reason, the gulp compiler is ...
- 45.5k
2
votes
1
answer
51
views
How can I change the background color of an active link in a Bootstrap dropdown menu?
I am desperately trying to change the background color of the Bootstrap 5.3 dropdown menu whose link is active.
When I am on a page, the menu link for that page appears in bold, but when that page is ...
- 23
4
votes
1
answer
84
views
Dropdown Menu for Login is Going Behind Navigation Bar and Creating Horizontal Scrolling in HTML/CSS
I am working on a navigation bar with a login dropdown menu, but I’m facing an issue where the dropdown menu appears behind the navigation bar when I hover over it. Additionally, this issue is causing ...
0
votes
1
answer
58
views
Extra space on the right hand of bootstrap header
I have this little issue but I can't figure out what it is, could someone take a look and enlighten me - basically, I'm building a website with bootstrap and can't figure out why do I have this little ...
- 11
1
vote
1
answer
99
views
Bootstrap modal hides when it loses focus to main page
When my Boostrap Modal is displayed and it loses focus by the user clicking off the modal and onto the main page, the Modal is hidden. How can I stop this?
on('hidden.bs.modal') gets triggered after ...
- 1,483
1236
votes
34
answers
2.3m
views
Center a column using Twitter Bootstrap
How do I center a div of one column size within the container (12 columns) in Twitter Bootstrap 3?
.centered {
background-color: red;
}
<!-- Latest compiled and minified CSS -->
<link ...
- 59k
0
votes
1
answer
130
views
JS Textarea validation
I am creating a contact form and validating using javascript event listener. The invalid event listener is working for the input elements from the deafult required class added to the input fields. ...
- 9
1
vote
1
answer
191
views
How to open and close the Bootstrap 5.3 navbar burger menu on mouseover via CSS?
For days, I've been trying to configure the opening and closing of my navbar created with Bootstrap 5.3, when it is reduced to a burger menu, via hover rather than click.
I've managed to do this in ...
- 23
1
vote
2
answers
91
views
Mixin Angular 19
I don't know what this error means. It's the first time it appears to me... I'm using angular ^19.2.0 (non-standalone) with bootstrap ^5.3.8.
> X [ERROR] Undefined mixin.
╷ 15 │ ┌ @include ...
489
votes
24
answers
905k
views
Bootstrap align navbar items to the right
How do I align a navbar item to right?
I want to have the login and register to the right.
But everything I try does not seem to work.
This is what I have tried so far:
<div> around the <ul&...
- 6,888
1
vote
1
answer
122
views
How to dynamically override all Bootstrap 5 primary/secondary colors at runtime in Angular without rebuilding SCSS?
I’m building an Angular 19 application that loads its primary and secondary brand colors from a backend API at runtime.
I want all Bootstrap 5 components (.btn-primary, .bg-primary, .alert-primary, ....
-1
votes
2
answers
67
views
Using bootstrap to center 1 div and place another one next to it [duplicate]
I'm trying to use Bootstrap's d-flex in a slightly different way than in this example:
My aim is to have the "Content" box and the "Justify" box being shown, but not the "...
- 8,252
748
votes
12
answers
1.3m
views
Change navbar color in Twitter Bootstrap
How would I go about modifying the CSS to change the color of the navbar in Twitter Bootstrap?
- 9,511
2
votes
1
answer
94
views
Why does ngbDate picker Month & Date selection not come in Angular version 20?
I'm using Angular version 20. Month and year selection are missing. I have tried more methods, however I am still facing issues.
Imports:
CommonModule, FormsModule, ReactiveFormsModule, ...
- 11
0
votes
1
answer
114
views
Cannot use CSS variables (var(--bs-primaryColor)) as $primary in Bootstrap SCSS – throws “is not a color” error #41746
We are trying to use dynamic colors coming from our backend to replace Bootstrap’s primary and secondary colors at runtime. Our approach is to map Bootstrap’s $primary and $secondary SCSS variables to ...
3
votes
1
answer
110
views
How to get rid of artifacts displayed when a table with a sticky header is scrolled?
Using Bootstrap 5, I wrote an HTML table with a scrollable content and a "sticky" header. I also used Bootstrap CSS classes to stylize the table.
The snippet below shows a minimal example:
...
- 6,636
2
votes
2
answers
116
views
Bootstrap 5 and Masonry cards overlap when printing
I'm trying to get Bootstrap to work with Masonry. On the screen, everything looks pretty good. It is responsive and works like a charm.
However, when I print it (or even the preview), the cards ...
- 679
0
votes
2
answers
80
views
Using Bootstrap5 Dropdowns within Fullcalendar on Events
I'm using Fullcalendar to display schedules of people/volunteers for events.
For any given shift, there are multiple options, e.g. delete or duplicate.
I want to utilize bootstrap's dropdown menu to ...
- 384
140
votes
15
answers
295k
views
Bootstrap 5 navbar align items right
How do you align Bootstrap 5 navbar items to the right? In Bootstrap 3 it's navbar-right. In Bootstrap 4 it's ml-auto. But not work for Bootstrap 5.
- 1,459
0
votes
0
answers
71
views
Bootstrap 5 100% height with expandable navbar
First of all, I already read this
Bootstrap 100% height with navbar
However, the question mentioned was asked 10+ years ago, and navbars became more smart. Needed exactly the same - excluding the ...
- 33
1
vote
1
answer
110
views
Bootstrap flex container shifts content when inserting SVG
I have a flex container with inline elements. In this example everything is vertically-aligned properly...
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="...
- 55
0
votes
1
answer
112
views
How to fix unsightly gap in rounded element?
I'm using bootstrap, with some limited manual styling where i needed elements to have asymmetrical corners.
There is this gap in a rounded element, between the filter button and the outer div radius. ...
181
votes
8
answers
225k
views
Using Bootstrap 5 with Vue 3
I want to use Bootstrap 5 with Vue 3. As Bootstrap 5 uses vanilla JS (no JQuery), can I use Bootstrap 5 directly in a Vue 3 project (without using Bootstrap-Vue)? Can someone guide me how to use ...
- 1,971
71
votes
16
answers
111k
views
Bootstrap 5 - Uncaught TypeError: Popper__namespace.createPopper is not a function
I am using Django to serve web pages.
I am trying to make sure I am able to download all the resources necessary to make the webpage function as intended for offline use (as in one of those resources ...
- 2,381
1
vote
3
answers
107
views
How to load darkmode.js file dynamically?
I have a toggle button inside src/app/user-list/user-list.html, namely:
<div class="btn-group">
<button class="btn btn-secondary btn-sm"
type="...
- 107
1
vote
1
answer
172
views
Bootstrap components stop working in Rails app when any links clicked
In my rails 8 app I followed the Bootstrap Getting Started instructions to pull in bootstrap version 5.3.7 via the link tag:
I put the following in the head tag of application.html.erb:
<link href=...
- 4,740
2
votes
2
answers
129
views
NavBar not displaying correctly
I am having trouble getting Bootstrap to render elements on my site the way they appear on Bootstrap's site. I am trying to implement a navbar that contains links to my other pages from my index page. ...
80
votes
10
answers
181k
views
How to create scrollable element in Tailwind without a scrollbar
I'm trying to recreate a horizontal scroll navbar with tailwind without a scrollbar on the bottom like this example (reduce the width of your screen to be able to scroll)
https://getbootstrap.com/docs/...
- 2,978
0
votes
1
answer
52
views
give space between columns
i dont know how to give spaces between columns, i tried to use gx-* but it doesnt work and it causes horizontal scroll which make it even worse, gap-* works but it misses with the layout and causes ...
- 139
0
votes
1
answer
109
views
Bootstrap carousel with vertical thumbnails on the left
How can the div, containing the thumbnails be moved to the left of the carousel like it this picture?
I tried already wrapping it into a <div class="d-flex">but that messes up the ...
- 3,873
0
votes
2
answers
116
views
Bootstrap DataTables Arabic Search Not Working (English Search Works Fine) [closed]
I'm currently using Bootstrap DataTables on the front end with JavaScript and AJAX to fetch data from a Spring Boot backend.
The table loads correctly and searching in English works as expected. ...
2
votes
1
answer
167
views
Angular - bootstrap carousel - How to bind active item
How to achieve this :
When I click on right arrow of the carousel, I want to trigger a method with the item index as parameter.
Some thing like <button ... (...)="eventHandler(index)" .....
453
votes
8
answers
1.5m
views
Left align and right align within div in Bootstrap
What are some of the common ways to left align some text and right align some other text within a div container in bootstrap?
e.g.
Total cost $42
Above total cost should be left ...
- 13.7k
0
votes
1
answer
134
views
How to customize validation styles on inputs?
I am using Bootstrap 5.3 and styling according to the designer's mockup.
They have the input, upon failed validation, with a thick border to the left, with no border-radius. If I were doing this ...
- 17
1
vote
1
answer
159
views
Accordion not working as expected when placed inside my container
I have created an accordion from w3schools example. It is working as expected when I keep it separate. But when I place it with other inputs it is working as button only. The content of the accordion ...
- 1,284
0
votes
1
answer
262
views
How to properly use Bootstrap 5.3.x in Blazor web app template? (Documentation)
Using Bootstrap Toasts: Live example and implementing it to my Blazor web app template does nothing.
After following the tutorial: Build your first web app with ASP.NET Core using Blazor.
I tried ...
- 1,918
0
votes
1
answer
113
views
How can I add a footer underneath the default MainLayout.razor?
The main problem is that I'm not good at front-end development, so I usually browse to internet, or I ask to AI-chatbot to speed up the layout process, particularly if I have no idea on how to ...
- 1,918
170
votes
17
answers
295k
views
How to hide collapsible Bootstrap navbar on click
I've created this collapsable navbar using Bootstrap 4 that works nicely, but I would like it to close when the user clicks on a link. Any way to do this? Thanks
html navbar:
<nav class="navbar ...
- 2,571
1
vote
2
answers
236
views
Sass @use 'bootstrap/scss/bootstrap' failing with 'Can't find stylesheet to import' in minimal project
I'm encountering a persistent issue where Sass is unable to resolve the import path for Bootstrap, even in a minimal test project. I'm using gulp-sass with Dart Sass.
Here's the problem:
I'm trying to ...
- 870
0
votes
1
answer
175
views
Sometimes the navbar works but sometimes it doesn't
I am building a website using Bootstrap 5, and I made a separate page for the top navbar which I place in the content pages using jQuery.
<!-- Nav bar -->
<div id="navbar"></...
- 571
0
votes
1
answer
55
views
how to change bootstrap 5.3 focus ring to an inset box shadow?
By default, the Bootstrap 5.x "focus ring" is a box shadow that appears on the outside of the field: https://getbootstrap.com/docs/5.3/helpers/focus-ring/
How can it be changed to an inset ...
- 17
42
votes
18
answers
76k
views
Navbar dropdown (collapse) is not working in Bootstrap 5
I am facing an issue when trying to create a responsive menu or dropdown button with Bootstrap 5. Everything seems ok. The navigation icon and dropdown icon appear, but they're not working. When I ...
- 514
244
votes
18
answers
444k
views
How to change Bootstrap navbar collapse breakpoint
Currently when the browser width drops below 768px, the navbar changes to collapsed mode. I want to change this width to 1000px so when the browser is below 1000px the navbar changes to collapsed mode....
- 7,372
347
votes
11
answers
465k
views
Bootstrap dropdown sub menu missing
Bootstrap 3 is still at RC, but I was just trying to implement it. I couldn't figure out how to put a sub menu class. Even there is no class in css and even the new docs don't say anything about it
...
- 7,483
0
votes
3
answers
67
views
dropdown menu item doesn't drop down
I have an ASP.NET Core MVC web application. In _layout.cshtml, I have the following code, but it doesn't drop down in the menu bar it shows "manage" with a down arrow next to it below is the ...
28
votes
5
answers
22k
views
I get error ".form-floating>~label" in ng build
I try to run command "ng build" in my Angular app next i get:
✔ Browser application bundle generation complete.
✔ Copying assets complete.
⠋ Generating index html...4 rules skipped due to ...
- 327
0
votes
1
answer
119
views
How to include latest bootstrap 5 javascript library into a modern GWT application
I know there are some outdate and deprecated / no more supported projects like GWT-Bootstrap (https://github.com/gwtbootstrap/gwt-bootstrap) and gwtbootstrap3 (https://github.com/gwtbootstrap3/...
- 198