نحوه نمایش متن در مقابل آیکن

[yasharhi]

طبق عکس زیر من می خواهم یک متن رو در مقابل آیکن ( دقیقا در وسط ) قرار بدم . اصولی ترین روش برای این کار چیه ؟
1- از بوت استرپ استفاده می کنم
2- می خواهم در هنگام نمایش در انواع نمایشگر ها و موبایل و تبلت به هم نریزه
3- دقیقا متن در وسط آیکن قرار بگیره ( مشابه شکل زیر )

http://8pic.ir/images/wptha7x1aokz6gvnewpe.png

[H:Shojaei]

کلاس inline بهشون بدین و بالا پایین بودنشون رو هم با margin padding تنظیم کنید...

[yasharhi]

این کار رو انجام دادم ولی نتیجه نداد .

<span class="block1 ">

<img src="../2px Colorful/Social icons by dreamstale (11).png" width="48" height="48" alt="#" class="float-left-1 " >

<h4 class=" up-4 "> powerfull firewall </h4>
</span>
<p class="clear-b">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vestibulum, urna id interdum congue, tortor leo ornare metus. </p>








.block1{
display: inline;
}

[H:Shojaei]

<span class="">
<img src="../2px Colorful/Social icons by dreamstale (11).png" width="48" height="100" alt="#" class="" style='vertical-align:middle;height:100px;'>
<h4 style="display:inline-block"> powerfull firewall </h4>
</span>

[yasharhi]

<span class="">
<img src="../2px Colorful/Social icons by dreamstale (11).png" width="48" height="100" alt="#" class="" style='vertical-align:middle;height:100px;'>
<h4 style="display:inline-block"> powerfull firewall </h4>
</span>

خیلی ممنون . مشکلم حل شد