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

Dr_xXx · 03-04-2008, 12:43 AM

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

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

إضغط على الصورة لرؤيتها بحجمها الطبيعي

الاسم: SSITE.gif
الزيارات: 87
الحجم: 5.6 كيلوبايت

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

Zizwar · 03-04-2008, 06:40 PM

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

owner · 03-04-2008, 07:14 PM

اهلا .

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

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

كود:

min-height:100%

lm4web · 03-04-2008, 09:04 PM

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

Dr_xXx · 04-04-2008, 02:51 PM

هذا الكود

كود 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>

Dr_xXx · 06-04-2008, 05:53 PM

uppppppppppppppp

lm4web · 06-04-2008, 10:14 PM

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

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

كود:

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

أو

كود:

.Left {
background-color:#FFFFFF;
    float: left;
    min-height:900px;
    width: 200px;
}

قم بأحد التعديلان وليس كلاهما

المبدع العربي · 18-04-2008, 05:09 PM

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

المواضيع المشابهه
الموضوع	كاتب الموضوع	القسم	الردود	آخر مشاركة
سؤال مهم جدا ,, كيف تعرف اذا كنت مبرمج	محمد الرحيلي	PHP	2	10-01-2006 01:57 PM
سؤال مهم جدا بس مدري هو مهم لي أو للجميع	هكرز المنتديات	الإصلاح والصيانة	5	15-06-2005 06:21 AM
طريقة الترقيه من نسخة منتدى 2.2.0 وما بعدها الى نسخة منتدى 2.3.0 بالتفصيل الممل	Khaled774	الإصلاح والصيانة	14	25-03-2004 10:20 AM
سؤال الى خبراء منتديات ال في بي هام جدا	elkaser	الإصلاح والصيانة	4	23-01-2004 01:22 PM
شباب مين الشاطر فيكم ويقوللي كيف اسوي شعاااااااااار.؟	MaRWaN	التصميم والرسومات والمونتاج	6	12-12-2000 03:52 PM

أدوات الموضوع
مشاهدة نسخة مطبوعة إرسال هذه الصفحة