Border больше, чем изображение в нижнем колонтитуле

Question

Я пытаюсь добавить изображение в раздел нижнего колонтитула для клиента, и по какой-то причине граница справа длиннее остальных, а также дольше их самого изображения. Я попытался добавить «border: none»; к изображению, но что-то по-прежнему его отменяет. Меня не волнует, исчезла ли граница справа от изображения, или если она сокращена. Мне просто нужна помощь.

Вот ссылка на фотографию проблемы. http://imgur.com/hSWqzby

<div class="clear"></div> 
      <div class="help"> 
       <div class="copyright alignleft"> 
        <p>©2013<a href="index.html">Infotek-Soultions</a></p> 
        <a href="Default.html"><img src="images/gear.png" width="20" height="21" alt="Tools" style="border:none;"/></a> 
        <a href="privacy.html">Privacy Policy</a> 
        <a href="Default.html">Resources</a> 
        <a href="Default.html">Client Portal</a> 

       </div> <!-- END copyright --> 

Это мой CSS файл

.copyright p{ 
font-family: 'sansationregular'; 
color:#d8d8d8; 
font-size: 12px; 
float:left; 
margin:0; 
} 
.copyright{ 
margin-top:5px; 
} 
.copyright a{ 
font-family: 'sansationregular'; 
color:#d8d8d8; 
font-size: 12px; 
float:right; 
text-decoration: none; 
border-right:1px solid #d8d8d8; 
padding:0 10px; 
} 
.copyright a:hover{ 
color:#d8d8d8; 
opacity: 0.6; 
} 
.copyright img{ 
border: none; 
} 

Пожалуйста, помогите, если это возможно. Если вам нужно, чтобы я предоставил что-нибудь еще, я могу. Заранее спасибо

Answer 1

проблема заключается в том, что изображение делает якорный элемент выше.

здесь исправить, чтобы удалить границу:

http://codepen.io/anon/pen/gpjlE

HTML:

<div class="clear"></div> 
     <div class="help"> 
      <div class="copyright alignleft"> 
       <p>©2013<a href="index.html">Infotek-Soultions</a></p> 

       <a href="Default.html" class="no-border"><img src="images/gear.png" width="20" height="21" alt="Tools"/> 
       </a> 

       <a href="privacy.html">Privacy Policy</a> 
       <a href="Default.html">Resources</a> 
       <a href="Default.html">Client Portal</a> 

      </div> <!-- END copyright --> 

CSS:

.copyright p{ 

семейство шрифтов: 'sansationregular'; цвет: # d8d8d8; Размер шрифта: 12 пикселей; float: слева; margin: 0; } .copyright { margin-top: 5px; } .copyright a { font-family: 'sansationregular'; цвет: # d8d8d8; Размер шрифта: 12 пикселей; поплавок: правый; text-decoration: none; border-right: 1px solid # d8d8d8; обивка: 0 10px; } .copyright a: hover { цвет: # d8d8d8; непрозрачность: 0,6; }

.copyright> a> img { высота: 100%; поплавок: правый; }

.copyright> a.no-border { border: none; }