how to display image and left side and text right side in html

Question

Hi in the below code i want to display images left side and text should be right side.but now it's displaying down of the image .and as well as 3 images in a single line same like image with text.

 .specilites{ width: 1050px; margin: 0 auto 0 auto; padding-top:7px; color:#008080; font-size:30px; } .specilites img{ background-repeat: no-repeat; background-size: cover; overflow:hidden; -webkit-border-radius:50px; -moz-border-radius:50px; border-radius:50px; width:90px; height:90px; display:inline-block; border: 1px solid #008080; } .specilites h1{ width: 1050px; margin: 0 auto 0 auto; padding-top:7px; color:#008080; font-size:30px; } .specilites td{ font-size:15px; display:block; } 

 <div class="specilites"> <table> <tr> <td> <img src="http://lorempixel.com/400/200"/> Accident & Emergency Care</td> <td><img src="http://lorempixel.com/400/200"/></td> <td> <img src="http://lorempixel.com/400/200"/><td> </tr> <img src="http://lorempixel.com/400/200"/> <img src="http://lorempixel.com/400/200"/> <img src="http://lorempixel.com/400/200"/> <img src="http://lorempixel.com/400/200"/> <img src="http://lorempixel.com/400/200"/> <img src="http://lorempixel.com/400/200" /> <img src="http://lorempixel.com/400/200" /> <img src="http://lorempixel.com/400/200" /> <img src="http://lorempixel.com/400/200" /> <img src="http://lorempixel.com/400/200" /> <img src="http://lorempixel.com/400/200" /> <img src="http://lorempixel.com/400/200" /> <img src="http://lorempixel.com/400/200" /> </table> </div> 

Answer 1

Assuming you want 3 images in a single line and image left with text right to that. DEMO Here

.specilites{
    width: 1050px;
    margin: 0 auto 0 auto;
    padding-top:7px;
    color:#008080;
    font-size:30px;
}
.specilites img{

    background-repeat: no-repeat;
    background-size: cover;
    overflow:hidden;
    -webkit-border-radius:50px;
    -moz-border-radius:50px;
    border-radius:50px;
    width:90px;
    height:90px;
    display:inline-block;
     border: 1px solid #008080;
}
.specilites h1{
    width: 1050px;
        margin: 0 auto 0 auto;
        padding-top:7px;
        color:#008080;
        font-size:30px;
    }
    .specilites td{
        font-size:15px;
     /*    display:block;*/

    }
<div class="specilites">
    <table>
        <tr>
            <td><img src="http://lorempixel.com/400/200"/></td>
            <td>Accident & Emergency Care</td>
            <td><img src="http://lorempixel.com/400/200"/></td>
            <td><img src="http://lorempixel.com/400/200"/></td>
        </tr>
        <tr>
            <td><img src="http://lorempixel.com/400/200"/></td>
            <td><img src="http://lorempixel.com/400/200"/></td>
            <td><img src="http://lorempixel.com/400/200"/></td>
        </tr>
         <tr>
            <td><img src="http://lorempixel.com/400/200"/></td>
            <td><img src="http://lorempixel.com/400/200"/></td>
            <td><img src="http://lorempixel.com/400/200"/></td>
        </tr>
         <tr>
            <td><img src="http://lorempixel.com/400/200"/></td>
            <td><img src="http://lorempixel.com/400/200"/></td>
            <td><img src="http://lorempixel.com/400/200"/></td>
        </tr>
         <tr>
            <td><img src="http://lorempixel.com/400/200"/></td>
            <td><img src="http://lorempixel.com/400/200"/></td>
            <td><img src="http://lorempixel.com/400/200"/></td>
        </tr>

      </table>
</div>