Aligning images in css

[Gearspro]

I did see a similar post on here about this, but it with mixed with javascript also and I found it confusing.

So if someone could help it would be much appreciated.

I wish to align my icons on my contact page like this:

http://samayr.es/contacts.png (it's easier to just show a picture than to explain)

but for some reason I can only get them to be centered all in line underneath one another.

and heres the html version as shown with my problem.

http://samayr.es/contact/contact.html

any ideas on correcting this problem? please and thank you c:

[twiss]

As a start, you need to give them display:inline-block; and a width (probably 150px), and the parent should have text-align:center; .

[drjohn]

Create a div, give it a class name, a width equal to the four icons plus any padding between them, and margin :auto
float the img / icon in the div left.
add the text in another div below this (same class name)
add the next set of icons in another div below this. (same class name)