الموضوع: خبراءcss قائمة ul لا تظهر مع اكسبلور 7

السلام عليكم

استغربت من الاعضاء ان اغلبهم لا يستطيع مشاهدة اقسام الموقع في الهيدر أعلا المنتدى رغم اني متأكد من وجودها وظهر السبب اني استخدم فايروفوكس واكسبلور6 وقوقل كروم

ونص الاعضاء يستخدمون المتصفح السابع .. ركبته الآن وظهرت لي مشاكل في التصميم .. فا يالليت اعرف كيف حل المشكلة وين المشكلة اصلا ؟؟!


ملاحظه المشكلة في المنتدى فقط لان عندي الدليل وبنفس التصميم يظهر تمام
http://directory.3i3i3.com/

ولكن قسم الالعاب بعد كل شي طاير منه
http://games.3i3i3.com/

وه وه سوالف يوم كامل مافيش رد

أرجو أخي الكريم توضيح المكشلة بالصور لأني أرى كل شيء طبيعياً

وهنا المشكلة

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

وجدت أن القائمة موضوعة في صندوق <div> يأخذ المعرّف headertop#, وهناك مجموعة من الأوسمة <span> أنت مستخدمها لضبط القائمة لا مشكلة هنا، ولكن المشكلة في الوسم الذى يحمل الفئة righthtop. الموجود بداخله القائمة <ul> وهذا خطأ للمعايير القياسية ثم وإن وضعت له أي تأثيرات لن تظهر بشكل سليم، إرجع للمكان الذى وضعت فيه القائمة داخل قوالب المنتدى وأحذف هذا الوسم بدايتة ونهايتة ( المشار بالأحمر ).

كود:

<span class="righthtop">
<ul>
<!-- هنا القائمة العلوية -->
</ul>
</span>

وكرر هذا مع القائمة في الدليل وقسم الألعاب، أنت عندك هناك قائمتين واحدة علوية داخل صندوق يحمل المعرّف headertop# وواحدة أخرى سفلية داخل الصندوق headerdwn#
ثم في css للقائمة إحذف من القائمة ul الخواص

كود:

width: 100%;
float: right;

ومن صندوق المحتوى الكلي content نفسه إحذف العرض، حتى لا يحدث تمدد عرضي كما هو ظاهر لدي الأن بسبب وضعك لحدود..

كود:

width: 100%;

إن لم تتمكن من الحل، تابع في ردك واكتب لي كود القائمة كامل الذى وضعته في القوالب وخصائص css لها.

ياهلا باخوي احمد

انا عملت مثل ماقلت لي وابشرك ضابط معي

وتقدر تشوف هنا
http://www.3i3i3.com/vb هنا العمل طلع تمام

لكن للاسف مع العاب لا مانفع ونزلت القائمة سطر جديد ..
http://games.3i3i3.com/

لكن خلني اقول اللي فهمته من ردك هو ان قائمة ul ما احطها داخل div او span صحيح ..!!


ونجي الحين للتصميم في نهايته

css

كود PHP:

#content {
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    border: 1px solid #FFFFFF;
}
#headertop {
background: #97b1b4 url(images/t4.gif) repeat-x;
    width: 100%;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    height: 28px;
}
#headertop ul{
background:#97b1b4 url(images/t4.gif) repeat-x;
    margin: 0;
    padding: 0;
    list-style: none;
}
#headertop ul li{
float:right;
}
#headertop ul li a {
    font: 12px Tahoma;
    color: #FFF;
    text-decoration: none;
    display: block;
    padding: 5px 15px;
    margin: 0px 0px 0px 0px;
}
#headertop ul li a:hover {
    color: #00CCFF;
    background: url(images/t4c.gif) repeat-x;
}
#headertop .righthtop {
    float: right;
    height: 28px;
}
#headertop .righthtoptxt {
background: #02004e url(images/t1.gif) repeat-x;
    float: right;
    height: 28px;
    font:Tahoma, sans-serif;
    color:#FFFFFF;
}

#headertop .lefthtop {
    float: left;
    height: 28px;
}
#header {
    background-color: #e9fdff;
    background-image: url(images/b1.gif);
    height: 114px;
    width: 100%;
    background-repeat: repeat-x;
    clear:both;
}
#header .righth {
background:#eafdff url(images/b1.gif) repeat-x ;
    height: 114px;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    float: right;
}
#header .middleh {
background:#eafdff url(images/b1.gif) repeat-x ;
    height: 114px;
    float:right;
    margin-right: auto;
    margin-left: auto;
}
#header .lefth {
    float: left;
    height: 114px;
}
#header .lefth .dev {
    float: none;
}
#headerdwn {
    background-color: #1c9cd2;
    background-image: url(images/z.gif);
    height: 34px;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    background-repeat: repeat-x;
    width: 100%;
}
#headerdwn ul{
background: #1c9cd2 url(images/z.gif) repeat-x;
    margin: 0;
    padding: 0;
    list-style: none;
}
#headerdwn ul li{
float:right
}
#headerdwn ul li a {
    font: 12px Tahoma;
    color: #e0f5f7;
    text-decoration: none;
    display: block;
    padding: 10px 15px;
    margin: 0px 0px 0px 0px;
}
#headerdwn ul li a:hover {
    color: #34a6d7;
    background: url(images/t4c2.gif) repeat-x;
}
#headerdwn .righthawn{
float:right;
height: 34px;
}
#footertop {
background:#353535 url(images/f.gif) repeat-x;
    width: 100%;
    height:38px;
    font: 12px Tahoma;
    color:#fcfcfc;
}

#footerdwn {
    background-color: #1d1d1d;
    background-image: url(images/f2.gif);
    background-repeat: repeat-x;
    width: 100%;
    float:right;
    height:100px;
}
#footerdwn .rightfoo{
float:right;
color:#666666;
font: 12px Tahoma;
} 


#container {
background:#FFFFFF url(images/background2.gif) repeat-x;
} 


وhtm

كود PHP:

<div id="content">
<!--headertop-->
<div id="headertop">
<span class="righthtop"><img src="templates/www/images/t.gif" /></span>
<span class="righthtoptxt">العاب عسكر</span>
<span class="righthtop"><img src="templates/www/images/t3.gif" /></span>
<ul>
    <li><a href="http://www.3i3i3.com/vb/">مركز عسكر</a></li>
    <li><a href="http://games.3i3i3.com/">العاب</a></li>
    <li><a href="http://directory.3i3i3.com">دليل مواقع</a></li> 
    <li><a href="http://www.up.3i3i3.net/">رفع صور</a></li>
    <li><a href="#">مدونات <span style=" font-size:9px; color:#CC0033" >قريبا</span></a></li>
    </ul>
<span class="lefthtop"><img src="templates/www/images/t5.gif" /></span>
</div>
<!--header-->
<div id="header">
<div class="righth"><img src="templates/www/images/logo.gif" /></div>
<div class="middleh"></div>
<div class="lefth"><span class="dev"><script language="javascript" type="text/JavaScript" src="http://www.3i3i3.com/ad3/adview.php?id=1"></script></span></div>
</div>
<!--headerdwn-->
<div id="headerdwn">
<ul>
    <li><a href="<?php echo $siteurl; ?>/">الصفحة الرئيسية</a></li>
    <li><a href="<?php echo $siteurl; ?>/memberlist.php">قائمة الاعضاء</a></li>
    <li><a href="<?php echo $siteurl."/links.php"; ?>">ننصح بالزيارة</a></li> 
    <li><a href="<?php echo $siteurl; ?>/submit.php">ارسل لعبه</a></li>
    <li><a href="<?php echo $siteurl; ?>/contact.php">تواصل معنا</a></li>
    </ul>
</div>
<!--container-->
<div id="container">
 </div>
<!--footer-->
<div id="footertop" align="center"><span>   <script src="http://www.ratteb.com/js.js" Language="JavaScript" Type="Text/JavaScript"></script>
 <script Language="JavaScript" Type="Text/JavaScript">
 _rid = 11169;
 _rd = "3i3i3.com";
 _rs = 1;
 _rz = 8901;
 _rfunction(_rid, _rd, _rs, _rz);
 </script>
 <noscript>
 <a href="http://www.ratteb.com" target="_blank"><img src="http://www.ratteb.com/ratteb_icon.gif" alt="رتب لخدمات احصائيات و ترتيب المواقع" border="0" height="18" width="18"></a> | 
 <a href="http://www.ratteb.com/3i3i3.com"><img src="http://www.ratteb.com/ratteb_icon.gif" alt="شبكة عسكر - احصائيات و ترتيب" border="0" height="18" width="18"></a>
 </noscript>
</span>
<span>شبكة<a href="http://www.3i3i3.com" style="color:#FFFFFF">عسكر</a>2006-2008</span>
</div> 
<div id="footerdwn"></div>
<!--endfooter-->
</div>

على فكره اخواني انا فعلت خليه من القائمة العلوية فيها صور ما خذه ازاحه على اليسار
يالليت تشفون وش المشكلة بالضبط فيها

اخوي كتوم انا متأسف جدا للخبطه ذي :shy:

يمكنك أن تضع القائمة داخل div مستقل لكن لا تضعها داخل span لأن هذا الأخير ينتمي الى مجموعة أوسمة inline
أقرأ أكثر عن هذا في:

المشروع - الفرق بين Block و inline في العناصر
أو...
#6 الأوسمة والعناصر ـ وكيفية التحكم بعرضهم

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

كتوم جزاك الله خير,,

استفدت كالعادة , وتوضحت امور كثير امام الحين


شكرا