Align images horizontally

I don't know much about css. But I've been trying to align Google weather icons horizontally but no matter what I do they appear on page vertically. Any ideas on how to fix this problem?

 

Show us the URL to look into the code. Thanks

 

It sounds to me like you need to look into using floats. Try having a look here - http://css.maxdesign.com.au/floatutorial/

You should be able to find what you need there.

 

Code--><div id="weather"><div class="weatherIcon"><img src="http://www.google.com//ig/images/weather/partly_cloudy.gif"/><br/>Thu</div><div class="weatherIcon"><img src="http://www.google.com//ig/images/weather/sunny.gif"/><br/>Fri</div><div class="weatherIcon"><img src="http://www.google.com//ig/images/weather/sunny.gif"/><br/>Sat</div><div class="weatherIcon"><img src="http://www.google.com//ig/images/weather/sunny.gif"/><br/>Sun</div></div>

I removed the breaks "<br/>" and the weather icons still line up vertically.

 

Set the css for "weatherIcon" to 'display:inline-block;'

Barring any unforeseen weirdness or floats, that should fix it

 

I don't think so @ Serentripity

Without CSS it's hard to fix.

I would do it with an UL tbh.

 

Seeing that I don't know squat about css using the code above how would I implement that?

 

You have the code for that page? Post it please.

 

If you want to make an inline list (which you do) you need to look at floats, and you will have to use CSS... unless you use a table - but that's bad practise. If you read my link about floats you'd have it by now, but here is another one listing a variety of different types of lists. Have a look at the horizontal list section - http://css.maxdesign.com.au/listamatic/

 

<table>
<table width="60%" cellpadding="0" cellspacing="0" border="1">
<td><div class="weather">
<div class="weather">

<img src="http://www.google.com/ig/images/weather/sunny.gif" alt=""?>
<div>Fri</div>
74&deg; F
</div>
<div class="weather">
<img src="http://www.google.com/ig/images/weather/sunny.gif" alt=""?>
<div>Sat</div>
82&deg; F
</div>
<div class="weather">

<img src="http://www.google.com/ig/images/weather/sunny.gif" alt=""?>
<div>Sun</div>
85&deg; F
</div>
<div class="weather">
<img src="http://www.google.com/ig/images/weather/partly_cloudy.gif" alt=""?>
<div>Mon</div>
86&deg; F
</div>
</td></table>

I know, I'm using tables, and this isn't the original code I posted.