Tengo problemas para alinear verticalmente la imagen de fondo con el texto, sin asignar valores constantes (y, por lo tanto, no automáticos y reutilizables) aheight oline-height. Me preguntaba si en realidad hay una manera de alinear verticalmente la imagen de bg de, digamos ya elemento, with its text without assigning constant values toaltura de la líneaoraltura?

Una demostración en vivo está disponible aquí:http://cssdesk.com/8Jsx2.

Aquí está el HTML:

<a class="">background-position: center</a>
<a class="contain">background-size: contain</a>
<a class="line-height">Constant line-height</a>

Y aquí está el CSS:

a {
  display: block;
  margin: 10px;
  width: 200px;
  padding-left: 34px;
  font-size: 14px;  

  background: url('http://cdn1.iconfinder.com/data/icons/freeapplication/png/24x24/Thumbs%20up.png');  
  background-repeat: no-repeat;
  background-position: 5px center;

  border: 1px solid black;
}

/* I don't want to use constant line-height */
.line-height {
    line-height: 24px;
}

/* I don't want to use this, because I want my bg image's size to stay intact */
.contain {
    background-size: contain;   
}