помогите, пожалуйста, со стилями

Здравствуйте.

Стили item и desc не прописаны в файле стилей.

На странице выводится картинка, под ней текст, потом новая картинка, под ней текст.

Код в странице

<div class="item"> 

<img src="/img/60x60-rett.jpg" width="200" height="200" alt="" title="" />

<div class="desc2">

<ul>

<li><a href="atlas-60x60-rett.php">burn-iron</a></li>

<li>название рус</li>

<li>название анг</li>

</ul>

</div></div>



<div class="item"> 

<img src="/img/60x60-rett.jpg" width="200" height="200" alt="" title="" />

<div class="desc2">

<ul>

<li><a href="atlas-60x60-rett.php">burn-iron</a></li>

<li>название рус</li>

<li>название анг</li>

</ul>

</div></div>

НО НУЖНО сделать чтобы текст был справа от картинки, потом перевод строки и новая картинка с текстом справа от неё.

Прописал стили item и desc, но теперь картинка, справа от неё текст, потом ещё правее и чуть ниже след картинка, ещё правее текст и т.д.

Вообщем картинки и текст идут по диагонали. Как решить проблему?

вот что в стилях

.item {

	width: 100%;

	position: relative;

	margin: 10px 0;

	font-size: 13px;

	padding: 3px 0 0 0;

}

/* .item .im { float: left; width: 90px; padding: 2px 0 0 0; } */



.item .body {

	overflow: hidden;

	font-size: 13px;

	line-height: 13px;

	padding: 3px 0 0 10px;

}

.item a {

	font-size: 16px;

	padding: 0px 0 3px 0;

	font-family: 'Trebuchet MS';

}

.item UL { list-style: none;}



.item IMG { float: left; padding: 2px 8px 0 0; overflow:hidden; zoom:1; display:block;} /*сверху справа снизу слева*/

/*.item A {font-size: 16px;} */

.desc {overflow:hidden;zoom:1;}

.clear {clear:both;}

ps если после каждой картинки с текстом ставить <div class=\"clear\"></div> то почему то большущий пробел (10-15 строк перевод) между первой и второй картинкой.

ps