html - Vertical align text to image -

this question has answer here:

• vertically align text next image? 20 answers

i've got image floated left, , want vertically align text image text sits in middle of image.

any ideas how it's done? have tried many solutions provided on site, none working me.

as shown below, this solution not work.

/* limiting outter width illustrate problem */    .cart-helper-outer {    width: 200px;  }  /* makes helper items full width */    .cart-helper-inner {    width: 100%;    float: left;  }  /* displays image left of text */    .cart-helper-inner img {    max-width: 50px;    float: left;    margin-right: 2.5%;    vertical-align: middle; /* not work*/  }  .cart-helper-inner p {    vertical-align: middle; /* doesn't work*/  }

<div class="cart-helper-outer">    <div class="cart-helper-inner">      <img src="http://placehold.it/50x50" />      <p>secure checkout bank grade encryption</p>    </div>    <div class="cart-helper-inner">      <img src="http://placehold.it/50x50" />      <p>secure checkout bank grade encryption</p>    </div>    <div class="cart-helper-inner">      <img src="http://placehold.it/50x50" />      <p>secure checkout bank grade encryption</p>    </div>  </div>

/* limiting outter width illustrate problem */    img{  margin:15px 0px;  }  .cart-helper-outer {    width: 200px;  }  /* makes helper items full width */    .cart-helper-inner {    width: 100%;    float: left;  }  /* displays image left of text */    .cart-helper-inner img {    max-width: 50px;    float: left;    margin-right: 2.5%;    vertical-align: middle; /* not work*/  }  .cart-helper-inner p {    vertical-align: middle; /* doesn't work*/  }

<div class="cart-helper-outer">    <div class="cart-helper-inner">      <img src="http://placehold.it/50x50" />      <p>secure checkout bank grade encryption</p>    </div>    <div class="cart-helper-inner">      <img src="http://placehold.it/50x50" />      <p>secure checkout bank grade encryption</p>    </div>    <div class="cart-helper-inner">      <img src="http://placehold.it/50x50" />      <p>secure checkout bank grade encryption</p>    </div>  </div>