Stack Overflow
Stack Overflow

Questions tagged [twitter-bootstrap-5]

For questions related to Twitter Bootstrap 5. Use the more generic [twitter-bootstrap] tag if the issue does not pertain specifically to this version.

Twitter Bootstrap is an open-source HTML, CSS, and Javascript web framework.

Use this tag for questions related specifically to Bootstrap version 5. Use if it does not specifically pertain to this version.

More information can be found in these two websites:

25 questions
3
votes
1 answer

Using Bootstrap 5 to create custom tooltips

I am using Bootstrap 5 and am attempting to create a custom tooltip. I see the markup used in the Bootstrap 5 documentation here. Bootstap 5 Tooltips Markup I gathered (and looked online) that the tooltips are not in the calling element and are…
cdub
  • 21,144
  • 49
  • 157
  • 274
2
votes
1 answer

Animating Bootstrap 5 dropdown

I am attempting to animate a right-aligned Bootstrap dropdown with CSS and am not able to get it working. I thought by setting the transition property to apply to the element's width property it would work, but it does not. I can see the width of…
miken32
  • 35,483
  • 13
  • 81
  • 108
2
votes
0 answers

How to auto dismiss a Bootstrap 5 alert without jQuery

Now that Bootstrap 5 has removed jQuery as a dependency, I was trying to find a way to automatically dismiss an Alert after a specified amount of time has passed with just raw Javascript. Below is a snippet of what I've come up with so far.…
BassGod
  • 21
  • 3
1
vote
1 answer

Bootstrap 5 offcanvas is not working with images or icons inside the anchor

You might see it as a duplicate but let me assure you I have looked into several questions on stakeoverflow and was not able to find similar question. I have implemented Bootstrap 5 offcanvas and there is a weird issue with it. It works perfectly…
Harshal Lonare
  • 2,198
  • 25
  • 29
0
votes
0 answers

Converting rTabs from bs3 to bs5

Hello stackoverflow fellas, lets make something awesome for Bootstrap 5. As I search for week now , there aren't many good Tabs-responsive tabs solutions for Bootstrap5 and most of them are not really good solution for mobile phones. But in my…
xkp
  • 3
  • 3
0
votes
1 answer

vertically center the unordered list with class list-inline inside a div

I am trying to vertically center the unordered list '.header-top-widget' inside a div. But no way it is being centered. I have tried: .header-top-widget { display:flex; align-items:center; } .header-top-widget a, .header-top-social a { …
Aakash Bashyal
  • 316
  • 1
  • 9
0
votes
1 answer

How do you write a toggle switch with Bootstrap 5 and simple_form

https://getbootstrap.com/docs/5.0/forms/checks-radios/#switches. A toggle switch is another way to format a boolean checkbox. <%= simple_form_for(@location) do |form| %> <%= form.input :pre1890 %> Results in a default checkbox. I'd like a toggle…
Greg
  • 1,867
  • 2
  • 16
  • 25
0
votes
0 answers

TypeError: $(...).masonry is not a function when using init in JS

I want to use the Masonry functionality from: https://masonry.desandro.com/ and I imported the script with npm. Using Bootstrap 5 (https://getbootstrap.com/docs/5.0/examples/masonry/) I can easily use: data-masonry='{"percentPosition": true } on…
Justin
  • 1
  • 1
0
votes
2 answers

Can't change element properties in css using tag selectors

I'm a fresher in Web Development field, and I've taken Angela Yu's Web development bootcamp. I'm currently using bootstrap v5 , html5 , CSS3 I came across a problem, I couldn't change properties of body tag when I target using Tag selection Here's…
Aslam
  • 9
  • 2
0
votes
1 answer

Bootstrap5.0 tabs not working: when I click on them different tab information shows up

I am trying to implement Bootstrap5.0 tabs in the following code, but it does not appear to work. The tabs get displayed, but when I click on them different tab information shows up. Such as when I click profile tab, it should shows only "clicked…
L Y
  • 3
  • 2
0
votes
1 answer

Bootstrap 5 collapse show/hide not working when invoked with JS

I am attempting to use javascript to show or hide a collapsable element but not both. (that is to say i dont want toggle to be enabled) according to the documentation https://getbootstrap.com/docs/5.0/components/collapse/#via-javascript i can do…
megaman
  • 751
  • 1
  • 8
  • 18
0
votes
1 answer

Custom MasterPage class stops working with Bootstrap 5

I have an Asp.net WebForm application and I am using MasterPages. My MasterPage code-behind class inherits from a custom class which inherits from the MasterPage base class. This custom master page class maintains different values including user…
Adnan Yaseen
  • 793
  • 10
  • 41
0
votes
1 answer

Why does border-separate: collapse break bordered tables in Bootstrap[?

I have a bordered table, using the Bootstrap classes table table-bordered. If I add border-collapse: separate, the borders are separated correctly, but the top and bottom ones become zero width and so invisible. Is this a quirk of Bootstrap, or am I…
Peter Westlake
  • 4,380
  • 1
  • 22
  • 33
0
votes
1 answer

Bootstrap popover not working with no error

I am creating a website using bootstrap 5, I would like to have a button that when the user clicks it that a popover appears. I have added jQuery and the popper.js files to my files. However when I click on the button nothing happens. I have checked…
becky
  • 158
  • 3
  • 18
0
votes
1 answer

Fixing alignment of search bar using bootstrap 5.0

How can I change the alignment of the search bar and the button to the left continuously after the navbar-brand element? I tried adding justify-content-start bootstrap, text-left bootstrap classes, but none of them worked. The code snippet is given…
Rifat Rakib
  • 47
  • 6
1
2