css - How do you float divs to the left? -
i'm trying better html coder, have decided away table layout. , use div layout instead, i'm getting issues positioning stuff using divs.
on page i'm trying add 3 images , text them, won't align using float, instead cascading.
here's markup:
<style> .left { float: left; } </style> </head> <body> <div class="left"> <img src="images/image.jpg" alt="" class="left" /> </div> <div> text </div> <div class="left"> <img src="images/image.jpg" alt="" class="left" /> </div> <div> text </div> <div class="left"> <img src="images/image.jpg" alt="" class="left" /> </div> <div> text </div> </body>
im hoping 1 of can point problem, (help! dont want go nasty tables! :))
here's picture:
edit: align them vertically
paul roub's answer closest, need space them up.
you don't need divs
@ all. try html:
<img src="images/image.jpg" alt="" class="left" /> text <img src="images/image.jpg" alt="" class="left" /> text <img src="images/image.jpg" alt="" class="left" /> text
and css put text aligned top of image:
.left { vertical-align: top; }
edit:
if want space between pictures css should like:
.left { vertical-align: top; margin-bottom: 10px; /* gives 10px of space @ bottom of image*/ }
here's jsfiddle of complete solution.
Comments
Post a Comment