Vertical Align - List with “list-style-image”

Question

Neither googling nor browsing in SO helped me - hope someone here can solve this :

I have the following html :

ABC 1
         


        

Answer 1

I came up with something like that, which may save u some time HTML:

  
1
  
2
  
3

CSS:

.rozcestnik {
    list-style-type: none;
    padding: 0;
    margin: 2.5em 2em 0;
}

.rozcestnik li:before {
    background: url("icon.png") no-repeat scroll 50% 50% transparent;
    content: " ";
    display: block;
    height: 20px;
    left: -20px;
    position: absolute;
    top: 0;
    width: 20px;
}
.rozcestnik li {
    position: relative;
    padding-bottom: 5px;
    padding-left: 5px;
}

According to custom list-image, you'll probably just need to customize the top and size ":before" and padding of "li".

It works across all major browsers and the application IE8 and more.