Проблема с выводом списка

[Alex&R]

HTML:

{% for hotel in hotels%}
	 <div id="rl">
		<ul>
			<li>
				<a href="{{ hotel.get_absolute_url }}"><img src="{{ MEDIA_URL }}{{ hotel.hotel_image }}" alt=""/></a>
				<h2><a href="{{ hotel.get_absolute_url }}">{{ hotel.name }}</a></h2>
				<strong>Город:</strong> {{ hotel.city }}<br/> 
				<strong>Цена:</strong> {{ hotel.price }}<br/>
				<strong>Адрес:</strong> {{ hotel.address }}<br/>
			</li>
		</ul>
	</div>

	{% endfor %}

<div>
		<a href="{% url hotel_list %}"><strong>Все отели</strong></a>
</div>	  

{% for institution in institutions%}	
	<div id="rr">
		<ul>
			<li>
				<a href="{{ institution.get_absolute_url }}"><img src="{{ MEDIA_URL }}{{ institution.institution_image }}" alt=""/></a>
				<h2><a href="{{ institution.get_absolute_url }}">{{ institution.name }}</a></h2>
				<strong>Город:</strong> {{ institution.city }}<br/>
				<strong>Тип:</strong> {{ institution.institution_type.all|join:", " }}<br/>
				<strong>Кухня:</strong> {{ institution.cuisine.all|join:", " }}<br/>
			</li>
		</ul>
	</div>

	{% endfor %}

CSS:

#rl { float: left; width: 290px; }
#rr { width: 290px; }
	#rl li, #rr li { list-style: none; border-bottom: 1px solid #eee; padding: 0; margin: 0; }
	#rl li a, #rr li a { padding: -1px 0 0 12px; color: #808080;  }

Когда добавляю в базу более одной записи, список выводится не сверху вниз, а слева на право. Мне нужно, что бы выводило в две колонки.

Подскажите в чем ошибка.