刪除引導程序中的標題圖像中的細線

Question

我有一個基本的代碼與引導和標題/菜單中的svg精靈..並且圖標中有一條細的灰色背景線。

http://codepen.io/anon/pen/dpzKoQ?editors=1100

可以請你幫忙。我已經嘗試設置

border- *等到0 - 我可以修復。我設置顏色/背景 - 但有些地方我失去了一些東西。

一些地方它正從normalize.less以下值

邊界圖像寬度：1;

代碼：請參閱codepen。

.icon { 
    display: inline-block; 
    background-repeat: no-repeat; 
    background-image: url(https://cdn.rawgit.com/srisitar/test/master/sprite.svg); 
} 

.icon-facebook { 
    width: 96px; 
    height: 96px; 
    background-position: 0 0; 
} 

.icon-twitter { 
    width: 96px; 
    height: 96px; 
    background-position: -128px 0; 
} 

<

div id="home"> 
     <a href=" "> 
        <img class="icon icon-twitter"></a> 
               </div> 

如何刪除灰線。

感謝

Answer 1

這是因爲您使用的是img標籤沒有src屬性。 Chrome本質上是指示容器的大小，沒有任何內容。

如果您不想在定位標記之間放置圖像，請不要使用圖像標記。沒有必要在標籤之間放置任何東西。

Demo here.

Answer 2

可以在css使用div標籤background-image而不是使用img標籤。