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

الموضوع: سؤال مهم جدا ومستعجل الى خبراء ال CSS

  1. #1
    عضو سوبر نشيط
    تاريخ التسجيل
    Apr 2004
    المشاركات
    673

    سؤال مهم جدا ومستعجل الى خبراء ال CSS



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

    المشلكة هيه كل ما يطول اليمين ( المحتوى ) اليسار ما يطول معة ويصير مضهر الصفحة مشوة الصور توضح لكم اكثر

    الاســـم:	SSITE.gif
المشاهدات: 170
الحجـــم:	5.6 كيلوبايت


    ارجو الحل باسرع وقت
    شكرا





    __________________
    #


  2. #2
    خبير JavaScript
    تاريخ التسجيل
    Jul 2002
    المشاركات
    2,920


    ضع الكود لنرى اين نعدل








  3. اهلا .

    ضع الكود حتى نستطيع مساعدتك .

    عموما جرب هذا الكود في الكلاس الخاص بالعمود الايسر

    كود:
    min-height:100%






    __________________
    ownersınnı
    ALdiraZi BLoOoG | Contact Me | lt.tl - shorten your URL

  4. #4
    عضو نشيط
    تاريخ التسجيل
    Jun 2007
    المشاركات
    106


    ضع موقعك أخي الكريم لنرى كيف يمكننا أن نساعدك






  5. #5
    عضو سوبر نشيط
    تاريخ التسجيل
    Apr 2004
    المشاركات
    673


    هذا الكود


    كود 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>
    <meta http-equiv="Content-Type" content="text/html; windows-1256" />
    <title>Arnob Blog not jus a blog its a arnod blog</title>
    <style type="text/css">
    <!--
    body {

        background-color: #CCCCCC;
        width: 770px;
        margin-top: 0px;
        margin-right: auto;
        margin-bottom: 0px;
        margin-left: auto;
    }
    .header {
        height: 175px;
        width: 770px;
        background-color:#000000;
        
        
    }
    .Left {
    background-color:#FFFFFF;
        float: left;
        min-height:100%;
        width: 200px;
    }
    .Right {
    background-color:#FFFFFF;
        float: right;
        height: 900px;
        width: 570px;
    }
    .footer {
        background-color:#666666;
        clear: right;
        height: 40px;
        width: 770px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 10px;
        color: #CCCCCC;
        line-height: normal;
        border-bottom-width: 1px;
        border-bottom-style: dotted;
        border-bottom-color: #FFFFFF;
        background-image: url(images/manu-bg.gif);
        }
    .style1 {color: #0A0809}
    #apDiv1 {
        position:absolute;
        left:944px;
        top:1px;
        width:145px;
        height:307px;
        z-index:1;
    }
    #apDiv2 {
        position:absolute;
        left:68px;
        top:2px;
        width:89px;
        height:302px;
        z-index:2;
    }
    a {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #666666;
    }
    a:link {
        text-decoration: none;
    }
    a:visited {
        text-decoration: none;
        color: #333333;
    }
    a:hover {
        text-decoration: underline;
        color: #333333;
    }
    a:active {
        text-decoration: none;
        color: #333333;
    }
    body,td,th {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #000000;
    }
    .style3 {font-size: 12px; font-family: Tahoma; color: #666666;}
    -->
    </style>
    </head>

    <body>
    <?
    function template($output) {
    ?>

    <div id="apDiv1"><img src="images/right.gif" width="106" height="304" /></div>
    <div id="apDiv2"><img src="images/left.gif" width="106" height="304" /></div>
    <div class="header" style="" > 
    <div >

    <script type="text/javascript" src="chrome.js"></script>
    <style>
    #MainMenu 
    {
        height:54px;
        background: #FFFFFF url("images/bmid_108.gif");
        margin:0;
        border:0;
    }
    #tab 
    {
        margin:0;
        top:0;
    }
    #tab ul 
    {
        margin:0;
        padding:0;
        list-style:none;
        float:left;
    }
    #tab li 
    {
    display:inline;
        float:left;
        margin:0 1px 0 0 ;
        padding:0;
    }
    #tab a 
    {
        background: url("images/bright_108.gif") no-repeat right top;
        margin:0;
        padding:0;
        text-decoration:none;
        border:0;
        display:block;
        float:left;
    }
    #tab a span 
    {
        display:block;
        background:url("images/bleft_108.gif") no-repeat left top;
        padding:0 25px 0 25px;
        font-family:Arial, Helvetica, sans-serif;
        font-size:11;
        color:#FFFFFF;
        font-weight:bold;
        line-height:54px;
    }
    #tab a:hover,#tab li.item_active a 
    {
        background-position:right bottom;
        border-color:;
    }
    #tab a:hover span,#tab li.item_active a span 
    {
        background-position:left bottom;
        color:#6A888A;
        font-weight:bold;
        font-style:normal;
        text-decoration:none;
    }
    .dropmenudiv
    {
        position:absolute;
        top:0;
        float:left;
        display:block;
        visibility:hidden;
        border:0 solid ;
        background: #FFFFFF url("images/bmid_108.gif");
        color:#FFFFFF;
        z-index:100;
        text-decoration:none;
        padding:0;
    }
    .dropmenudiv ul 
    {
        margin:0;
        padding:0;
        list-style:none;
    }
    .dropmenudiv li 
    {
        display:inline;
        margin:0;
        padding:0;
    }
    .dropmenudiv a:link, .dropmenudiv a:visited
    {
        width:180px;
        margin:0 1px 0 0 ;
        padding:0;
        display:block;
        border:0 solid ;
        color:#FFFFFF;
        background:url("images/bleft_108.gif") no-repeat left top;
        font-weight:bold;
        font-style:normal;
        text-decoration:none;
    }
    .dropmenudiv a span 
    {
        float:left;
        display:block;
        line-height:54px;
        background:url("images/bright_108.gif") no-repeat right top;
        padding:0 25px 0 25px;
        font-family:Arial, Helvetica, sans-serif;
        font-size:11;
        color:#FFFFFF;
    }
    .dropmenudiv a span 
    {
        float:none;
    }
    .dropmenudiv a:hover
    {
        border:0 solid ;
        background-position:left bottom;
        font-weight:bold;
        font-style:normal;
        text-decoration:none;
        color:#6A888A;
    }
    .dropmenudiv a:hover span 
    {
        background-position:right bottom;
        color:#6A888A;
        font-weight:bold;
    }

    </style>
    <div id="MainMenu" >
        <div id="tab">
            <ul>
                <li ><a href="?display=main"><span>Home</span></a></li>
                <li><a href="#"><span>Portfolio</span></a></li>
                <li><a href="#"><span>Blog</span></a></li>
                <li><a href="#"><span>Resources </span></a></li>
                <li><a href="#"><span>Links </span></a></li>
              <li><a href="#"><span>Contact Us </span></a></li>
                 <li><a href="?display=About"><span>About us </span></a></li>
            </ul>
        </div>
    </div>
    </div>
    <img   src="images/HDIM.gif" />
    </div>
    <div class="Right">
      <table width="560" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td background="images/RIGHTBG1.gif" style="background-repeat:no-repeat">
          <p >
          <table width="550" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td ><div style="margin-left:20px; margin-top:25px;"><?= $output;?></div></td>
      </tr>
    </table>

          </p></td>
        </tr>
      </table>
      <br />
    </div>
    <div  class="Left" > <p style=" margin:10px;">&nbsp;</p> 
      <table width="200" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td height="49px" style="background-image: url(images/top-manu.gif); background-repeat:no-repeat; background-position:center;"><p><img style="margin-left:20px;" src="images/dot.gif" width="10" height="10" /> Blog Category</p>
          </td>
        </tr>
      <tr>
        <td style="background-image:url(images/midmanu.gif); background-repeat:repeat-y; background-position:center;"><table width="170" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td width="25"><div align="center"><img src="images/dot.gif" width="10" height="10" /></div></td>
            <td width="145"><a href="?display=IraqNews">About Iraq</a></td>
          </tr>
          <tr>
            <td><div align="center"><img src="images/dot.gif" width="10" height="10" /></div></td>
            <td><a href="?display=News">News</a></td>
          </tr>
          <tr>
            <td><div align="center"><img src="images/dot.gif" width="10" height="10" /></div></td>
            <td><a href="?display=Cartoons">Cartoons</a></td>
          </tr>
          <tr>
            <td><div align="center"><img src="images/dot.gif" width="10" height="10" /></div></td>
            <td><a href="?display=internet">internet</a></td>
          </tr>
          <tr>
            <td><div align="center"><img src="images/dot.gif" width="10" height="10" /></div></td>
            <td><a href="?display=technology">technology</a></td>
          </tr>
          <tr>
            <td><div align="center"><img src="images/dot.gif" width="10" height="10" /></div></td>
            <td><a href="?display=Fun">Fun</a></td>
          </tr>
          <tr>
            <td><div align="center"><img src="images/dot.gif" width="10" height="10" /></div></td>
            <td><a href="?display=NoCat.php">No Cat</a></td>
          </tr>
        </table></td>
        </tr>
      <tr>
        <td height="27px" style="background-image:url(images/footer.gif); background-repeat:no-repeat; background-position:center;">&nbsp;</td>
        </tr>
    </table><br>
      <table width="200" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td height="49px" style="background-image: url(images/top-manu.gif); background-repeat:no-repeat; background-position:center;"><p><img style="margin-left:20px;" src="images/dot2.gif" width="10" height="10" /> Tutorials Catorgys</p></td>
        </tr>
        <tr>
          <td style="background-image:url(images/midmanu.gif); background-repeat:repeat-y; background-position:center;"><table width="170" border="0" align="center" cellpadding="0" cellspacing="0">
            <tr>
              <td width="25"><div align="center"><img src="images/dot2.gif" width="10" height="10" /></div></td>
              <td><a href="#">Photoshop</a></td>
            </tr>
            <tr>
              <td width="25"><div align="center"><img src="images/dot2.gif" width="10" height="10" /></div></td>
              <td><a href="#">DreamWaver</a></td>
            </tr>
            <tr>
              <td width="25"><div align="center"><img src="images/dot2.gif" width="10" height="10" /></div></td>
              <td><a href="#">PHP</a></td>
            </tr>
            <tr>
              <td width="25"><div align="center"><img src="images/dot2.gif" width="10" height="10" /></div></td>
              <td><a href="#">Html</a></td>
            </tr>
            <tr>
              <td width="25"><div align="center"><img src="images/dot2.gif" width="10" height="10" /></div></td>
              <td><a href="#">Indesign</a></td>
            </tr>
          </table></td>
        </tr>
        <tr>
          <td height="27px" style="background-image:url(images/footer.gif); background-repeat:no-repeat; background-position:center;">&nbsp;</td>
        </tr>
      </table><br />
      <table width="200" border="0" align="center" cellpadding="0" cellspacing="0">
        <tr>
          <td height="49px" style="background-image: url(images/top-manu.gif); background-repeat:no-repeat; background-position:center;"><p><img style="margin-left:20px;" src="images/dot3.gif" width="10" height="10" /> Famous Pages</p></td>
        </tr>

        <tr>
          <td style="background-image:url(images/midmanu.gif); background-repeat:repeat-y; background-position:center;"><table width="170" border="0" align="center" cellpadding="0" cellspacing="0">
            <tr>
              <td width="25"><div align="center"><img src="images/dot3.gif" width="10" height="10" /></div></td>
              <td width="145"><a href="#">Home Page</a></td>
            </tr>
            <tr>
              <td><div align="center"><img src="images/dot3.gif" width="10" height="10" /></div></td>
              <td><a href="#">Links</a></td>
            </tr>
            <tr>
              <td><div align="center"><img src="images/dot3.gif" width="10" height="10" /></div></td>
              <td><a href="#">About us</a></td>
            </tr>
            <tr>
              <td><div align="center"><img src="images/dot3.gif" width="10" height="10" /></div></td>
              <td><a href="#">Resources</a></td>
            </tr>
            <tr>
              <td><div align="center"><img src="images/dot3.gif" width="10" height="10" /></div></td>
              <td>Blog</td>
            </tr>
            <tr>
              <td><div align="center"><img src="images/dot3.gif" width="10" height="10" /></div></td>
              <td>Contact us</td>
            </tr>
            <tr>
              <td><div align="center"><img src="images/dot3.gif" width="10" height="10" /></div></td>
              <td>Ads</td>
            </tr>
          </table></td>
        </tr>
        <tr>
          <td height="27px" style="background-image:url(images/footer.gif); background-repeat:no-repeat; background-position:center;">&nbsp;</td>
        </tr>
      </table>

      
      <table width="200" border="0" cellpadding="0" cellspacing="1">
        <tr>
          <td><img src="images/fwork.gif" width="160" height="20" /></td>
        </tr>
        <tr>
          <td><div align="center"><img src="images/flow.gif" width="170" height="44" border="1" /><br />
          </div></td>
        </tr>
        <tr>
          <td><div align="center"><img src="images/bestwebgallery.gif" width="170" height="44" border="1" /></div></td>
        </tr>
      </table>
    </div>
    <div  class="footer">
      <p style="margin:5px;"><span class="style1">© 2007 13styles.com. All Rights Reserved. Work provided via <a href="http://creativecommons.org/licenses/by-sa/3.0/us/" rel="nofollow'">Creative Commons License</a>. Powered by <a href="http://wordpress.org/" rel="nofollow">WordPress</a>. <a href="http://www.13styles.com/feed/">RSS Feed</a>. Ads powered by <a href="http://buysellads.com/buy/detail/33/">BuySellAds.com</a></span>   Sponsors: <a href="http://www.buydomains.com/find-premium-domains/" rel="nofollow">Domain Names</a></p>
    </div>
    <? ?>

    </body>
    </html>






    __________________
    #

  6. #6
    عضو سوبر نشيط
    تاريخ التسجيل
    Apr 2004
    المشاركات
    673


    uppppppppppppppp





    __________________
    #

  7. #7
    عضو نشيط
    تاريخ التسجيل
    Jun 2007
    المشاركات
    106


    أشعر أخي الكريم أن كود الصفحة غير واضح تماما غير ذلك أن الصفحة تستخدم الجداول بكثرة

    لكن الحل المؤقت لما تريد لابد ان يكون المحتوى في نفس حجم الكود الآتي:

    كود:
    .Right {
    background-color:#FFFFFF;
        float: right;
        height: 612px;
        width: 570px;
    }

    أو

    كود:
    .Left {
    background-color:#FFFFFF;
        float: left;
        min-height:900px;
        width: 200px;
    }
    قم بأحد التعديلان وليس كلاهما






  8. #8
    عبدالعزيز الزرعوني
    تاريخ التسجيل
    Feb 2004
    المشاركات
    3,128


    اجعل العموادن الأيمن والأيسر داخل div آخر تكون خلفيته بيضاء





    __________________
    مدونة المبدع العربي





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

  • لا تستطيع إضافة مواضيع جديدة
  • لا تستطيع الرد على المواضيع
  • لا تستطيع إرفاق ملفات
  • لا تستطيع تعديل مشاركاتك
  •  
اعلانات سوالف
0
أضف موقعك هنا | نسائم نيوز | شقق للايجار في الكويت | بيوت للبيع في الكويت | دليل الكويت العقاري