6,419 questions
-1
votes
2
answers
60
views
The dropdown menu is not expanding. CSS and JS are connected correctly [closed]
I am a beginner in web development. I need some help. The dropdown menu is not expanding. CSS and JS are connected correctly. What could be the reason?
I checked the CSS/JS classes and connected files....
-3
votes
0
answers
22
views
How to change "Choose File" and "No file is chosen" [duplicate]
I need to change two text in the input, the project uses bootstrap 5, I also need to save all bootstrap styles when changing the texts, how can this be done (I found how to change the choose file, but ...
0
votes
0
answers
21
views
JavaScript Weather Widget is being invoked twice despite seeing only one function call in the console
My JavaScript Weather Widget is fetching live weather warnings via the Met Office website's RSS feed. The problem is that the warnings display twice on the page, so I think there must be duplicate ...
1
vote
1
answer
32
views
How to prevent scroll move when multiple Bootstrap modal is opened
Modal1 is long enough to traverse the screen.
If I scroll Modal1 down and show Modal2, Modal1's scroll will unintentionally move to the top.
After that, if Modal2 is shown, the scroll of Modal1 will ...
0
votes
0
answers
42
views
ASP.NET adding style for attributes himself
_Layout.cshtml contains elements that have the same classes applied, but ASP generates an additional attribute and defines additional styles for this attribute, while it does not do this for another ...
0
votes
0
answers
19
views
Open multiple Bootstrap Toasts instead of overriding the same Instance
I am trying to call multiple instances of a bootstrap toast in Vue3. When I call a new Instance the old one gets overwritten but I want the old one to stay. I saw some libraries with this ...
-3
votes
0
answers
21
views
how to create pop up dialog box in website
I want to create a pop up dialog box while opening the website
give me the code for creating the responsive pop-up dialog box which is responsive as well as error free and we have to dispaly in all ...
0
votes
2
answers
69
views
bootstrap 5.3.3 can `data-bs-toggle` toggle `button` and `collapse` together?
Is it possible to toggle button and collapse together?
Button 1 toggles the text
Button 2 toggles the button (active/inactive)
Button 3 shall toggle both together
<link href="https://cdn....
0
votes
0
answers
15
views
bootstrap 5.3.3 input group range height (form-control collides with form-range)
the range height is wrong, I need some text to describe that its best to see the snippet...
How to fix that?
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min....
0
votes
1
answer
41
views
Notifications "action" button position
I try to create a vue/bootstrap notifications component with action buttons.
Thats my current result, no matter what i do, the buttons are part of the notification body itself:
Instead of that, i ...
0
votes
1
answer
23
views
Cannot understand how to get my grid layout working properly with BS5
I am stuck. This is almost what I want but not completely. Below is the currently layout but it needs fixing:
This is the bootstrap5 html:
<div class="container">
<div class=&...
-3
votes
0
answers
74
views
Laravel responsive admin dashboard with sidebar navigation using Bootstrap [closed]
I am using HTML, CSS, Bootstrap and want to create a dashboard with a sidebar navigation in my web app.
Using bootstrap classes but it is not as expected, so please tell me what I should I do now?? ...
0
votes
1
answer
41
views
User icon moves with the menu in a Bootstrap 5 navigation bar
Question:
I'm using Bootstrap 5 to create a sticky navigation bar at the top of a Django project. When the navigation menu expands on smaller screens (via the toggle button), the user icon (fa-user) ...
-2
votes
0
answers
42
views
How can I align my bootstrap carousel with the rest of the content on the page?
can someone help me understand why my carousel is still displaying on the left side as opposed to properly align with the rest of the content on the page. Please ping me if anyone can help, I did ...
1
vote
0
answers
23
views
bootstrap navigation toggle not working with react
I am using react-bootstrap version 5.3.3. Below is a code I wrote in an attempt to build the navigation for my react app. For some reason, the navbar toggler button appears but does not seem to be ...
0
votes
0
answers
24
views
In ASP.NET MVC cshtml view with Data Tables Net Bootstrap 5 horizontal scroll headers not aligning with columns
I am using the Bootstrap 5 version of DataTables.Net. The table is set to responsive.
What is happening: when the page loads, the column headers are to the left and aren't aligning with the ...
0
votes
1
answer
50
views
Responsive Static Bars Top/Bottom [closed]
I am having a simple problem with getting the bars to be both static and responsive on resizing. I am using bootstrap 5. I would like them to stay within the Orange box and to have them at the top and ...
1
vote
1
answer
28
views
Why is my custom CSS not being applied to a progress bar in my JSP page?
I have a JSP page where I'm trying to implement a progress bar to display the order status (e.g., "Pending", "Confirmed", "Shipping", "Delivered"). However, my ...
0
votes
0
answers
30
views
Bootstrap Selectpicker Not Displaying old() Value in Laravel Form
I am using Laravel's Form::select along with Bootstrap's selectpicker in my form. My dropdown is supposed to display the old value (retrieved using old() function) after form validation fails. However,...
0
votes
0
answers
30
views
Navbar Toggler Icon is invisible using Reactstrap
I am trying to incorporate the "hamburger" icon for the drop down menu in my React website. I though it came already attached to NavbarToggler with reactstrap/bootstrap install. The icon is ...
0
votes
1
answer
35
views
Trouble customizing walker_nav_menu for BS5 navbar
I have tumbled around in the rabbit hole, try'd different solutions for my BS5 main navbar with a WordPress Theme.
Have build a extended walker_nav_menu class for wp_nav_menu(), where playing around ...
1
vote
0
answers
23
views
How can I use jQuery on Bootstrap navbar to scroll into section on another page? [duplicate]
I have a website which uses Bootstrap navbar and jQuery to scroll between a few sections (in index1.html).
Now I added another page to the website (index2.html), but if i use jQuery smooth scroll
the ...
0
votes
1
answer
90
views
How do I use Bootstrap 5.3.3 css and have the buttons back to their original colours with glyphicons?
I have been using Dropzone.js for a few years and have an app that has been working well. There are three buttons that are used.
<span class="btn btn-success fileinput-button">
<...
0
votes
0
answers
22
views
Bootstrap navbar looks weird when I place my image last
I want the button and the image to be side by side, and have the list of links below them when I click the button.
This is the before and after when I click the toggle button:
before clicking the ...
1
vote
4
answers
112
views
How to make the entire checkbox module clickable in Bootstrap 5
I'm trying from a long time to make the whole module clickable, not only the checkbox or the label.
If you search on stackoverflow about this you can find the question
How to Make Entire Custom ...
0
votes
1
answer
80
views
How to set Dark theme in Blazor project
How to set dark theme as default in Blazor project. Not toggle thing just when u enter the application there's already dark theme.
I went through some of the files like app.css from wwwroot and ...
-3
votes
0
answers
28
views
My Customize Bootstrap 5.3 - Problem Login Page NOT Center
I want to use customized Bootstrap 5.3 for my project using the saas files. .
Reason for use , I want to minimize Size of Bootstrap.
After compile using 'source.scss' , I found customized saas files ...
0
votes
0
answers
48
views
Why is my boostrap button stretching down when clicked on?
I have a bootstrap login page component that I am using for a react project. However, I have noticed that whenever I click on the login button, it stretches all the way down and I am not sure why it ...
0
votes
1
answer
64
views
Svelte5 and Bootstrap5
I have recently been getting into Svelte and really like it. It's my first framework with the binding stuff, and I have been enjoying just working on some personal projects with it.
However, I am ...
-1
votes
0
answers
22
views
How do vertically align text in Bootstrap card? [duplicate]
I have a set/series of Bootstrap cards where each card has an image and then body text. Each of my images are different dimensions, so I set them to have a max-height of 100px. However, I'm trying to ...
0
votes
0
answers
30
views
Conflict between webpack OptimizePlugin and bootstrap 5 components (tooltip, tab)
I try to set up webpack configuration with separate downloads for modern and legacy browsers according to this principle
<script src="modern.main.js" type="module"></...
0
votes
0
answers
22
views
_reboot.scss overwrites in ASP.NET Core MVC
Whenever I put a <p> tag in the HTML it has a margin which is I think it is the default margin of it. I am expecting that the tag has a zero padding and margin because the bootstrap implemented ...
0
votes
1
answer
26
views
Bootstrap spinner in button doesn't work when button text is dynamic
Various forms are loaded into a modal and the data that is saved uses the button text ('save' insert new record, 'update' update existing record...) In the snippet below there are two buttons - '...
0
votes
0
answers
43
views
Bootstrap selectpicker icon to change dynamically
I successfully changed the icon of boostrap selectpicker in the css file using:
.status.bootstrap-select .dropdown-toggle::after {
border: none;
font: normal normal normal 14px/1;
font-style: ...
0
votes
1
answer
45
views
.NET MAUI Hybrid Blazor with Bootstrap - Accordian doesn't work
I'm using .NET MAUI Hybrid and using the Bootstrap that came with the setup (version 5.1) but I also noticed that there is no javascript element that is associated with it. I'm using the CSS classes ...
0
votes
0
answers
29
views
Hamburger span lines not the same thickness on different devices
I am creating a bootstrap 5 website and am adding an animated nav toggler #02 from this link
CSS for the hamburger line height:
.btnMenu02 > span > span, .btnMenu02 > span::before, ....
0
votes
2
answers
33
views
Bootstrap responsive doesn't work and not recognized in devtools
I'm working on a project with Laravel Mix, Vue.js and Bootstrap 5.3
About laravel mix:
const mix = require("laravel-mix");
const path = require('path');
require("mix-env-file");
...
0
votes
0
answers
28
views
Bootstrap and custom styles are not applied to views, but work fine on `index.html`
I'm working on a project where I'm using Bootstrap 5 installed via npm and custom SCSS styles. My index.html works perfectly, applying all Bootstrap and custom styles (header, footer, etc.), but when ...
0
votes
1
answer
23
views
Bootstrap Bundle File Does Not Go Automatically After Publish
In my ASP.NET MVC project, I switched from Bootstrap 3 to Bootstrap 5. During this process, I used Bootstrap's bootstrap.bundle.min.js file.
After all the improvements, I realized that this bundle ...
0
votes
0
answers
23
views
Bootstrap div inside column does not fill up without border [duplicate]
i am trying to place a div inside a col, but the div does not fill the entire col unless i place a border on the div.
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap....
-1
votes
0
answers
23
views
What value to assign to a bootstrap v5.3 'form-check-input' for it to show checked?
Explaination
Tools: Bootstrap v5.3.3, VS2022, C# Razor Pages, MSSQL Server
I am using some form-check-input to show which services are enabled, with data retrieved from the MSSQL Server database.
If a ...
-1
votes
1
answer
39
views
Resizing animated nav toggler
I am creating an animated html, css and jacavaript nav toggler for a therapy website which I have finally got working on all devices-but I am having trouble making it smaller without affecting the ...
0
votes
0
answers
50
views
How to remove the null value of a selectpicker or display the menu entirely?
My selectpicker can contain a number of values depending on certain parameters. You can also search the selectpicker using the data-live-search="true" attribute. I have a problem: when there ...
0
votes
0
answers
45
views
Bootstrap Carousel won't transition in Blazor component
I have a Blazor component with a bootstrap carousel with data-bs-ride="carousel". The carousel loads but does not transition, nor does the carousel respond to button click events. According ...
1
vote
0
answers
131
views
Compiling Bootstrap v5.3.3 with Dart Sass results in deprecation warnings
It seems that the Bootstrap team has switched from "Node.js" to "Dart Sass" for its compilation. But I get a lot of deprecation warnings using Dart Sass.
When compiling the ...
0
votes
1
answer
29
views
React Bootstrap modal inside map function eliminates background and appears twice
I am using a map function to create a list with fetched data. I want to make one cell a clickable button that makes modal appear with the text from the object's "about" property inside that ...
1
vote
1
answer
31
views
How to open dropdown from separate button in stackoverflow code snippet
Running code snippet using "Run code snippet" button and clicking "Open menu" button does nothing. It should open menu.
Menu is defined in other place in DOM and display is set to ...
0
votes
2
answers
80
views
Bootstrap form validation inside a table with big checkbox not working
I use bootstrap 5.3.3 and have this structure
see css used to create a big checkbox.
.form-check-input[type=checkbox].big-checkbox {
transform: scale(3);
margin: 1.5rem;
border-radius: 0;
}
...
0
votes
2
answers
76
views
How to open dropdown menu from outside button
Opening bootstrap dropdown menu from button inside table using
function xonclick() {
const dropdownButton = document.getElementById('settingsDropDown');
const dropdownMenu = document....
0
votes
0
answers
54
views
How to style components in the Blazor Bootstrap Component library
I've started to use the Blazor Bootstrap Component Library but I'm having trouble overwriting the default css styles being applied.
For example I'm trying to use an accordion
<Accordion Class=&...