أنا عاوز أحد يساعدنى فى شئ صغير فى CSS هبلتنى على الاخر

السلام عليكم

أخوانى الاعزاء

دلواتى عندى مشكلة هى ليست كبيرة ولكن صغيرة فى شئ دلواتى أن عملت صفحة فيها 3 absolute الهيدر والقائمة اليمين والقائمة الشمال

وعملت واحدة relative فى وسط الصفحة بين القائمة اليمين والشمال والمشكلة الان أنى مش عارف أثبت هذة القائمة بحيث عند تغيير دقة الشاشة

يتحرك الجزء الذى فى وسط الشاشة أو الـ relative الذى فى الوسط يتحرك إلى اليمين وهذا مثال على ذلك بالصور .

هذا الشكل عندما كانت دقة الشاشة 1024 فى 768 .

أما هذا الشكل عندما تكون دقة الشاشة 800 فى 600 وهذة هى المشكلة التى أتكلم عليها .

هل شاهدتم المشكلة .

فى الصورة الاول كانت الدقة 1024 فكان الشكل طبيعى وكل شئ كما تم تصميمة

أما فى الصورة الثانية على الدقة 800 المربع الذى كان فى الوسط تمدد حتى غطى على المربع الذى كان فى اليمين

والان السؤال يتم تظبيط المربع الذى فى الوسط بحيث يتمدد مع دقة الشاشة ويكون فى مكانة فى الوسط لا يأخذ أماكن أخرى أو يغطى على مكان أخر فى الصفحة .

أما بالنسبة لكود الـ CSS :

body { background-color:#990000; margin: 0,0,0,0; padding: 0}



#right_menu	 { position:absolute; width: 160px; height: 100%; top: 144px; right: 0px;marginright:0px; padding: 0; border: thin; border-style: solid; border-color: #FFFFFF; 
			   background-color: #FF9900 }



#left_menu	 { position: absolute; width: 160px; height: 100%; top: 144px; left: 0px; margin-left: 0; 
					 border:thin; border-style: solid; border-color:#FFFFFF; background-color: #FF9900 }


--------------------------------------------------------------
الكود المسئول عن المربع الذى فى الوسط
#center_menu { position: relative; width: 660; height: 100%; top: 144px; left: 170px; margin: 0,0,0,0;
					   border: thick; border-style: groove; border-color: #FF0000; background-color:#993300 }
--------------------------------------------------------------	  
#Header		{ position: absolute; width: 100%; height: 135; margin-top: 0; border: thin; 
					border-style: solid; border-color: #FFFF00; background-image: url(heder_bg.gif) }

هذا كود الـ HTML

  

<html>
<head>
<title>Page</title>
<link rel="stylesheet" type="text/css" href="style.css">

</head>
<body>

<div id="Header">
<p align="center">
<img src="heder_banner.gif">
</p>
</div>

<div id="right_menu">

</div>
-----------------------------------
الكود المسئول عن المربع الذى فى الوسط
<div id="center_menu">
</div>
------------------------------------
<div id="left_menu">

</div>

</body>
</html>

هذة هى المشكلة وتمنى أحد يجاوبنى عليها

لى سؤال أخر وهو : ما هو الكود المخصص لتظبيط الصفحة فى التمدد أتوماتيكى على كل دقة شاشة.

أنتظر الاجابة على المشكلة والسؤال الثانى ........