عدلت لك الان الكود لتصبح هناك ثلاث اعمدة
CSS
كود:
body, html {
background:url(images/bg.gif) ;
color:#fff;
direction:rtl;
}
#wrap {
width:978px;
background-color:#CCCCCC;
margin:0px auto;
padding:0px;
}
#header {
background-image: url(images/header.gif);
width:978px;
height:200px;
clear:both;
}
#navads1 {
height:27px;
background-image: url(images/nav-1.gif);
border: 2px solid #FFFFFF;
}
#lastgamenav {
height:27px;
background-image:url(images/nav-1.gif);
border: 2px solid #FFFFFF;
}
#navads2 {
background-image:url(images/nav-2.gif);
border: 2px solid #FFFFFF;
}
#ads-area-1 {
height:204px;
border: 2px solid #FFFFFF;
}
#menu {
height:27px;
background-image:url(images/nav-1.gif);
border: 2px solid #FFFFFF;
}
#last-game-area {
height:364px;
border: 2px solid #FFFFFF;
}
#ads-area-2 {
height:271px;
border: 2px solid #FFFFFF;
}
#right {
width:204px;
float:right;
}
#left {
width:352px;
float:left;
}
#center {
width:422px;
float: right;
}
html
كود HTML:
<div id="wrap">
<div id="header">
<h2>games - free flash games - online games</h2>
</div>
<div id="right">
Right
<div id="navads1">ads1</div>
<div id="ads-area-1">adsarea</div>
</div>
<div id="center">
Center
<div id="lastgamenav">last game</div>
<div id="last-game-area">last-game-area</div>
</div>
<div id="left">
LEFT
<div id="navads2">ads2</div>
<div id="ads-area-2">ads-area-2</div>
</div>
</div>
مع العلم اني عدلت عرض الجانب الايسر ليكونو جميعا متلاصقين.