Stack Overflow
Stack Overflow

Questions tagged [twitter-bootstrap]

Bootstrap is a frontend framework designed to kick-start development of Web apps and sites. For questions related to a version of Bootstrap also use the specific version's tag from "twitter-bootstrap-2", "twitter-bootstrap-3", "bootstrap-4" and "bootstrap-5" tags.

Bootstrap is a frontend framework designed to kick start the frontend development of web apps and sites. Among other things, it includes base CSS and HTML for typography, icons, forms, buttons, tables, layout grids, and navigation, along with custom-built and support for responsive layouts.

There are four major versions of the framework:

Current version: Bootstrap v5.2.2

It is tested and supported in the major modern browsers, such as the latest versions of Safari, Google Chrome, Firefox, Microsoft Edge.

Starting with version 2.0, the default download package contains cumulative JavaScript and CSS files. If you're looking for the uncompiled LESS source files, documentation and example templates, you can download them from the project's GitHub page. Less was replaced with Sass beginning from version 4.0.

Prior to v3.1.0, it was licensed under the Apache 2 License, but is now under the MIT License due to this issue.

See also

Links

Tools to test bootstrap code

Bootstrap Migration Resources and Tools

The Bootstrap Playground

Yeoman Generator

Meteor Package

meteor add twbs:bootstrap

NPM package

npm i bootstrap

NuGet Package

Install-Package Twitter.Bootstrap

v5.2.2 Stack Snippet Starter Pack

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3" crossorigin="anonymous"></script>

v4.2.1 Stack Snippet Starter Pack

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
102997 questions
1245
votes
43 answers

How to make Twitter Bootstrap menu dropdown on hover rather than click

I'd like to have my Bootstrap menu automatically drop down on hover, rather than having to click the menu title. I'd also like to lose the little arrows next to the menu titles.
falter
  • 13,584
  • 5
  • 22
  • 23
1227
votes
34 answers

Center a column using Twitter Bootstrap

How do I center a div of one column size within the container (12 columns) in Twitter Bootstrap 3? .centered { background-color: red; }
bsr
  • 57,282
  • 86
  • 216
  • 316
1134
votes
34 answers

How can I make Bootstrap columns all the same height?

I'm using Bootstrap. How can I make three columns all the same height? Here is a screenshot of the problem. I would like the blue and red columns to be the same height as the yellow column. Here is the code:
Richard
  • 62,943
  • 126
  • 334
  • 542
965
votes
15 answers

How to open a Bootstrap modal window using jQuery?

I'm using Twitter Bootstrap modal window functionality. When someone clicks submit on my form, I want to show the modal window upon clicking the "submit button" in the form.
user244394
  • 13,168
  • 24
  • 81
  • 138
960
votes
26 answers

vertical-align with Bootstrap 3

I'm using Twitter Bootstrap 3, and I have problems when I want to align vertically two div, for example — JSFiddle link:
corinem
  • 9,755
  • 4
  • 13
  • 7
805
votes
6 answers

What is sr-only in Bootstrap 3?

What is the class sr-only used for? Is it important or can I remove it? Works fine without. Here's my example:
774
votes
22 answers

Text-align class for inside a table

Is there a set of classes in Twitter's Bootstrap framework that aligns text? For example, I have some tables with $ totals that I want aligned to the right... Total and $1,000,000.00
mylesthe.dev
  • 9,565
  • 4
  • 23
  • 34
744
votes
12 answers

Change navbar color in Twitter Bootstrap

How would I go about modifying the CSS to change the color of the navbar in Twitter Bootstrap?
Jamal Khan
  • 9,371
  • 6
  • 23
  • 23
702
votes
66 answers

Bootstrap modal appearing under background

I have used the code for my modal straight from the Bootstrap example, and have included only the bootstrap.js (and not bootstrap-modal.js). However, my modal is appearing underneath the grey fade (backdrop) and is non editable. Here's what it looks…
natlines
  • 7,426
  • 4
  • 17
  • 14
640
votes
25 answers

How to set up fixed width for ?

Simple scheme: A B C D I need to set up a fixed width for . I've tried: tr.something { td { width: 90px; } } Also td.something { width: 90px; } for…
user984621
  • 46,344
  • 73
  • 224
  • 412
614
votes
16 answers

Passing data to a bootstrap modal

I've got a couple of hyperlinks that each have an ID attached. When I click on this link, I want to open a modal ( http://twitter.github.com/bootstrap/javascript.html#modals ), and pass this ID to the modal. I searched on google, but I couldn't find…
Leon Cullens
  • 12,276
  • 10
  • 51
  • 85
613
votes
14 answers

Bootstrap NavBar with left, center or right aligned items

In Bootstrap, what is the most platform-friendly way to create a navigation bar that has Logo A on the left, menu items in the center, and Logo B on the right? Here is what I've tried so far, and it ends up being aligned so that Logo A is on the…
Aliv
  • 6,155
  • 3
  • 12
  • 6
609
votes
26 answers

Twitter Bootstrap Form File Element Upload Button

Why isn't there a fancy file element upload button for twitter bootstrap? It would be sweet if the blue primary button was implemented for the upload button. Is it even possible to finesse the upload button using CSS? (seems like a native browser…
somejkuser
  • 8,856
  • 20
  • 64
  • 130
603
votes
12 answers

Bind a function to Twitter Bootstrap Modal Close

I am using the Twitter Bootstrap lib on a new project and I want for part of the page to refresh and retrieve the latest json data on modal close. I dont see this anywhere in the documentation can someone point it out to me or suggest a…
BillPull
  • 6,853
  • 15
  • 60
  • 99
595
votes
10 answers

What is the difference among col-lg-*, col-md-* and col-sm-* in Bootstrap?

What is the difference among col-lg-* , col-md-* and col-sm-* in Twitter Bootstrap?
StreetCoder
  • 9,871
  • 9
  • 44
  • 62
1
2 3
…
99 100