Как избавиться от линии волос между двумя div в html/css?

Question

У меня есть два элемента как можно ближе к ним. Если вам интересно, первый - это скрипт прокрутки к вершине, который пользователь может щелкнуть, а под ним - плоский фон. Эта волоса действительно раздражает меня.

Любая помощь приветствуется!

/*SCROLL TO TOP*/ 
 
.scroll-top-wrapper img{ 
 
\t width: 134px; 
 
\t display: block; 
 
\t margin-left: auto; 
 
\t margin-right: auto; 
 
\t cursor: pointer; 
 
} 
 

 
.border_background{ 
 

 
\t background: #162a53; 
 
\t height: 416px; 
 
} 
 

 
...

\t <!-- SCROLL TO TOP --> 
 
\t <div class="scroll-top-wrapper"> 
 
\t \t <span class="scroll-top-inner"> 
 
\t \t \t <img src="../images/misc/scroll_to_top.svg" onmouseover="this.src='../images/misc/scroll_to_top_hover.svg';" onmouseout="this.src='../images/misc/scroll_to_top.svg';" /> 
 
\t \t </span> 
 
\t </div> 
 

 
\t <!-- LIGHT-COLORED BORDER --> 
 
\t <div class="border_background"> 
 
     ....

Answer 1

Попробуйте добавить файл сброса. или маржа: 0; Помните, что теги html имеют правила стиля по умолчанию, поэтому вам нужно избавиться от них.

Answer 2

Я думаю, что проблема в вашем образе. Когда вы отредактировали это изображение, есть небольшая линия волос, оставленная в исходном изображении. Поэтому попробуйте переделать изображение и удалить эту линию волос.