react-bulma-components
react-bulma-components copied to clipboard
Navbar not rendering properly
trafficstars
Describe the bug
As pictured, the links that should be to the right of the Navbar Brand are off in wrong place

<Router>
<Navbar>
<Navbar.Brand>
<Navbar.Item href="#">
<img
alt="Bulma: a modern CSS framework based on Flexbox"
height="28"
src="https://bulma.io/images/bulma-logo.png"
width="112"
/>
</Navbar.Item>
<Navbar.Burger />
</Navbar.Brand>
<Navbar.Menu>
<Navbar.Container>
<Navbar.Item href="#">
<Navbar.Link>
First
</Navbar.Link>
<Navbar.Dropdown>
<Navbar.Item href="#">
Subitem 1
</Navbar.Item>
<Navbar.Item href="#">
Subitem 2
</Navbar.Item>
<Navbar.Divider />
<Navbar.Item href="#">
After divider
</Navbar.Item>
</Navbar.Dropdown>
</Navbar.Item>
<Navbar.Item href="#">
Second
</Navbar.Item>
</Navbar.Container>
<Navbar.Container align="end">
<Navbar.Item href="#">
At the end
</Navbar.Item>
</Navbar.Container>
</Navbar.Menu>
</Navbar>
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="https://bulma.io">
<img src="https://bulma.io/images/bulma-logo.png" width="112" height="28" />
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navbarBasicExample" class="navbar-menu">
<div class="navbar-start">
<a class="navbar-item">
Home
</a>
<a class="navbar-item">
Documentation
</a>
<div class="navbar-item has-dropdown is-hoverable">
<a class="navbar-link">
More
</a>
<div class="navbar-dropdown">
<a class="navbar-item">
About
</a>
<a class="navbar-item">
Jobs
</a>
<a class="navbar-item">
Contact
</a>
<hr class="navbar-divider" />
<a class="navbar-item">
Report an issue
</a>
</div>
</div>
</div>
<div class="navbar-end">
<div class="navbar-item">
<div class="buttons">
<a class="button is-primary">
<strong>Sign up</strong>
</a>
<a class="button is-light">
Log in
</a>
</div>
</div>
</div>
</div>
</nav>
<Switch>
<Route exact path="/">
<Home />
</Route>
<Route exact path="/about">
<About />
</Route>
</Switch>
</Router>
@kennedybaird apologies for the silence, are you still having this issue? If so, can you put this code in a code sandbox so that I can play around with it?