aligning images

What's the best way to align images ina list. I am trying something like and I expect them to see aligned vertifically below each ot开发者_如何学运维her but the text kinda wraps aorund the image.

• text
• image
• text

just using float left, and it's work the code will like this

HTML:

• text here

<li>
   <img src="" />
    text here
</li>
</ul>

and for CSS:

li img {float:left; vertical-align: top;}

• sorry for my bad typing, i still learning how to typing code here..
• if the code still unclear please inform me, i will upload my full code to my host.
• if give vertical align to make the bullet numbering goes to upper of the image

To remove text, put all text in floating elements and put clear: both in images. With this, the text will not wrap image.

I could be wrong but it sounds like you're using floats. There's no need.

CSS:

#mylist li{ display: block }

HTML:

<ul id="myLst">
  <li>text</li>
  <li><img src="my-image.png" alt="" /></li>
  <li>text</li>
</ul>

That will align each List Item on top of one another.

Alternatively, you could use Foundation or Bootstrap with their grids. Then you can align images and text in a row using columns. But the quick and simple solution would be to use:

img{display:block;}