title: Medium.com Menu Horizontal Style - See Pic Example
body: <p>I am trying to make my menu system look exactly like how medium has it however I just seem to not be able to get the Arrows to show up on left and right of the menu itself. As provided in the example image or you can view it here</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-css lang-css prettyprint-override"><code>div.scrollmenu {
    /*   background-color: #333; */
    overflow: auto;
    white-space: nowrap;
  }
  
  div.scrollmenu a {
    display: inline-block;
    color: black;
    text-align: center;
    padding: 14px;
    text-decoration: none;
  }
  
  
  /* div.scrollmenu a:hover {
    background-color: #777;
  } */</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="scrollmenu"&gt;
    &lt;a href="#home"&gt;Home&lt;/a&gt;
    &lt;a href="#news"&gt;News&lt;/a&gt;
    &lt;a href="#contact"&gt;Contact&lt;/a&gt;
    &lt;a href="#about"&gt;About&lt;/a&gt;
    &lt;a href="#support"&gt;Support&lt;/a&gt;
    &lt;a href="#blog"&gt;Blog&lt;/a&gt;
    &lt;a href="#tools"&gt;Tools&lt;/a&gt;
    &lt;a href="#base"&gt;Base&lt;/a&gt;
    &lt;a href="#custom"&gt;Custom&lt;/a&gt;
    &lt;a href="#more"&gt;More&lt;/a&gt;
    &lt;a href="#logo"&gt;Logo&lt;/a&gt;
    &lt;a href="#friends"&gt;Friends&lt;/a&gt;
    &lt;a href="#partners"&gt;Partners&lt;/a&gt;
    &lt;a href="#people"&gt;People&lt;/a&gt;
    &lt;a href="#work"&gt;Work&lt;/a&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>An answer to the arrows is what Im hunting and would be appreciated.
  <img src="https://i.stack.imgur.com/NLHqR.png" alt="Image Example" /></p>