Advertisement
PayneLess_Designs

Image - Left, Right & Center

Jun 26th, 2013
75
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 0.97 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en"><head>
  3. <title>Image - Left, Right &amp; Center</title>
  4. <meta charset="utf-8">>
  5. <meta name="created" content="Mon, 12 Oct 2009 17:26:55 GMT">
  6. <meta name="description" content="">
  7. <meta name="keywords" content="">
  8. <style>
  9. * { margin: 0; padding: 0; border: 0; }
  10. h1 { text-align: center; }
  11. .imageWrap {
  12. width: 50%; height: 120px;
  13. margin: 3% auto;
  14. }
  15.  
  16. #imageLeft {
  17. float: left;
  18. width: 160px; height: 120px;
  19. }
  20.  
  21. #imageCenter {
  22. display: block;
  23. width: 160px; height: 120px;
  24. margin: 0 auto;
  25. }
  26.  
  27. #imageRight {
  28. float: right;
  29. width: 160px; height: 120px;
  30. }
  31. </style>
  32. </head>
  33. <body>
  34. <h1>Image - Left, Right &amp; Center (Inline CSS)</h1>
  35. <div class="imageWrap">
  36.  
  37. <img id="imageLeft" src="http://i.imgur.com/C8PiY.jpg" title="Left" alt="Waves">
  38.  
  39. <img id="imageRight" src="http://i.imgur.com/C8PiY.jpg" title="Right" alt="Waves">
  40.  
  41. <img id="imageCenter" src="http://i.imgur.com/C8PiY.jpg" title="Center" alt="Waves">
  42.  
  43. </div>
  44. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement