نحوه قرار دادن دو div کنار هم که با کوچک شدن صفحه به پایین منتقل نشوند

masoudies · Jul 31, 2011

سلام خسته نباشید

من میخوام دو تا div رو کنار هم طوری تنظیم کنم که وقتی صفحه کوچیک میشه فقط اسکرول بشند و یه div منتقل نشه پایین اون یکی. روشش چطوریه؟ توی انجمن پیدا نکردم.

من این کار رو کردم اما مشکل داره.

PHP:

<body>
<div id="right"> </div>
<div id="left"> </div>
</body>

PHP:

#right{
	background-color:#00F;
	size:auto;	
	float:right;
	height:200px;
	max-width:1000px;
	min-width:700px;
	}
	
#left{

	background-color:#F00;
	width:300px;
	height:700px;
	float:left;	
}

تشکر

Domanjiri · Aug 2, 2011

سلام

بعید می دونم در این مورد قبلن بحثی نشده باشه! در هر حال...

بله، باید خصیصه ی float رو برای یکی right و برای دومی left قرار بدیم. برای رسیدین به اون چیزی که می خواین هر دو div رو داخل یه div دیگه با عرض ثابت قرار بدین.

PHP:

<html>
<head>
<style type="text/css" media="screen, print, projection">
	body,
	html {
		margin:0;
		padding:0;
		color:#000;
		background:#a7a09a;
	}
	#wrap {
		width:750px;
		margin:0 auto;
		background:#99c;
	}

	#main {
		float:left;
		width:500px;
		background:#9c9;
	}
	#sidebar {
		float:right;
		width:250px;
		background:#c9c;
	}

	</style>
</head>
<body>

<div id="wrap">
	<div id="main">
		<h2>Column 1</h2>
	</div>
	<div id="sidebar">
		<h2>Column 2</h2>
	</div>
</div>

</body>
</html>

موفق باشی