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.

11 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. Very Nice Blog I like the way you explained these things. I’ve been looking for ways to improve my website and overall rankings.I hope your future article will help me further.Take SEO Training in Chennai to mould yourself.

    ReplyDelete

Contact Form

Name

Email *

Message *

Back to Top