Floating the image allows the text to flow around it : Image flow : Images HTML CSS TUTORIALS


HTML CSS TUTORIALS » Images » Image flow »

 

Floating the image allows the text to flow around it


 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Wrapping text around an image</title>
  <style type="text/css">
  .figure 
    float: left;
    margin-right: 1em;
    margin-bottom: .5em;
  }
  </style>
</head>

<body>
  
  <p><img src="images/pizza.jpg" width="180" height="110" class="figure" alt="A close-up of one of our delicious pizzas" /> 
  this is a text. this is a text. this is a text. this is a text. 
  this is a text. this is a text. this is a text. this is a text. 
  this is a text. this is a text. this is a text. this is a text. 
  this is a text. this is a text. this is a text. this is a text. 
  this is a text. this is a text. this is a text. this is a text. 
  </p>

</body>
</html>

 



HTML code for linking to this page:

Follow Navioo On Twitter

HTML CSS TUTORIALS

 Navioo Images
» Image flow