title: How do I make the left of my logo image unclickable?
body: <p><a href="http://codepen.io/league95/pen/dGwLQM" rel="nofollow">Ok here is my complete page</a>
  I'm trying to work on my portfolio page, and so far, I'm trying to make my logo image unclickable from its left margin, but I can't figure out how.</p>
  
  <p>Here is my code so far:</p>
  
  <p>HTML for logo:</p>
  
  <pre><code>    &lt;!-- My img logo --&gt;
      &lt;a class ="navbar-brand" href="#"&gt;&lt;img class="img-logo" 
      src="http://i.imgur.com/H1mje3y.jpg" alt=""&gt;&lt;/a&gt;
  </code></pre>
  
  <p>CSS for logo:</p>
  
  <pre><code>.img-logo{
  height: 200%;
  margin: -9px 0 30px 500px;
  border-radius: 40%;
  border: 3.5px solid maroon;
  }
  </code></pre>
  
  <p>As you can see I had to set the margin for left to 500 to center my logo, but I don't want the margin to be clickable by hovering over it, I just want the logo to be clickable!! How do I accomplish this?</p>