{"id":2597,"date":"2017-07-06T15:37:33","date_gmt":"2017-07-06T15:37:33","guid":{"rendered":"https:\/\/www.codexworld.com\/?p=2597"},"modified":"2017-07-06T15:39:30","modified_gmt":"2017-07-06T15:39:30","slug":"bootstrap-navbar-center-align-menu-text","status":"publish","type":"post","link":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/","title":{"rendered":"Center Align Menu in Bootstrap Navbar"},"content":{"rendered":"<p>The top navigation menu bar can be created easily with Bootstrap. Generally, the menu is aligned to the left or right side of the top navigation bar. Bootstrap provides an easy way to control the menu alignment. To align the text or menu links in Bootstrap navbar, <code>navbar-nav<\/code> and <code>navbar-left<\/code> or <code>navbar-right<\/code> are used.<\/p>\n<p>However, sometimes it requires aligning menu links in the center of the navbar. But Bootstrap doesn&#8217;t have any class for center alignment. In this tutorial, we will show how you can change the position of menu or text to center in the Bootstrap navbar.<\/p>\n<p>The Bootstrap libraries need to be included first to <b>create navigation bar with Bootstrap<\/b>.<\/p>\n<pre>&lt;<span style=\"color:#bf4f24\">link<\/span> <span style=\"color:#bf4f24\">rel<\/span>=<span style=\"color:#0b6125\">\"stylesheet\"<\/span> <span style=\"color:#bf4f24\">href<\/span>=<span style=\"color:#0b6125\">\"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/3.3.7\/css\/bootstrap.min.css\"<\/span>>\r\n&lt;<span style=\"color:#bf4f24\">script<\/span> <span style=\"color:#bf4f24\">src<\/span>=<span style=\"color:#0b6125\">\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/3.2.1\/jquery.min.js\"<\/span>>&lt;\/<span style=\"color:#bf4f24\">script<\/span>>\r\n&lt;<span style=\"color:#bf4f24\">script<\/span> <span style=\"color:#bf4f24\">src<\/span>=<span style=\"color:#0b6125\">\"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/3.3.7\/js\/bootstrap.min.js\"<\/span>>&lt;\/<span style=\"color:#bf4f24\">script<\/span>>\r\n<\/pre>\n<h2>HTML Code<\/h2>\n<p>The following HTML creates a navbar with Bootstrap. The menu will be placed in three different positions, left, right, and center. Add the custom defined class named <code>navbar-center<\/code> to align menu center.<\/p>\n<pre>&lt;<span style=\"color:#bf4f24\">nav<\/span> <span style=\"color:#bf4f24\">class<\/span>=<span style=\"color:#0b6125\">\"navbar navbar-default\"<\/span> <span style=\"color:#bf4f24\">role<\/span>=<span style=\"color:#0b6125\">\"navigation\"<\/span>>\r\n    &lt;<span style=\"color:#bf4f24\">div<\/span> <span style=\"color:#bf4f24\">class<\/span>=<span style=\"color:#0b6125\">\"navbar-header\"<\/span>>\r\n        &lt;<span style=\"color:#bf4f24\">button<\/span> <span style=\"color:#bf4f24\">type<\/span>=<span style=\"color:#0b6125\">\"button\"<\/span> <span style=\"color:#bf4f24\">class<\/span>=<span style=\"color:#0b6125\">\"navbar-toggle\"<\/span> <span style=\"color:#bf4f24\">data-toggle<\/span>=<span style=\"color:#0b6125\">\"collapse\"<\/span> <span style=\"color:#bf4f24\">data-target<\/span>=<span style=\"color:#0b6125\">\".navbar-collapse\"<\/span>>\r\n            &lt;<span style=\"color:#bf4f24\">span<\/span> <span style=\"color:#bf4f24\">class<\/span>=<span style=\"color:#0b6125\">\"icon-bar\"<\/span>>&lt;\/<span style=\"color:#bf4f24\">span<\/span>>\r\n            &lt;<span style=\"color:#bf4f24\">span<\/span> <span style=\"color:#bf4f24\">class<\/span>=<span style=\"color:#0b6125\">\"icon-bar\"<\/span>>&lt;\/<span style=\"color:#bf4f24\">span<\/span>>\r\n            &lt;<span style=\"color:#bf4f24\">span<\/span> <span style=\"color:#bf4f24\">class<\/span>=<span style=\"color:#0b6125\">\"icon-bar\"<\/span>>&lt;\/<span style=\"color:#bf4f24\">span<\/span>>\r\n        &lt;\/<span style=\"color:#bf4f24\">button<\/span>>\r\n    &lt;\/<span style=\"color:#bf4f24\">div<\/span>>\r\n    &lt;<span style=\"color:#bf4f24\">div<\/span> <span style=\"color:#bf4f24\">class<\/span>=<span style=\"color:#0b6125\">\"navbar-collapse collapse\"<\/span>>\r\n        &lt;<span style=\"color:#bf4f24\">ul<\/span> <span style=\"color:#bf4f24\">class<\/span>=<span style=\"color:#0b6125\">\"nav navbar-nav navbar-left\"<\/span>>\r\n            &lt;<span style=\"color:#bf4f24\">li<\/span>>&lt;<span style=\"color:#bf4f24\">a<\/span> <span style=\"color:#bf4f24\">href<\/span>=<span style=\"color:#0b6125\">\"#\"<\/span>>Left&lt;\/<span style=\"color:#bf4f24\">a<\/span>>&lt;\/<span style=\"color:#bf4f24\">li<\/span>>\r\n        &lt;\/<span style=\"color:#bf4f24\">ul<\/span>>\r\n        &lt;<span style=\"color:#bf4f24\">ul<\/span> <span style=\"color:#bf4f24\">class<\/span>=<span style=\"color:#0b6125\">\"nav navbar-nav navbar-center\"<\/span>>\r\n            &lt;<span style=\"color:#bf4f24\">li<\/span>>&lt;<span style=\"color:#bf4f24\">a<\/span> <span style=\"color:#bf4f24\">href<\/span>=<span style=\"color:#0b6125\">\"#\"<\/span>>Center 1&lt;\/<span style=\"color:#bf4f24\">a<\/span>>&lt;\/<span style=\"color:#bf4f24\">li<\/span>>\r\n            &lt;<span style=\"color:#bf4f24\">li<\/span>>&lt;<span style=\"color:#bf4f24\">a<\/span> <span style=\"color:#bf4f24\">href<\/span>=<span style=\"color:#0b6125\">\"#\"<\/span>>Center 2&lt;\/<span style=\"color:#bf4f24\">a<\/span>>&lt;\/<span style=\"color:#bf4f24\">li<\/span>>\r\n            &lt;<span style=\"color:#bf4f24\">li<\/span>>&lt;<span style=\"color:#bf4f24\">a<\/span> <span style=\"color:#bf4f24\">href<\/span>=<span style=\"color:#0b6125\">\"#\"<\/span>>Center 3&lt;\/<span style=\"color:#bf4f24\">a<\/span>>&lt;\/<span style=\"color:#bf4f24\">li<\/span>>\r\n        &lt;\/<span style=\"color:#bf4f24\">ul<\/span>>\r\n        &lt;<span style=\"color:#bf4f24\">ul<\/span> <span style=\"color:#bf4f24\">class<\/span>=<span style=\"color:#0b6125\">\"nav navbar-nav navbar-right\"<\/span>>\r\n            &lt;<span style=\"color:#bf4f24\">li<\/span>>&lt;<span style=\"color:#bf4f24\">a<\/span> <span style=\"color:#bf4f24\">href<\/span>=<span style=\"color:#0b6125\">\"#\"<\/span>>Right&lt;\/<span style=\"color:#bf4f24\">a<\/span>>&lt;\/<span style=\"color:#bf4f24\">li<\/span>>\r\n        &lt;\/<span style=\"color:#bf4f24\">ul<\/span>>\r\n    &lt;\/<span style=\"color:#bf4f24\">div<\/span>>\r\n&lt;\/<span style=\"color:#bf4f24\">nav<\/span>>\r\n<\/pre>\n<h2>CSS Code<\/h2>\n<p>The following CSS code of the <code>navbar-center<\/code> class will align the menu or text content to the center position in Bootstrap navbar.<\/p>\n<pre><span style=\"color:#bf4f24\">.navbar-nav<\/span><span style=\"color:#bf4f24\">.navbar-center<\/span> {\r\n    <span style=\"color:#691c97\">position<\/span><span style=\"color:#794938\">:<\/span> <span style=\"color:#b4371f\">absolute<\/span>;\r\n    <span style=\"color:#691c97\">left<\/span><span style=\"color:#794938\">:<\/span> <span style=\"color:#811f24;font-weight:700\">50<span style=\"color:#794938\">%<\/span><\/span>;\r\n    transform<span style=\"color:#794938\">:<\/span> translatex(<span style=\"color:#811f24;font-weight:700\">-50<span style=\"color:#794938\">%<\/span><\/span>);\r\n}\r\n<\/pre>\n<p>Our example code aligns the menu in three positions on Bootstrap navbar like the below.<\/p>\n<div class=\"img_center\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-left-right-center-text-menu-align-codexworld.png\" alt=\"bootstrap-navbar-left-right-center-text-menu-align-codexworld\" width=\"807\" height=\"56\" class=\"alignnone size-full wp-image-2599\" srcset=\"https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-left-right-center-text-menu-align-codexworld.png 807w, https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-left-right-center-text-menu-align-codexworld-300x21.png 300w, https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-left-right-center-text-menu-align-codexworld-768x53.png 768w, https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-left-right-center-text-menu-align-codexworld-200x14.png 200w, https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-left-right-center-text-menu-align-codexworld-346x24.png 346w\" sizes=\"auto, (max-width: 807px) 100vw, 807px\" \/><\/div>\n","protected":false},"excerpt":{"rendered":"<p>The top navigation menu bar can be created easily with Bootstrap. Generally, the menu is aligned to the left or right side of the top navigation bar. Bootstrap provides an easy way to control the <\/p>\n","protected":false},"author":1,"featured_media":2598,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[274],"tags":[275,296],"class_list":["post-2597","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-bootstrap","tag-bootstrap","tag-navbar","cat-274-id","has_thumb"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Center Align Menu in Bootstrap Navbar - CodexWorld<\/title>\n<meta name=\"description\" content=\"Bootstrap navbar center align - Example code to align the menu or text content to the center position in Bootstrap navbar. Bootstrap left, center, and right menu alignment in navbar.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Center Align Menu in Bootstrap Navbar - CodexWorld\" \/>\n<meta property=\"og:description\" content=\"Bootstrap navbar center align - Example code to align the menu or text content to the center position in Bootstrap navbar. Bootstrap left, center, and right menu alignment in navbar.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/\" \/>\n<meta property=\"og:site_name\" content=\"CodexWorld\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/codexworld\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/codexworld\" \/>\n<meta property=\"article:published_time\" content=\"2017-07-06T15:37:33+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-07-06T15:39:30+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-center-align-codexworld.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1366\" \/>\n\t<meta property=\"og:image:height\" content=\"768\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"CodexWorld\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@codexworldblog\" \/>\n<meta name=\"twitter:site\" content=\"@codexworldweb\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"CodexWorld\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/\"},\"author\":{\"name\":\"CodexWorld\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/person\\\/9da51d8fa3cdefeb5ec9c69136d4baf0\"},\"headline\":\"Center Align Menu in Bootstrap Navbar\",\"datePublished\":\"2017-07-06T15:37:33+00:00\",\"dateModified\":\"2017-07-06T15:39:30+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/\"},\"wordCount\":187,\"commentCount\":6,\"publisher\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2017\\\/07\\\/bootstrap-navbar-center-align-codexworld.png\",\"keywords\":[\"Bootstrap\",\"Navbar\"],\"articleSection\":[\"Bootstrap\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/\",\"name\":\"Center Align Menu in Bootstrap Navbar - CodexWorld\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2017\\\/07\\\/bootstrap-navbar-center-align-codexworld.png\",\"datePublished\":\"2017-07-06T15:37:33+00:00\",\"dateModified\":\"2017-07-06T15:39:30+00:00\",\"description\":\"Bootstrap navbar center align - Example code to align the menu or text content to the center position in Bootstrap navbar. Bootstrap left, center, and right menu alignment in navbar.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2017\\\/07\\\/bootstrap-navbar-center-align-codexworld.png\",\"contentUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2017\\\/07\\\/bootstrap-navbar-center-align-codexworld.png\",\"width\":1366,\"height\":768,\"caption\":\"bootstrap-navbar-center-align-codexworld\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/bootstrap-navbar-center-align-menu-text\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.codexworld.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Center Align Menu in Bootstrap Navbar\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#website\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/\",\"name\":\"CodexWorld\",\"description\":\"Web &amp; Mobile App Development Company\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.codexworld.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#organization\",\"name\":\"CodexWorld\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2014\\\/09\\\/codexworld-logo.png\",\"contentUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2014\\\/09\\\/codexworld-logo.png\",\"width\":200,\"height\":19,\"caption\":\"CodexWorld\"},\"image\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/codexworld\",\"https:\\\/\\\/x.com\\\/codexworldweb\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/codexworld\",\"https:\\\/\\\/www.youtube.com\\\/codexworld\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/person\\\/9da51d8fa3cdefeb5ec9c69136d4baf0\",\"name\":\"CodexWorld\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g\",\"caption\":\"CodexWorld\"},\"description\":\"CodexWorld is a programming blog, one-stop destination for web professionals \u2014 developers, programmers, freelancers, and site owners.\",\"sameAs\":[\"http:\\\/\\\/www.codexworld.com\",\"https:\\\/\\\/www.facebook.com\\\/codexworld\",\"https:\\\/\\\/x.com\\\/codexworldblog\"],\"url\":\"https:\\\/\\\/www.codexworld.com\\\/author\\\/nitya192265\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Center Align Menu in Bootstrap Navbar - CodexWorld","description":"Bootstrap navbar center align - Example code to align the menu or text content to the center position in Bootstrap navbar. Bootstrap left, center, and right menu alignment in navbar.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/","og_locale":"en_US","og_type":"article","og_title":"Center Align Menu in Bootstrap Navbar - CodexWorld","og_description":"Bootstrap navbar center align - Example code to align the menu or text content to the center position in Bootstrap navbar. Bootstrap left, center, and right menu alignment in navbar.","og_url":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/","og_site_name":"CodexWorld","article_publisher":"https:\/\/www.facebook.com\/codexworld","article_author":"https:\/\/www.facebook.com\/codexworld","article_published_time":"2017-07-06T15:37:33+00:00","article_modified_time":"2017-07-06T15:39:30+00:00","og_image":[{"width":1366,"height":768,"url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-center-align-codexworld.png","type":"image\/png"}],"author":"CodexWorld","twitter_card":"summary_large_image","twitter_creator":"@codexworldblog","twitter_site":"@codexworldweb","twitter_misc":{"Written by":"CodexWorld","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/#article","isPartOf":{"@id":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/"},"author":{"name":"CodexWorld","@id":"https:\/\/www.codexworld.com\/#\/schema\/person\/9da51d8fa3cdefeb5ec9c69136d4baf0"},"headline":"Center Align Menu in Bootstrap Navbar","datePublished":"2017-07-06T15:37:33+00:00","dateModified":"2017-07-06T15:39:30+00:00","mainEntityOfPage":{"@id":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/"},"wordCount":187,"commentCount":6,"publisher":{"@id":"https:\/\/www.codexworld.com\/#organization"},"image":{"@id":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/#primaryimage"},"thumbnailUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-center-align-codexworld.png","keywords":["Bootstrap","Navbar"],"articleSection":["Bootstrap"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/","url":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/","name":"Center Align Menu in Bootstrap Navbar - CodexWorld","isPartOf":{"@id":"https:\/\/www.codexworld.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/#primaryimage"},"image":{"@id":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/#primaryimage"},"thumbnailUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-center-align-codexworld.png","datePublished":"2017-07-06T15:37:33+00:00","dateModified":"2017-07-06T15:39:30+00:00","description":"Bootstrap navbar center align - Example code to align the menu or text content to the center position in Bootstrap navbar. Bootstrap left, center, and right menu alignment in navbar.","breadcrumb":{"@id":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/#primaryimage","url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-center-align-codexworld.png","contentUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-center-align-codexworld.png","width":1366,"height":768,"caption":"bootstrap-navbar-center-align-codexworld"},{"@type":"BreadcrumbList","@id":"https:\/\/www.codexworld.com\/bootstrap-navbar-center-align-menu-text\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.codexworld.com\/"},{"@type":"ListItem","position":2,"name":"Center Align Menu in Bootstrap Navbar"}]},{"@type":"WebSite","@id":"https:\/\/www.codexworld.com\/#website","url":"https:\/\/www.codexworld.com\/","name":"CodexWorld","description":"Web &amp; Mobile App Development Company","publisher":{"@id":"https:\/\/www.codexworld.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.codexworld.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.codexworld.com\/#organization","name":"CodexWorld","url":"https:\/\/www.codexworld.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.codexworld.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2014\/09\/codexworld-logo.png","contentUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2014\/09\/codexworld-logo.png","width":200,"height":19,"caption":"CodexWorld"},"image":{"@id":"https:\/\/www.codexworld.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/codexworld","https:\/\/x.com\/codexworldweb","https:\/\/www.linkedin.com\/company\/codexworld","https:\/\/www.youtube.com\/codexworld"]},{"@type":"Person","@id":"https:\/\/www.codexworld.com\/#\/schema\/person\/9da51d8fa3cdefeb5ec9c69136d4baf0","name":"CodexWorld","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g","caption":"CodexWorld"},"description":"CodexWorld is a programming blog, one-stop destination for web professionals \u2014 developers, programmers, freelancers, and site owners.","sameAs":["http:\/\/www.codexworld.com","https:\/\/www.facebook.com\/codexworld","https:\/\/x.com\/codexworldblog"],"url":"https:\/\/www.codexworld.com\/author\/nitya192265\/"}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2017\/07\/bootstrap-navbar-center-align-codexworld.png","jetpack_shortlink":"https:\/\/wp.me\/p6bxIh-FT","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts\/2597","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/comments?post=2597"}],"version-history":[{"count":1,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts\/2597\/revisions"}],"predecessor-version":[{"id":2600,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts\/2597\/revisions\/2600"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/media\/2598"}],"wp:attachment":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/media?parent=2597"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/categories?post=2597"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/tags?post=2597"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}