邊框更長，然後在頁腳中的圖像

我正在嘗試在客戶端的頁腳部分添加圖像，出於某種原因，右側的邊框比其他長，而且它們的圖像本身也越長。我嘗試添加「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; 
}

如果可能的話請幫忙。如果你需要我提供其他任何東西，我可以。在此先感謝

來源

2014-01-15 Joshua Mathews

請在JSFiddle中演示問題。您應該意識到您正在將邊框添加到'a'標記，因此如果從圖像中刪除將不起作用。 –

我想添加一個JSFiddle，但圖像沒有顯示出來，然後一個小方塊 –

你可以試試''.copyright a：last-child {border-right：0; }' –

問題是圖像正在使錨元素更高。

這裏是一個修復刪除邊框：

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{

FONT-FAMILY： 'sansationregular'; 顏色：＃d8d8d8; font-size：12px; float：left; margin：0; } .copyright {margin：{margin：0px; 5px; } 。copyrightright a { font-family：'sansationregular'; 顏色：＃d8d8d8; font-size：12px; 浮動：右; text-decoration：none; border-right：1px solid＃d8d8d8; padding：0 10px; } 。版權所有a：hover { color：＃d8d8d8; 不透明度：0.6; }

.copyright> a> img {height：100％}; 浮動：右; }

.copyright> a.no邊界{ 邊界：無; }

來源

2014-01-15 17:04:33 CodeToad

感謝您的幫助！ –

邊框更長，然後在頁腳中的圖像

回答

相關問題