Как удалить строку, показанную дорожками клипов на высоких разрешениях

Question

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

вот CSS для пути клипа:

.clearflowptr { 
    margin-bottom: 40px; 
    margin-top: 40px; 
    background: white; 
    height: 50px; 
    width: 100%; 
    -webkit-clip-path: polygon(0 0, 46% 0, 50% 100%, 54% 0, 100% 0, 100% 100%, 0 100%); 

margin-bottom и margin-top просто добавить интервал к элементу. Я пробовал играть с padding, но безрезультатно.

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

Answer 1

Вы можете попробовать это вместо использования clip-path, если это не требование.

div{ 
 
    background-color: #0b8192; 
 
    width: 100%; 
 
    height: 15px; 
 
    position: relative; 
 
} 
 

 
div:after{ 
 
    content: ''; 
 
    width: 0px; 
 
    height: 0px; 
 
    border: 40px solid #0b8192; 
 
    position: absolute; 
 
    top: 100%; 
 
    left: 0; 
 
    right: 0; 
 
    margin: auto; 
 
    border-right-color:transparent; 
 
    border-left-color:transparent; 
 
    border-bottom-color:transparent; 
 
}

<div> 
 

 
</div>