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
0
votes
0
answers
59
views
How to make K2 SmartForms (by Nintex) work with Bootstrap 5 + SASS?
I’m trying to style my K2 SmartForms (by Nintex) using Bootstrap 5 with SASS.
However, SmartForms have their own generated HTML structure and styles that often conflict with Bootstrap’s classes and ...
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
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
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 ...
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
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
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 ...
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
0
votes
0
answers
78
views
ngx-bootstrap bs-daterangepicker-inline jumps back to the first month when selecting across months
I'm using the ngx-bootstrap component in Angular with displayMonths: 2 for desktop and displayMonths: 1 for mobile.
The issue:
I select a date range across two months (e.g., December 28 → January 3).
...
- 53
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, ....
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
-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
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
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
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
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
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
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
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
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. ...
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. ...
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
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. ...
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
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
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)" .....
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 ...
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
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
0
answers
99
views
Why do I get an undefined variable error when overriding a Bootstrap 5 variable in Sass?
We are starting a new project using Next.js and Bootstrap 5, with Sass. We are trying to create a new theme, so we created a theme.scss file:
@import '~bootstrap/scss/functions';
$primary: #005EA2;
$...
- 1
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
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
109
views
Bootstrap 5 date input does not accept paste
We recently upgraded an application from Bootstrap 4 to 5. Since the upgrade, users are unable to paste into <input type="date"... controls.
I scoured the Bootstrap 5.3.x documentation (...
- 25.4k
1
vote
0
answers
81
views
Dropup in a component causes auto-scroll to previously opened dropup
I'm working on a React project where I have a reusable card component that appears multiple times on a single page. Each card has a Bootstrap dropup used to select the file that the user wishes to ...
- 11
0
votes
1
answer
242
views
Angular 20 Can't bind to 'routerLink' since it isn't a known property of 'a'
Although I have used a previous stackoverflow solution, I still get the same error. The other problem is that there is no script in Angular 20 that has @NgModule. Here is the code I have:
navbar.html
...
- 29
1
vote
1
answer
48
views
Sass "Error: Can't find stylesheet to import." when importing bootstrap globally
When using
@import "bootstrap/scss/bootstrap";
in the styles.scss, I get the above error "Error: Can't find stylesheet to import."
Angular file structure:
--src
--app
--...
- 29
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
-3
votes
1
answer
122
views
Logo not aligning with Nav Bar
I'm using Bootstrap for the framework for a simpler workflow. The problem started once I added the logo to the Nav bar for my website. I've tried implementing different functions, but they never ...
1
vote
1
answer
151
views
How to fix bootstrap5 navbar toggle issue in angular 19
I have installed "bootstrap": "^5.3.7" and added below the code in angular.json. But toggle is not working. without adding in the index.html(js and css) How to resolve thiss issue?
...
- 103
1
vote
1
answer
83
views
React Bootstrap Cards are overlapping
I am trying to create a React Bootstrap card view, where all cards should have some space between each other. But my created React Bootstrap cards do not have the expected space between them.
I have ...
- 84
0
votes
1
answer
108
views
Disabling Bootstrap event delegation for specific DOM elements
Environment
Bootstrap version: 5.3.3
Browser: Chrome (latest)
Framework: Vue.js 3 with Phaser 3.87.0
Problem Description
I'm developing a game using Phaser 3 within a Vue.js application that uses ...
- 39
1
vote
1
answer
106
views
Summernote 0.9.1 with Bootstrap 5.3.6 Popover on image and tables is not working
Here is the image of error: Popover show up below the editor Image
The popover on the image (menu) is not showing correctly on this page. I have tried servral options including { dialogsInBody: true }...
- 23
0
votes
0
answers
33
views
Confused by Bootstrap 5 and ASP.NET Core 9 MVC [duplicate]
I am a long time web developer, but new to both .NET 9 and Bootstrap 5. I am trying to upgrade an old website, and installed the nuget for Bootstrap 5.3.6.
In Visual Studio 2022, I see:
This doesn't ...
- 1,423
0
votes
1
answer
77
views
How can I rearrange the sections of a Bootstrap page on mobile?
Given this stripped down example I made in Bootstrap 5: https://codepen.io/krishunt/pen/MYwXWRx
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" ...
- 2,250