لخبراء css ساعوني في جعل هذا التصميم يظهر في الوسط + ...

**soptimes.com** · 13-11-2010

السلام عليكم

أنا ليس لدي خبرة كافية ب css لذلك اود منكم المساعدة بجعل هذا التصميم في الوسط بالإضافة أريده, أن يظهر على الشاشة بكاملها, 100% يعني لا يبقى جانب أبيض

هذا هو التصميم

كود PHP:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>footer</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Save for Web Styles (footer.psd) -->
<style type="text/css">
<!--
#_____01 {
 position:absolute;
 left:0px;
 top:0px;
 width:1000px;
 height:60px;
}
#id1-01_ {
 position:absolute;
 left:0px;
 top:0px;
 width:206px;
 height:60px;
 background:url(images/1_01.png);
}
#id1-02_ {
 position:absolute;
 left:206px;
 top:0px;
 width:607px;
 height:60px;
 background:url(images/1_02.png);
 color:white;
 font-size:15px;
 font-family:Tahoma;
}
#id1-03_ {
 position:absolute;
 left:813px;
 top:0px;
 width:187px;
 height:60px;
    background:url(images/1_03.png);
}
a{
text-decoration:none;
color:white;
}
-->
</style>
<!-- End Save for Web Styles -->
</head>
<body style="background-color:#FFFFFF;">
<!-- Save for Web Slices (footer.psd) -->
<div id="_____01">
 <div id="id1-01_" style="right: 794px">
 </div>
 <div id="id1-02_">
  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <br />
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  
  <a href="#">حاليا بالموقع </a>- <a href="#">الكوكيز</a> - <span lang="en-us"><a href="#">privacy policy</a> -</span> 
  <a href="#">أرشيف المنتديات</a> - <a href="#">الاتصال بنا</a> - <a href="#">الوقت<a/>
</div>
 <div id="id1-03_">
 </div>
</div>
<!-- End Save for Web Slices -->
</body>
</html>

بالمرفقات ستجدون صور التصميم

و المرجوا المساعدة جزاكم الله خيراً
و تحياتي

**اسلام مصطفي** · 13-11-2010

تم اضافة صورة للخلفية
لا اعلم اذا كان مظبوطا علي جميع مقاسات الشاشات و لكن بإذن الله يساعدك حد افضل مني

**محمد الثقفي** · 14-11-2010

كود css لحذف الحدود من الجوانب وجعل التصميم يتمدد بالكامل بدو حواف

كود:

<style type="text/css">
html, body {
padding: 0px;
margin: 0px;
}
</style>

كود لجعل التصميم في الوسط اذا كان داخل <div>

كود:

<div style="width: 970px; margin: 0 auto;">
text
</div>

موفق ان شاءالله

**soptimes.com** · 17-11-2010

الحل الأول جعل الصفحة عريضة أكثر

و الحل الثاني لم يتغير شيء

المرجوا المساعدة و تجريبه قبل اعطاء الحل
جزاكم الله خيراً

**اسلام مصطفي** · 17-11-2010

المشاركة الأصلية كتبت بواسطة soptimes.com مشاهدة المشاركة

الحل الأول جعل الصفحة عريضة أكثر

و الحل الثاني لم يتغير شيء

المرجوا المساعدة و تجريبه قبل اعطاء الحل
جزاكم الله خيراً

جرب حلي ؟

**soptimes.com** · 17-11-2010

المشاركة الأصلية كتبت بواسطة اسلام مصطفي مشاهدة المشاركة

جرب حلي ؟

جربته اخي الم تقرأ ردي

الحل الذي ـطيتني جعل الصفحة عريضة

المرجوا تجربة الحل قبل اعطائه لي

**ahmadmarafa** · 17-11-2010

أخى الكريم صراحة لم أفهم ماذا تقصد بأن تجعلة بدون مسافة بيضاء فى الحواف وفى الوسط ؟
على كل , إن أردت أن توسط

كود HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>footer</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Save for Web Styles (footer.psd) -->
<style type="text/css">
<!--
*{padding:0;margin:0;}
#container{
    position:relative;
         margin:0 auto 0;
       width:1000px;
}
#_____01 {
	position:absolute;
	left:0px;
	top:0px;
	width:1000px;
	height:60px;

}

#id1-01_ {
	position:absolute;
	left:0px;
	top:0px;
	width:206px;
	height:60px;
	background:url(images/1_01.png);
}

#id1-02_ {
	position:absolute;
	left:206px;
	top:0px;
	width:607px;
	height:60px;
	background:url(images/1_02.png);
	color:white;
	font-size:15px;
	font-family:Tahoma;

}

#id1-03_ {
	position:absolute;
	left:813px;
	top:0px;
	width:187px;
	height:60px;
    background:url(images/1_03.png);

}
a{
text-decoration:none;
color:white;
}

-->
</style>
<!-- End Save for Web Styles -->
</head>
<body style="background-color:#FFFFFF;">
<!-- Save for Web Slices (footer.psd) -->
<div id="container">
<div id="_____01">
	<div id="id1-01_" style="right: 794px">
	</div>
	<div id="id1-02_">
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		<br />
				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		

		<a href="#">حاليا بالموقع </a>- <a href="#">الكوكيز</a> - <span lang="en-us"><a href="#">privacy policy</a> -</span> 
		<a href="#">أرشيف المنتديات</a> - <a href="#">الاتصال بنا</a> - <a href="#">الوقت<a/>

</div>
	<div id="id1-03_">
	</div>
</div>
</div>
<!-- End Save for Web Slices -->
</body>
</html>

**يوسف سامي** · 22-11-2010

هل تقصد يكون متوسط وعلى عرض الصفحة كلها ؟

**soptimes.com** · 10-01-2011

نعم اخي اريد للتصميم يكون ممدد على كامل الصفحة حتى لو تغيرت مقايسس الشاشة
من يعرف الحل لا يبخل علينا

**Blank** · 10-01-2011

السلام عليكم
بدلاً من التعديل على الصفحة، قمت بإعادة كتابتها وتوزيع العناصر بشكل أبسط.
قم بتجربة المرفق.

**soptimes.com** · 17-01-2011

المشاركة الأصلية كتبت بواسطة Blank مشاهدة المشاركة

السلام عليكم
بدلاً من التعديل على الصفحة، قمت بإعادة كتابتها وتوزيع العناصر بشكل أبسط.
قم بتجربة المرفق.

تسلم ايدك يا بطل

الموضوع: لخبراء css ساعوني في جعل هذا التصميم يظهر في الوسط + ...

أدوات الموضوع

بحث في الموضوع

لخبراء css ساعوني في جعل هذا التصميم يظهر في الوسط + ...

المواضيع المتشابهه

عرض صورة اثناء تحميل الصفحة وبعد التحميل يظهر التصميم !كيف!

لخبراء التصميم ...

ضوابط المشاركة