Questions tagged [react-bootstrap-nav]

30 questions
0
votes
0 answers

How do I change the close icon on react-bootstrap navbar?

I'm using the Navbar component from react-bootstrap as documented here: https://react-bootstrap.github.io/components/navbar/ When the nav bar is viewed on a smaller screen a hamburger icon is displayed. How can I change the icon when the menu is…
Ayo Adesina
  • 2,231
  • 3
  • 37
  • 71
0
votes
0 answers

Change background of collapsed menu when clicked with React Bootstrap

I am building a responsive website using React Bootstrap. I would like to change the color of the drop down menu once collapsed, and remain transparent once it is not collapsed. The drop down menu once collapsed is transparent so I changed the css…
0
votes
0 answers

Navdropdown move to right on windows

I'm trying to add navbar from sample as below: const Header = () => { return ( <> React-Bootstrap
0
votes
0 answers

React-bootstrap Navbar causing Parent state reset

I am trying to create a Navigation tab for my ReactJs Frontend, but somehow the one using React-bootstrap Navbar is causing my parent state to reset. I know that routing between the pages could lead to state reset for peer components if using…
0
votes
0 answers

How can I separate Navbar links in React-Bootstrap?

I'm using a Navbar component with Nav.Link components for each page that I'm linking to. I have those links centered. I would like to add a 'Sign In' button that is justified to the right. So far, the "ml-auto" class name has not worked. Is there a…
0
votes
1 answer

Collapsing the navbar when i click on link in react.js

well as you can see this is an ordinary navbar code, what i'm trying to do is just when the user clicks on the any links/buttons inside the it should collapse, Thanks in advance!
0
votes
1 answer

Alignment not working in react-bootstrap for Navbar-footer

I am using react-bootstrap I want to make a navbar footer, but the alignment is not working for me. This is how it looks right now: I want the socials icons to be right-aligned and the rest centered. here is my code for the Footer component: import…
Sting
  • 19
  • 5
0
votes
1 answer

Bootstrap 5 Dropdown and Collapse Error on Keypress

Background My aim is to have a Bootstrap (5) Navigation bar/menu with animated sub-menus. After much research, I found a solution which seems to give me just what I need. The solution being to use data-bs-toggle="collapse" instead of 'dropdown'…
Zippy
  • 3,826
  • 5
  • 43
  • 96
0
votes
1 answer

React bootstrap Nav.Link only showing as active on second click

I have added a basic react-bootstrap navbar and set the NavLinks up as react-router .Links. When I click on the links they do not show as active. They will only show as active on the second click of the same link. The router is set up in the app.js…
0
votes
1 answer

React-Bootstrap menus do not show the current selection

For example, in the next image, the menu selected was about, the address string shows it, but the menu tab is still showing home I am a newbie with Bootstrap The code is this: import React, { useState } from 'react'; import { Nav, NavDropdown }…
Rafael
  • 2,413
  • 4
  • 32
  • 54
0
votes
2 answers

Reach-Router and React-Bootstrap Navbar

I try to put the things together but don't get it correct to work. Adding the React-Bootstrap Navbar leads to a nice view but if I press the button the view is re-rendered. const App = () => { const riskManagementId = "1"; return ( …
BB-8
  • 45
  • 4
0
votes
0 answers

Bootstrap navbar not retracting

Hi guys so I have a problem with my bootstrap navbar. It just doesn't retract. It works on my homepage, everything is funcional but not on my "secondary pages". It is exactly how it is in the index.php with the expection of the
  • . Here's the…
  • 0
    votes
    1 answer

    React-Bootstrap nav button issue

    i am using React-Bootstrap responsive navbar. I want to change the hamburger button's color or change the whole button. how can i change it?
    0
    votes
    1 answer

    Impossible to apply css properly on a NavDropDown

    I am trying to add a drop down list to my header using react-bootstrap The code look like this const profileImage =
    user…</div>
        <div class=
    Seb
    • 2,929
    • 4
    • 30
    • 73
    -2
    votes
    1 answer

    Can we apply css React Bootstrap Navbar?

    my question is that I have a navbar import from react bootstrap it's work perfect but on full browser screen but after responsive means when max-width is 360px navbar is not work properly I want to style my navbar inline after responsive can anybody…
    1
    2