Откуда берется полоса на «зарепитеном» элементе?

Question

[Dmitry Nabozhev]

Сверстал страницу, там 5 секций и каждая имеет волнистый бордер сверху и с низу.
Все нормально сделал зарепитил волну одну. Результат везде такой prntscr.com/ai2ewu
Но при просмотре в разных разрешениях и устройствах появляется какая-то полупрозрачная полоса такая:
prntscr.com/ai2g2s
Идет полоса выше волны, там ведь прозрачный Png и после волны ничего быть не может, откуда там берется это. На планшете тоже самое иногда есть иногда нет, при масштабировании появляется/исчезает.

Пробовал дергал margin-top и height + увеличил прозрачную область в png вроде пропало, но на другом разрешении появилось) нет сил уже. Подскажите природу такого явления или другой способ реализации такой волны.

Код стиля :

.howitwork
{
	background-color:#dbe6ec
}

.howitwork:before
{
	content:" ";
	display:block;
	position:absolute;
	margin-top:-25px;
	height:25px;
	width:100%;
	background-image:url(../img/volna_white.png);
	background-repeat:repeat-x;
	background-position:top
}

Comments

[AntohaRomaha]

И что решения так и не нашли??? ТАКАКАЯ ЖЕ ПРОБЛЕМА! Только у меня другая своя волна! ВСЮ НОЧЬЮ БЬЮСЬ:(((

Answer 1

[edk55]

А что, если ты эту волну так сделаешь? prnt.sc/ai5xzz

Comments

[Dmitry Nabozhev]

Оно так и есть, вот prntscr.com/ai7w1c

[edk55]

Dmitry Nabozhev: Эта полоса появляется только при масштабировании?

[Dmitry Nabozhev]

именно

[edk55]

Dmitry Nabozhev: попробуй избавиться от масштабирования. frontender.com.ua/mobile-web/wtf-viewport
Читать про scale

Answer 2

[Uwe_Boll]

значит вырезал херово

Comments

[Dmitry Nabozhev]

проверял

Answer 3

[dzenn]

volna_white.png? вы серьёзно?

я думаю в инспекторе можно дописать и убрать какие-то свойства которые этому способствуют

Answer 4

[Dmitry Nabozhev]

В общем все нормально, я вижу такие полосы и в других сайтах, которые применяли волну)

Answer 5

[AntohaRomaha]

Такая же фигня, не решаема до сих пор что ли?