Category "bootstrap-4"

How to setup global bootstrap via scss in Svelte?

I want to use Bootstrap (v4.5) in a Svelte (v3) project with custom theme. The bootstrap documentation states that you can do this with scss. So I've setup Svel

Bootstrap, container-fluid class can't change the padding

I follow some tutorial, and I can't get the correct result, because the padding doesn't work. When I write padding: 3% 15%; then the top and bottom padding is a

Why Highlight Menu Item Doesn't Work in ASP.NET MVC?

Why Highlight Menu Item Doesn't Work in ASP.NET MVC? I am testing the method for highlighting the selected menu item in a MVC program. The test environment incl

Add "all" option to select filter component in bootstrap-table in embedded javascript

I have a data-table where we're using Bootstrap 4 and bootstrap-table. I've added the bootstrap-table plugin Filter Control so that I may have some options for

Collapse/expand targeted section bootstrap not working

My goal is to toggle a specific section to expand or collapse a list of numbers. I am using Bootstrap for a toggle button to control this section, but it isn't

Bootstrap collapse all accordions on button click

Is there a way to collapse/expand all accordions with a button click? I tried it with a simple button that removeClass active and addClass active but it did not

How to break a list in multiple columns with Bootstrap 4?

With Bootstrap 4, how can I have something like this: [ 1 ] [ 4 ] [ 2 ] [ 5 ] [ 3 ] [ 6 ] In other words, how to break a list into two equal columns, orderin

button is not aligned with other component in bootstrap

How to align the button along with other component. means button should be on same line. it is above other components. <div className="row mb-12">

Remove border color for navbar-toggler Hamburger icon in Bootstrap using CSS

I've been stuck in this for a long time. Searched and tried many ways to remove the border color for the BS4 hamburger icon when clicked on it (in my local, it

How to handle bootstrap tooltip with zoom out code?

I have used zoom out(Scaling) code for increasing the area of my template. And I have used tooltips on button but due to zoom css code, the tooltip is misplace

Force Bootstrap dropdown menu to always display at the bottom and allow it go offscreen

When there is no room at the bottom of the viewport to fit dropdown menu, it is displayed at the top of its dropdown button. Is it possible alter this behavior

Force Bootstrap dropdown menu to always display at the bottom and allow it go offscreen

When there is no room at the bottom of the viewport to fit dropdown menu, it is displayed at the top of its dropdown button. Is it possible alter this behavior

bootstrap datepicker not working in django

i am trying to integrate bootstrap datepicker but its not working setting.py: INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contri

How do I get rid of the white spaces on both sides of an image?

I'm trying to get rid of the empty space around an image, which is inside of a bootstrap column. I've managed to fix the problem on desktop using -1rem on the

Why is my CSS is not working for all my EJS loops?

I have a forEach loop that loops through my seeded Mongo database. Everything is working as it should, except one of my CSS functions that come from a jQuery fi

ngx-Bootstrap 4 dropdown and navbar not working with Angular 7

I am trying to add Bootstrap 4 to Angular 7, I see the styles are overridden by bootstrap styles, but navigation bar and dropdown box is not working. I followe

Deprecation Warning in Bootstrap SCSS

I am trying to create custom bootstrap by importing only the required components into a style.scss file from bootstrap sass. However, I get a chain of many Depr

Creating block buttons using Bootstrap in ReactJS

I want to create simple block buttons, that span the entire div. I am using react-bootstrap package to do this in React. Here is the code I am using:- <Conta

laravel - Display validation error in the proper tab

I am using the bootstrap tab to navigate between three different tabs for a user. First tab(primary tab) is to display user details and second tab is to edit th

CSS Show border after heading

I want a heading like shown in the picture . Currently I have 3 flex columns: <section id="section1" class="py-5"> <div class="container">