title: Navbar link margin classes seem repetitive in Tailwind CSS, is there a better way?
body: <p>Having to add margin classes to each LI seems REALLY repetitive on a menu that is not being dynamically generated. This feels dirty like using style="" attributes...</p>
  
  <p>Surely there must be a better way?</p>
  
  <p>Not a huge deal on a small menu, but the final menu will have many levels of submenu.  </p>
  
  <p>I wonder if I should just write a rule in my stylesheet to add margins on my menu items?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet"&gt;
  
  &lt;nav class="p-2 bg-indigo-900 text-white"&gt;
      &lt;ul class="flex flex-row"&gt;
          &lt;li class="mr-1"&gt;
              &lt;a href="#"&gt;Home&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="ml-1 mr-1"&gt;
              &lt;a href="#"&gt;About&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="ml-1 mr-1"&gt;
              &lt;a href="#"&gt;Services&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="ml-1 mr-1"&gt;
              &lt;a href="#"&gt;History&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="ml-1"&gt;
              &lt;a href="#"&gt;Contact&lt;/a&gt;
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/nav&gt;</code></pre>
  </div>
  </div>
  </p>