title: How to center the menu
body: <p>I am currently working with a webshop, and I have some trouble centering the top menu.</p>
  
  <p>The code look like this:</p>
  
  <pre><code> &lt;div id="webshop-topmenu" class="row logoRow ProductMenu_TD"&gt;
       &lt;div align="center"&gt;
           &lt;div class="small-12 columns menus"&gt;
               &lt;nav class="top-bar productmenu" data-topbar role="navigation"&gt;
                   &lt;ul class="title-area"&gt;
                       &lt;li class="name"&gt;&lt;/li&gt;
                       &lt;li class="toggle-topbar menu-icon"&gt;&lt;a href="#"&gt;&lt;span&gt;Menu&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                   &lt;/ul&gt;
  
                   &lt;section class="top-bar-section"&gt;[[ProductMenu]]&lt;/section&gt;
                &lt;/nav&gt;
  
                &lt;div class="sub-nav pagelinks TopMenu_TD hide-for-small"&gt;[[TopMenu]]&lt;/div&gt;
           &lt;/div&gt;
       &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>No matter what code I use, the menu always aligns to the right, and I want to center it. </p>
  
  <p>I have tried the <code>&lt;div align"center"&gt;</code> and <code>&lt;center&gt;</code> and a couple of other codes, but nothing seems to work.</p>
  
  <p>Hope you can help me here.</p>
  
  <p><a href="https://i.stack.imgur.com/bltRu.png" rel="nofollow noreferrer">What it looks like</a></p>