HTML Element Style How to - Float image to the right and text to the left

Question

We would like to know how to float image to the right and text to the left.

Answer


<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
.column2>img {
  float: right;
  margin: 0 0 10px 10px;
  width: 100px;
  border-radius: 50%;
}<!--from   w w w. j av a  2  s.  com-->
</style>
</head>
<body>
  <div class="column2">
    <img src="http://www.java2s.com/style/download.png" />
    <p class="aboutdes">Lorem ipsum dolor sit amet, consectetur
      adipiscing elit. Vivamus varius in ligula eget bibendum. Nam faucibus
      lorem quis mattis rhoncus. Phasellus iaculis felis quis massa
      molestie rutrum. Praesent elit nisi, facilisis vitae sem eget,
      faucibus imperdiet elit. Mauris mauris arcu, consectetur in
      consectetur ac, scelerisque sit amet ante. Nulla ac consequat nibh.
      Nullam congue massa ipsum, nec venenatis augue semper non. Morbi
      hendrerit turpis est, eget luctus nulla facilisis sed! Praesent non
      rhoncus ipsum. Pellentesque lacinia scelerisque rutrum? Donec posuere
      imperdiet ligula, eget tincidunt metus!</p>
    .
  </div>
</body>
</html>

The code above is rendered as follows: