Tuesday, July 27, 2010
This code snippet provides a CSS and HTML to place image and text side by side in a HTML page.
The CSS.
.mydiv {background: lightblue; width:250px; height: 250px;}

.myimage {float:left; width:100px; height:150px; margin:5px;}
The HTML.
<html>

    <head>

        <link rel='stylesheet' href="testme.css">

    </head>

    <body>

    <div class="mydiv">

        <img class="myimage" src="testme.jpg"/>

        Hi. Image with text on the same line.

        Hi. Image with text on the same line.

        Hi. Image with text on the same line.

        Hi. Image with text on the same line.

        Hi. Image with text on the same line.

        Hi. Image with text on the same line.

        Hi. Image with text on the same line.

        Hi. Image with text on the same line.

    </div>

    </body>

</html>
The output.

24 comments :

  1. I had a keen interest to use CSS and I am using it from last 5 days..thank you for the post..Custom Software Development Services

    ReplyDelete
  2. thnx dude its really helpfull... :D

    ReplyDelete
  3. nice tutorial ..

    ReplyDelete
  4. Excellent blog!. I was looking for html tutorials and I landed your website through google search. I found your blog very interesting.

    ReplyDelete
  5. Nice tutorial, This is very useful, Thanks for sharing.

    html training in chennai

    ReplyDelete
  6. hi welcome to this blog.really you have post an informative blog.it will be really helpful to many peoples.thank you for sharing this blog.
    Salesforce Training

    ReplyDelete
  7. This comment has been removed by a blog administrator.

    ReplyDelete
  8. Header - The header tag contains contain the section's heading. The heade> element can also be used to wrap a section's table of contents, a search form, or any relevant logos.
    StartPoint

    ReplyDelete
  9. Existing without the answers to the difficulties you’ve sorted out through this guide is a critical case, as well as the kind which could have badly affected my entire career if I had not discovered your website.selenium training in bangalore.
    digital marketing training in chennai

    ReplyDelete
  10. Very good informative article. Thanks for sharing such nice article, keep on up dating such good articles.

    ORACLE CLOUD SERVICES FOR APPLICATION DEVELOPMENT | MASSIL TECHNOLOGIES

    ReplyDelete
  11. REALLY VERY EXCELLENT INFORMATION. I AM VERY GLAD TO SEE YOUR BLOG FOR THIS INFORMATION. THANKS FOR SHARING. KEEP UPDATING.

    NO.1 SYSTEM INTEGRATION SERVICES | SYSTEM INTEGRATION MIDDLEWARE

    ReplyDelete
  12. Your good knowledge and kindness in playing with all the pieces were very useful. I don’t know what I would have done if I had not encountered such a step like this.

    Digital Marketing Training in chennai

    ReplyDelete

Contact Form

Name

Email *

Message *

Back to Top