Category "bootstrap-4"

Close Bootstrap Card Container

I have a card container in my code. I have added a 'close' button that I want to close the card when I click it. I am unsure how to make this work and I've been

need help centering bootstrap carousel image

I am having trouble making the image centered in the slider. Please see my carousel here https://wordpress-website-headless-v2-c9jivybjd.vercel.app/ it is creat

Can I use React Bootstrap with Next.js?

Does anyone know if you can use react-bootstrap with Next.js? I am using the latest versions of both, I can provide code at this point, but right now my app is

Bootstrap 4 - Reboot.scss overriding Global.scss

I am using Sage Starter Theme and I am adding some CSS to style the links globally in the _global.scss file. Some of the CSS properties are being overridden by

Bootstrap 4 - how to make image go to right hand side?

I am trying to put a simple image in a row and make it to to the right side of the page. If I wanted to do this with text, I would simply do this: <div clas=

How to use "invalid-feedback" class with selectpicker from Bootstrap-Select?

I'm using Bootstrap to do some form validation on my web app. With a normal select menu, it would be really easy to have an error message pop-up when the field

Can't load popper.js with webpack and Laravel mix

I'm using bootstrap 4 beta and Laravel 5.4 on my project and loading my js dependencies with npm and laravel mix. So far everything has been working great, exce

How to place a circle inside a square box in css?

I have a webpage made in HTML and CSS in which I want to put a circle inside a square box. Here is the fiddle for the webpage. At this moment, I am able to ma

Bootstrap 4 invalid feedback with input group not displaying

I have been looking into Bootstrap 4 - beta, however when using .is-invalid with .input-group it doesn't seem to show up. <link href="https://maxcdn.boo

How to tell if navbar is collapsed or not?

I have a navbar: <nav id="navbar" class="navbar fixed-top navbar-expand-md navbar-light bg-light"> <a class="navbar-brand" href="#"></a> &

Datatable column width issue after "refresh" row data

I'm currently using datatable to produce table below: I'm happy with the result as the width of each column is calculated automatically, resulting 1 line per

how to change the border colour of ng-select component to red?

The select component in my angular html template is displaying fine. However I want to display this component with a red border, currently it is displayed in gr

Bootstrap modal focus trap behaving differently on BS documentation page

I'm using Bootstrap modal and it doesn't seem to trap focus inside the modal. However, when tested on Bootstrap webpage https://getbootstrap.com/docs/4.1/compon

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