سؤال بسيط فى الـ div

[فاشل كل العاده]

كيف يمكن عمل ديف متمدد مرن فوق على عرض الشاشه اينما كانت حجمها
لانى تعبت فى الوصول لهذه النقطه
مثال

#test-div{
	border:2px dashed #99CC00;
	padding:5px;
	width:340px;
	position:absolute;
	left:50%;
	top:50%;
	margin-left:-175px;
	z-index:2;
	margin-top:-100px;
}

ده فى الـ css اما فى البادى نفسـه بيكون على مقاس الـ width:340px
ويبقى محدود
ويكون المحتوى على هذا الشـكل

<div id="test-div" >
المحتوى
</div>

انا عايز اخليه مدد زي الـ التيبول لما اقوم انا بـ width:100% يبقى مرن معايه
لاكن بيكون مع نفسه :funny:
لازم احركه بالماوس ولازم انا اكبره واصغره وفى النتيجه بيكون مش مظبوط فى التصميم
جربت احذفها نقس الموضوع
ايه العمل

[فاشل كل العاده]

أخوانى السؤال صعب ولا ايه طيب ؟
ولا مفيش حل

[سطام سعد]

حاولت انا اساعدك في الحل رغم اني مبتدئ , لكن ماقدرت اوصل لشي معين , لعلي ارجع مره ثانيه ونشوف

ولكن لا يمنع ان ارفع الموضوع للإجابة عليه

[فاشل كل العاده]

حاولت انا اساعدك في الحل رغم اني مبتدئ , لكن ماقدرت اوصل لشي معين , لعلي ارجع مره ثانيه ونشوف

ولكن لا يمنع ان ارفع الموضوع للإجابة عليه

والله ردك يشرفنى ومحاولتك للمساعده اكنها وصلت
جزاك الله كل خير يارب
تقبل فائق الاحترام والتقدير
خالص الموده

[owner]

لم افهم ما مشكلتك بالضبط


لكن اذا كان بخصوص تمدد ديف معين .

قم بتحديد الـ

width:100%;

[فاشل كل العاده]

قبل ان اطرح الموضوع حاولت مرارا وتكررا فى التمدد ولكن
للاسف لا يتمدد نهائي

[سعد السيد احمد]

كنت أتمنى أن أساعدك لكن ماعندي خبرة كافية في css ودائما تجيني مشاكل مثل هذا لكن أهم شي أحاول و أدور على إجابة حتى ألاقي حل
بدور لك في المواقع إذا فيه حل لمشكلتك وبضعها هنا لما ألقى

[فاشل كل العاده]

كنت أتمنى أن أساعدك لكن ماعندي خبرة كافية في css ودائما تجيني مشاكل مثل هذا لكن أهم شي أحاول و أدور على إجابة حتى ألاقي حل
بدور لك في المواقع إذا فيه حل لمشكلتك وبضعها هنا لما ألقى

مشـكور اخ سـعد على المسـاعده وحابب اقولك مبـروك اراك فى نجاح باهر ما شاء الله فى الاجاكس
يارب توصل لعمل اسكربت ضخم كامل من الاجاكس ونفتجر بـك فى الوسط العربى والغربى
موفق والى الامام ان شاء الله

[فاشل كل العاده]

انا حابب اقـول لشـكرا جزيلا للاخ الى ارسل لي رسـاله
واقوله كلامتك مشـجعه لانهاء العمل
والله الموفق

[سعد السيد احمد]

مشـكور اخ سـعد على المسـاعده وحابب اقولك مبـروك اراك فى نجاح باهر ما شاء الله فى الاجاكس
يارب توصل لعمل اسكربت ضخم كامل من الاجاكس ونفتجر بـك فى الوسط العربى والغربى
موفق والى الامام ان شاء الله

إن شاء الله و شكرا لك على التشجيع

بالنسبة لمشكلتك
أنا حذفت الleft يلي كنت حاطه حتى تصير في منتصف الشاشة لانه بعد تكبيره بتصير كبيرة من مكان و من مكان ثاني فاضي
وحطيت العرض (width) 95% لأنه لما جربت على 100% صار أكبر من الصفحة وهذا أتوقع من الخصائص يل يحاطها مثل الإطارة

الكود بعد التعديل :

#test-div{
 border:2px dashed #99CC00;
 padding:5px;
 position:absolute;
 top:50%;
 z-index:2;
 margin-top:-100px;
 float:both;
 width:95%;
}

جربه و إنشاء الله يصير معك

[فاشل كل العاده]

إن شاء الله و شكرا لك على التشجيع

بالنسبة لمشكلتك
أنا حذفت الleft يلي كنت حاطه حتى تصير في منتصف الشاشة لانه بعد تكبيره بتصير كبيرة من مكان و من مكان ثاني فاضي
وحطيت العرض (width) 95% لأنه لما جربت على 100% صار أكبر من الصفحة وهذا أتوقع من الخصائص يل يحاطها مثل الإطارة

الكود بعد التعديل :

#test-div{
 border:2px dashed #99CC00;
 padding:5px;
 position:absolute;
 top:50%;
 z-index:2;
 margin-top:-100px;
 float:both;
 width:95%;
}

جربه و إنشاء الله يصير معك

اعتقد كده تمام اوى وبدأت الافكـار توصلنى
فعلا فى اكواد خطأ
والله جبـار موفق ومشـكور جدا ريحتنى الله يريحك

[محمد فؤاد]

إن شاء الله و شكرا لك على التشجيع

بالنسبة لمشكلتك
أنا حذفت الleft يلي كنت حاطه حتى تصير في منتصف الشاشة لانه بعد تكبيره بتصير كبيرة من مكان و من مكان ثاني فاضي
وحطيت العرض (width) 95% لأنه لما جربت على 100% صار أكبر من الصفحة وهذا أتوقع من الخصائص يل يحاطها مثل الإطارة

الكود بعد التعديل :

#test-div{
 border:2px dashed #99CC00;
 padding:5px;
 position:absolute;
 top:50%;
 z-index:2;
 margin-top:-100px;
 float:both;
 width:95%;
}

جربه و إنشاء الله يصير معك

يزداد العرض عن الصفحة لانه يحتسب العرض المحدد ( 100 % ) بالاضافه الى 10 بكسل أخرى لانك مستخدم padding:5px; ....

[Nile]

الأمر أبسط مما تتخيل ..


اعط الديف float:left وبهذا ستقوم الديف بتغيير خصائصها من التممد في المساحة الفارغة التي خارجها .. إلي التمدد علي حسب محتواها . ولا تنسي أن تحذف عرض الديف width:340، لأن بعض المتصفحات مثل الفاير فوكس وغيرها تقوم بقراءة العرض ولا يتم تغييره مهما حصل .. إذا كنت تريد العرض أن يكون هكذا ولكن يمتد في حالة ما اذا احتجت إلي تمدد قم باعطاءه min-width:340 ولكن لاحظ هذا لا يعمل علي الانترنت اكسبلورر لذا ستقوم بكتابة الآتي في الاستايل شيت

*width:340
min-width:340

الأولي بإضافة نجمة قبلها وهذه النجمة لا يتخطاها إلا الانترنت اكسبلورر .. بمعني أن السطر الاول لا يقرأه غير الانترنت اكسبلورر فقط ـ وهذا هاك استخدمه دائماً في جميع اكوادي .

تقديري واحترامي الكامل

[فاشل كل العاده]

يزداد العرض عن الصفحة لانه يحتسب العرض المحدد ( 100 % ) بالاضافه الى 10 بكسل أخرى لانك مستخدم padding:5px; ....

يعني يتحذف افضل ؟ padding:5px