النتائج 1 إلى 7 من 7

الموضوع: كود توسيط المحتوى في CSS لا يعمل ! ..

  1. #1
    عضو نشيط
    تاريخ التسجيل
    Jan 2008
    المشاركات
    208

    كود توسيط المحتوى في CSS لا يعمل ! ..



    السلام عليكم ..

    لدي صفحة واريد توسيط بنر في وسط الصفحه ..

    استخدمت الامر التالي :

    كود:
    margin : 0 auto
    ولا يعمل ! لا يتم توسيط البنرر ..

    وهذا هو ملف style.css

    كود HTML:
    body {
        margin: 0;
        padding: 0;
    }
    #header {
        height: 80px;
        background: #000;
        width: 100%;
    }
    #nav img {
        margin: auto;
    }
    وهذا ملف الـ HTML ..

    كود HTML:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    
    <head>
      <title></title>
      <meta name="GENERATOR" content="Quanta Plus">
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <link rel="stylesheet" type="text/css" href="style.css">
    </head>
    <body>
    <div id="header"></div>
    <div id="nav"><img src="bannar.png"></div>
    </body>
    </html>
    ماهي المشكله ؟





    __________________
    • My Name is Ahmed
    • My Favorites Book : Being Happy
    • Finally : If You Want To Be Happy Happy Use


  2. #2
    عضو نشيط
    تاريخ التسجيل
    Feb 2009
    المشاركات
    64


    بس انت أصلاً أخوي مو حاط كود توسيط.
    عشان توسّط البنر، ضيف عندك هالسطرين في ملف الـ css . وإن شاء الله يضبط معك.

    كود:
    body {
        margin: 0;
        padding: 0;
    }
    #header {
        height: 80px;
        background: #000;
        width: 100%;
    }
     
    #nav{
     text-align: center ;
       }
    
    #nav img {
        margin: auto;
    }






    التعديل الأخير تم بواسطة عربسايت ; 26-09-2009 الساعة 06:03 PM
    __________________
    أضف موقعك في دليل عربسات الآن
    www.3rabsite.com

  3. #3
    عضو نشيط
    تاريخ التسجيل
    Jan 2008
    المشاركات
    208


    اشكرك بشدة .. اشتغل معاي تمام !

    بس انا الي اعرفه ان الكود هذا text-align خاص في توسيط النصوص , صح ولا لأ ؟

    وان margin: 0 auto; خاص في توسيط المحتوى مهما كان ..

    عموماً جزاك الله خير على سرعة استجابتك وشكراً لك ..





    __________________
    • My Name is Ahmed
    • My Favorites Book : Being Happy
    • Finally : If You Want To Be Happy Happy Use

  4. #4
    عضو فعال جدا
    تاريخ التسجيل
    Aug 2007
    المشاركات
    3,929


    طريقتك الاولي صحيحة
    لكنك لم تحدد عرض البانر





    __________________
    تحاور مع العاقل بعقل .. اما ان يقتنع او تقتنع
    وتحاور مع الجاهل بعقل .. اما يطقعش او تفرقش
    وتلك الفاظ لا معنى لها كذلك كلماته



  5. طريقتك الاولي صحيحة
    لكنك لم تحدد عرض البانر
    كلام سحاب اونلاين مظبوط ، طريقتك التى ذكرتها تعمل مع العناصر التى لها width ثابت





    __________________
    Keepondev | مدونه شديد التخصص فى الجافاسكربت
    جافاسكربت الموجهه بالكائنات | أنماط تصميم جافاسكربت

  6. #6
    عضو جديد
    تاريخ التسجيل
    Oct 2009
    المشاركات
    8


    فى توسيط بطريقة تانيه من غير التكست الاين

    اول شرط ان يكون البودى او الديفايه التى تسبق ما تريد توسيطه
    text-align:center;

    و اليك مثال لما سأقوم به

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

    كود PHP:
    body {
        
    background-color#FFF;
        
    margin-left0px;
        
    margin-top0px;
        
    margin-right0px;
        
    margin-bottom0px;
    text-align:center;
    }

    .
    holder{
        
        
    width:700px;
        
    margin-left:auto;
        
    margin-right:auto;
     


    جرب الان
    كود HTML:
     <div class="holder">Any text</div>







  7. #7
    عضو نشيط
    تاريخ التسجيل
    Jan 2009
    المشاركات
    34


    ليس الأمر
    كود:
    margin: 0 auto
    من يقوم بالتوسيط وانما القيمة auto التي تحدد على اليمين وعلى اليسار

    بمعنى يمكنك كتابة:
    كود:
    margin: 20px auto
    أو حتى

    كود:
    margin: 2em auto 1em






    __________________
    cssguru





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

  • لا تستطيع إضافة مواضيع جديدة
  • لا تستطيع الرد على المواضيع
  • لا تستطيع إرفاق ملفات
  • لا تستطيع تعديل مشاركاتك
  •  

أضف موقعك هنا| اخبار السيارات | حراج | شقق للايجار في الكويت | بيوت للبيع في الكويت | دليل الكويت العقاري | مقروء | شركة كشف تسربات المياه | شركة عزل اسطح بالرياض | عزل فوم بالرياض| عزل اسطح بالرياض | كشف تسربات المياة بالرياض | شركة عزل اسطح بالرياض