How to have image and text side by side

 How to have image and text side by side:




image and text side by side
Lots of people are asking how they can put image and text side by side. Just make sure you are using style and classes properly. 

<html>
<title>
How to have image and text side by side
</title>
<style>
.icon {
 margin-left:2%;
float:left; 
height:60px;
width:100%; 
} 

.container2 {
    width:auto;
    height:auto;
    padding:1%;
    float:left;
}
h4{margin:0}
.left {float:left;width:60px;}
.right {float:left;margin:0 0 0 5px;width:215px;}

</style>
<body>


</body>

</html>

<div class='container2'>
        <div class="left">
            <img src='https://images-na.ssl-images-amazon.com/images/I/31ArOQ2bqHL.jpg' class='icon'>
        </div>  
    <div   class="right" >
    <h4>Twitter</h4>
    <div style="font-size:.7em;width:180px;float:left;">Twitter is an American microblogging and social networking service
    <br><b>CEO: </b>Parag Agrawal</div>
    </div>
</div>


Related Posts:

  • Nested Unordered List with Attribute We have learned Unordered list. We can define the bullet by using the attribute TYPE. Generally we use SQUARE, CIRCLE, and DISK bullet. Here is an example: <HTML> <HEAD>     <TITLE> Example… Read More
  • Video TagThis is a new tag for HTML 5. This tag might not work in older browsers. We need some attributes for this tag, Source, Type, Width ,Height and Control. We need to tell the browser where is the source of the video and the type… Read More
  • Full HTML Tag Part 2 Bold tags are only applicable for HTML 5 Normal 0 false false false EN-US X-NONE X-NONE MicrosoftInternetExplorer4 … Read More
  • BACKGROUND ELEMENTWith this element we can change the background with image. For this we can use JPG, PNG, GIF,JPEG image. In the beginning we have said we need to keep HTML files in a folder. If you didnt do that yet, now its time to do that.… Read More
  • Complete Index HTML Tags Part 1 *** Bold tags are only available for HTML5 <! --.. --> Define Comment <!DOCTYPE> Define the document type <a> Define a hyperlink <abbr> Define Abbreviation or … Read More

0 comments:

Post a Comment