Stack Overflow
Stack Overflow

Questions tagged [nav-pills]

84 questions
1
vote
1 answer

Multiple column bootstrap pills

I've tried front-end recently (not very good at it yet) and did a little something in CodePen. I wanted the content to change upon clicking a category instead of redirecting to another page, but I wanted to avoid jQuery or JS for now. So I tried…
anyabythestars
  • 157
  • 1
  • 12
1
vote
2 answers

Bootstrap nav pills- first nav pill data still there when 2nd nav pill active

I am using Bootstrap pills for toggling on the same page. There are two nav-pills and two divs corresponding to each of them.I have constructed the first div correctly and is working fine. But when I am trying to construct the second div, the…
Shubham Goyal
  • 617
  • 1
  • 7
  • 18
1
vote
1 answer

Bootstrap nav pills with / sign in the tab link don't works

I'm using bootstrap with nav pills. If I put a / sign to the link of the tab, that tab will not work, throws a javascript error in the jquery own code if I click to it. How can I fix this?
Lay András
  • 795
  • 2
  • 9
  • 14
1
vote
1 answer

Simple way to navigate through bootstrap nav pills

I have a bootstrap nav pills sample here drawn as,
mpsbhat
  • 2,733
  • 12
  • 49
  • 105
1
vote
1 answer

Set the active Nav Pill when returning to a page

I have a nav pill example below where I have a nav pill and the active tab toggles depending on the selected tab and this works fine. However the link sends the browser to another page. I want to have the active pill set to the same one as when it…
Bill F
  • 2,057
  • 3
  • 18
  • 39
1
vote
0 answers

Making Bootstrap Nav-Pills fixed to the top

I'm trying to use bootstrap nav pills as by navigation bar. I'd like to have the nav pills fixed to the top of the page when a user scrolls. I know the .navbar class can call the .navbar-fixed-top class, which performs this function but is there an…
bongo700
  • 67
  • 1
  • 7
1
vote
1 answer

how to dynamically add active tab functionality?

Everytime I click on a tab I want it to become active. How should I achieve this?
1
vote
1 answer

how to keep separator out of nave pill

This is created using following code -
1
vote
2 answers

Bootstrap pills - show pills if mobile device else show all content (responsive)

I've been trying to figure out how to show pills if the screen is xs layout (bootstrap). I want to show all the content if it's a bigger device. Is there a way of removing the "tab-content" class on the div including the content if the device is…
JeppePepp
  • 491
  • 11
  • 20
0
votes
1 answer

Using Bootstrap 5 vertical pills, how to display tab content directly under the nav link on mobile devices?

The vertical pills layout is exactly what I want for desktop devices, but for small screen sizes, I want it to be more compact. I need the tab-pane text to display under the nav-link - like under each individual nav-link, not below the whole group…
continuingweb
  • 1
  • 2
0
votes
0 answers

Django, unable to filter all items under one or more categories attached to it using dynamic bootstrap 5 nav pills using many to many relationship

Given the files below am unable to filter all items relating to one category or more than one category. Example: let items = A, B, C, D categories = 1, 2, 3, 4 items in category 1 = A and B items in category 2 = C and D category 3 and 4 are not…
miruni
  • 87
  • 11
0
votes
1 answer

Altering height of Python/Dash Navigation Pills?

I have a Python/Dash application with a vertical nav-bar and I wish to alter the height of the nav-pills. I'm using the bootstrap "SLATE" theme with the CSS-file stored locally in the /asset directory. The sidebar code: SIDEBAR_STYLE = { …
Pman70
  • 143
  • 3
  • 11
0
votes
1 answer

Why active nav pills content not showing properly

I am trying to use Boostrap 5 nav pills, but the content of the nav pills are not showing properly.I am using 3 nav pills, after 3rd pill, content of 3rd pill shows up in first pill and the first pill content not showing, 2nd and 3rd pill content…
CodeHunt
  • 83
  • 1
  • 11
0
votes
1 answer

Pills sticking together even when using margin - Tailwind

I have these pills that look fine when I'm using full screen but if I minimize the screen they all stack together. I'm having trouble understanding why because I have margin on them. Is there something else you should use for pills to add…
charmy
  • 41
  • 1
  • 4
0
votes
1 answer

Bootstrap 4 nav-pills - how to set inactive pills to use outline

I want the inactive pills in my Bootstrap 4 'nav' to have the 'btn-outline-primary' class instead of just being plain text without a border. How? example from the Bootstrap 4 docs...
Kevin Hackett
  • 11
  • 5
1
2
3 4 5 6