css - manipulating repeat linear gradient -

i want recreate line pattern similar uber's brand website: https://brand.uber.com/ - in particular repeating lines can see in background: http://prntscr.com/etius6

to so, thought of using repeating-linear-gradient css.

.container {    background-image: repeating-linear-gradient(90deg,  #d8d8d8, #d8d8d8 1px,  white 0, white 16.666666667%);      min-height: 5000px;       max-width:904px;    margin:0 auto;  }

<div class="container">      </div>

, here's fiddle: https://jsfiddle.net/jz7ag7l1/

it works want tweak bit. want eliminate first bar, try makes gradient disappear or weirdly becomes thinner, leaving bars now.. background-position has no effects well.

any great, thanks

if inner div not problem, hiding left grey line behind , outer div overflow:hidden works:

.container .inner {   background-image: repeating-linear-gradient(90deg,  #d8d8d8, #d8d8d8 1px,  white 0, white 20%);   min-height: 5000px;   margin-left: -1px; } .container {   max-width: 904px;   margin:0 auto;   overflow: hidden; }  <div class="container"><div class="inner"></div></div> 

https://jsfiddle.net/jz7ag7l1/1/