Questions tagged [bootstrap-4]

Bootstrap 4 is the fourth major version of the popular front-end component library. The Bootstrap framework aids in the creation of responsive, mobile-first websites and web apps.

Bootstrap 4 is the fourth major version of the popular front-end component library and open-source toolkit for developing with HTML, CSS, and JS. The Bootstrap framework aids in the creation of responsive, mobile-first websites and web apps. Bootstrap 4 embraces flexbox and Sass technologies. Bootstrap is open-sourced on GitHub.

The latest release of bootstrap-4 is 4.6.1.

There are newer versions at getbootstrap.com

Stack Snippet Starter Pack

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF" crossorigin="anonymous"></script>

Helpful Resources

28801 questions
4
votes
2 answers

Bootstrap 4.0 "Modal" not working with Angular 4

Having trouble getting a Bootstrap 4.0 modal to work within an Angular 4 project. The modal works great inside a simple static HTML page: https://jsfiddle.net/Lq73nfkx/1/
4
votes
1 answer

Bootstrap makes margin to ul

I am wondering why Bootstrap adds an "margin" to my ul. Without: With:
user8040474
4
votes
2 answers

Blockquote class doesn't show lines in Bootstrap 4 Beta 3

I have two simple blockquote HTML elements. I added Bootstrap blackquote class and expected bigger font with lines. However, the fonts become bigger but the lines don't appear at all. HTML section where I use the blockquote elements.
4
votes
1 answer

TS2339: Property 'selectpicker' does not exist on type 'JQuery'

I'm using the bootstrap-select I have successfully imported bootstrap-select into my project using:
Mike Walker
  • 2,944
  • 8
  • 30
  • 62
4
votes
1 answer

Targeting a bootstrap 4 tab panel from another page

I want to open a tab panel on say a service.html page when i click a link on my index page. I'm working with bootstrap nav-pills and here's part of what I have tried already which didn't work. service.html
4
votes
2 answers

X-Editable in Bootstrap 4 modal not clickable

I have a modal in a Bootstrap 4 design that has two XEditable text field on it. If I set the XEditable option to inline, it works fine (thought the table gets pushed aside, but I guess that's just a CSS fix). However, if it is set to popup, which I…
Robert Benedetto
  • 1,590
  • 2
  • 29
  • 52
4
votes
3 answers

bootstrap not working within my create-react-app

I am trying to render my React component using traditional bootstrap instead of react-bootstrap. I'm not sure what I'm doing wrong here. I've installed bootstrap via npm, used the cdn links as well along with the scripts. I feel like I've tried…
Thunder54
  • 55
  • 2
  • 10
4
votes
1 answer

When using slick slider and have slide with row which have 2 divs it becomes column with 2 divs. Bootstrap 4

I need to make slider which have slide with row which have 2 divs in it. But when I try to use slick slider this row becomes column. Using Bootstrap 4 and flexbox. My HTML:
Belial
  • 668
  • 2
  • 8
  • 27
4
votes
1 answer

Column auto width based on content in tables

Can I use col-{breakpoint}-auto in tables (or something simmilar)? Using the col-{breakpoint}-auto classes, columns can size itself based on the natural width of its content.
jjack
  • 136
  • 1
  • 1
  • 7
4
votes
1 answer

Bootstrap 4.0. Buttons don't work with another DIV

It's my first time to ask a question on StackOverflow: I have a little problem with my website, when the bumping arrow is at the bottom of the site I cannot click on buttons. Whatever it is, this Bootstrap button or HTML button, it doesn't work. I…
4
votes
1 answer

Bootstrap text align in label tag

Hi i was trying to align the text on left inside the a label tag but I'm not able to do it right . See below sample code and output
4
votes
1 answer

How do you use a Bootswatch theme in Angular 5

I am trying to use a Bootswatch theme in an Angular 5 project. I am using both Bootswatch and Bootstrap versions 4.0.0-beta-2. I have installed both via npm and have imported the _variables.scss and _bootswatch.scss in my styles.scss using the…
user3174133
  • 181
  • 1
  • 2
  • 8
4
votes
1 answer

Card-columns Embed Tweet : Difference Between Chrome and other browsers

I use Boostrap 4 card-columns to share tweet on my website. I noticed a difference between Chrome and others browsers. In fact, Chrome lost some informations in second and third columns. You can see that in captures. Could you help me ? Sorry for my…
Romain
  • 85
  • 9
4
votes
2 answers

Ngx-Bootstrap popover not setting correct height or width

I am trying to use ngx-bootstrap in my Ionic 2 / Angular 2 app and for some reason the popover is not displaying correctly in my view:
4
votes
4 answers

Bootstrap 4 Accordion Toggle All

I am trying to toggle the state of all accordion items by clicking a button. By default I want them all to be closed. The button should either Open All or Close All. According to the docs I should be able to use the toggle() method? I have included…
TheOrdinaryGeek
  • 2,273
  • 5
  • 21
  • 47
1 2 3
99
100