Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update navbars example to include a centered nav with utilities #36523

Merged
merged 4 commits into from Oct 22, 2022

Conversation

mdo
Copy link
Member

@mdo mdo commented Jun 7, 2022

Addresses #36486.

@SamuelMiller
Copy link

SamuelMiller commented Jun 8, 2022

Please also provide an example of a true-center navbar following the format of navbarTogglerDemo02 (ttps://getbootstrap.com/docs/5.2/components/navbar/#content) where only the menu and right-align item collapses, not the navbar-brand as well.

Also, see my codepen example for a potentially different approach to center the menu, using flex-1 on both left and right items only using the BS class "col" without specifying a number suffix. #36486 (comment)

Copy link
Member

@julien-deramond julien-deramond left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This new example LGTM! Just a proposal to change the aria-label.
IDK if adding another example where only the menu and right-align item collapses and not the navbar-brand is relevant.

site/content/docs/5.2/examples/navbars/index.html Outdated Show resolved Hide resolved
@SamuelMiller
Copy link

Also, see my codepen example for a potentially different approach to center the menu, using flex-1 on both left and right items only using the BS class "col" without specifying a number suffix. #36486 (comment)

I have provided a Codepen of this approach applied to a Bootstrap navbar. See comment, #36486 (comment)

@mdo mdo merged commit bbe1ffd into main Oct 22, 2022
@mdo mdo deleted the examples-navbar-centered branch October 22, 2022 21:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
No open projects
Status: Done
Development

Successfully merging this pull request may close these issues.

None yet

4 participants