removing the borders of the navbar's button in Bootstrap 3
<p>I'm creating a webpage and let's say I've got this navbar: (Courtesy <a href="http://www.tutorialspoint.com/" rel="nofollow noreferrer">TutorialsPoint</a>)</p>

<pre><code>&lt;nav class="navbar navbar-default" role="navigation"&gt; 
   &lt;div class="navbar-header"&gt; 
      &lt;button type="button" class="navbar-toggle" data-toggle="collapse"  
         data-target="#example-navbar-collapse"&gt; 
         &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt; 
         &lt;span class="icon-bar"&gt;&lt;/span&gt; 
         &lt;span class="icon-bar"&gt;&lt;/span&gt; 
         &lt;span class="icon-bar"&gt;&lt;/span&gt;
       &lt;/button&gt; 
      &lt;a class="navbar-brand" href="#"&gt;TutorialsPoint&lt;/a&gt; 
   &lt;/div&gt; 
   &lt;div class="collapse navbar-collapse" id="example-navbar-collapse"&gt; 
      &lt;ul class="nav navbar-nav"&gt; 
         &lt;li class="active"&gt;&lt;a href="#"&gt;iOS&lt;/a&gt;&lt;/li&gt; 
         &lt;li&gt;&lt;a href="#"&gt;SVN&lt;/a&gt;&lt;/li&gt; 
         &lt;li class="dropdown"&gt; 
            &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt; 
               Java &lt;b class="caret"&gt;&lt;/b&gt; 
            &lt;/a&gt; 
            &lt;ul class="dropdown-menu"&gt; 
               &lt;li&gt;&lt;a href="#"&gt;jmeter&lt;/a&gt;&lt;/li&gt; 
               &lt;li&gt;&lt;a href="#"&gt;EJB&lt;/a&gt;&lt;/li&gt; 
               &lt;li&gt;&lt;a href="#"&gt;Jasper Report&lt;/a&gt;&lt;/li&gt; 
               &lt;li class="divider"&gt;&lt;/li&gt; 
               &lt;li&gt;&lt;a href="#"&gt;Separated link&lt;/a&gt;&lt;/li&gt; 
               &lt;li class="divider"&gt;&lt;/li&gt; 
               &lt;li&gt;&lt;a href="#"&gt;One more separated link&lt;/a&gt;&lt;/li&gt; 
            &lt;/ul&gt; 
         &lt;/li&gt; 
      &lt;/ul&gt; 
   &lt;/div&gt; 
&lt;/nav&gt;
</code></pre>

<p>This creates borders like this:
<a href="https://i.stack.imgur.com/qQOjX.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/qQOjX.jpg" alt="borders!"></a>
codepen.io/aravind-forever/pen/WGQXzL</p>

<p>I want to remove the borders from both the <code>button</code> and the <code>nav</code>. How do I do this? I've tried <code>border: none</code> but that does not work.</p>

<p><em>Merci d'avance!</em></p>