title: How do I positioning dynamically created links using css in wordpress?
body: <p>I have built the navigation in html and css but has been given back to me with wordpress installed and some of my styling hasn't rendered as expected. From my understanding there are limitations surrounding the styling of <code>&lt;a&gt;</code> tags in links.</p>
  
  <p>I want to give the dynamically created  a bottom margin of -15px.
  The<code>&lt;a&gt;</code> is in an <code>&lt;li&gt;</code> . Adding a margin to that doesn't effect the <code>&lt;a&gt;</code> within it, not does adding margin to the <code>&lt;ul&gt;</code>. It appears to not to be inside these elements?</p>
  
  <pre><code>&lt;div class="nav-head"&gt;
      &lt;?php
      wp_nav_menu(array(
        'theme_location' =&gt; 'primary',
        'depth' =&gt; 2,
        'container' =&gt; false,
        'container_class' =&gt; 'btn',
        'container_id' =&gt; '',
        'menu_class' =&gt; 'nav-menu',
      )
    );
    ?&gt;
    &lt;a type="button" class="btn secondary-btn" href="/contact"&gt;Request Demo&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.nav-head {
            display: flex;
             }
  
   ul.nav-menu {
            display: flex;
                }
  
   li.menu-item {
               margin-bottom: -15px;
               display: inline-block;
                 } 
  
    a {
        color: blue;
        padding: 15px;
        display: inline-block;
                  }
  </code></pre>