Проблема с позиционированием <div>

[Alex&R]

Делаю сайт с помочу <div> тегов и столкнулся с такой проблемкой. Сначала код:

<div id="top_l">
	  <h3>Top1</h3>
</div>

<div id="top_c">
	  <h3>Top2</h3>
</div>

<div id="top_r">
	  <h3>Top3</h3>
</div>

СSS:

#top_l { width: 250px; margin: 5px 5px; background: #eee;}
	#top_l h3 { text-align: center; }

#top_c { width: 250px; margin: 5px 300px; background: #eee;}
	#top_c h3 { text-align: center; }

#top_r { width: 250px; margin: 5px 600px; background: #eee;}
	#top_c h3 { text-align: center; }

А проблема в том, что Тор1, Тор2, Тор3 выводятся, как бы то пояснить... лестницей, а мне нужно что бы на одной линии. Что не так?

[sigma77]

Alex&R,

Всё так. Это нормальное поведение блоков в потоке. Марджинами, ты только увеличиваешь горизонтальные отступы.

Если хочешь разместить свои блоки горизонтально читай про свойства float и position, а также Верстка с помощью слоев

Edited June 2, 2010 by sigma77