Css background fix - html

Question

I can not understand how to remove the top and bottom of the strip , and that would be in other places it was normal .
<div class="ma_linenums">
<div class="ma_linenum">
<div class="num">1</div>
<div class="text">Provide ship to zip code</div>
</div>
<div class="ma_linenum">
<div class="num">2</div>
<div class="text">Select Box-n-Go storage containers to be shipped</div>
</div>
<div class="ma_linenum">
<div class="num">3</div>
<div class="text">Confirm who will be receiving the shipment</div>
</div>
<div class="ma_linenum">
<div class="num">4</div>
<div class="text">Confirm all the information provided</div>
</div>
<div class="ma_linenum">
<div class="num">5</div>
<div class="text">Box-n-Go representative will calculate the shipping costs and provide you with a quote</div>
</div>
<div class="ma_linenum">
<div class="num">6</div>
<div class="text">Once we recive your approval, we will shio the items to you</div>
</div>
<div class="clearfix"></div>
</div>
https://jsfiddle.net/h49hsx89/1/
Need result: http://cs624027.vk.me/v624027836/285ae/thJS61-9ct8.jpg

Answer 1

Solution: https://jsfiddle.net/x3596yn4/3/
The following will fix it:
.ma_linenums {
background: url("http://cs624027.vk.me/v624027836/2858b/qWSCfsvYM3I.jpg") repeat-y;
background-size: 1px 90%;
background-position: 27px;
background-repeat: no-repeat;
}
Originally your picture was repeating the entire height of its container. I restrict this via background-repeat: no-repeat and manually set the height to 250px
If you want to make the height of the line resize to the content then change background-size: 1px 250px; to background-size: 1px 90%;

Answer 2

I have made some changes in the code, and use pseudo class instead to obtain the desire result. Check out this jsfiddle: https://jsfiddle.net/h49hsx89/4/
Here is the css I added to make it possible:
.ma_linenum:before {
content : '';
background: url("http://cs624027.vk.me/v624027836/2858b/qWSCfsvYM3I.jpg") repeat-y;
height:22px;
width:1px;
display:block;
position:absolute;
left:13px;
top:-10px;
}
.ma_linenum:first-child:before {content:'';background:none}