تحياتي لكم جميعاً أطلب المساعدة في تعديل في كود في قالب بلوجر .

كيف جعل الصورة الأولة مثل الصورة الثانية بمعنى ، كيف جعل الوجو و المساحة الأعلانية بجوار بعض مثل الصورة الثاني الصورة "1" كيف جعل هذا مثل

الصورة"2" هذا

وشكراً لكم

ولتسهيل أكثر هذا هو الكود المستخدام في القالب المراد تغيرة

<-----كود HTML----للوجو---->

b:section class='header' id='header' maxwidgets='1' showaddelement='yes'>

<b:widget id='Header1' locked='true' title='يوسف ماجد (رأس الصفحة)' type='Header'

<-----كود CSS----للوجو----> هنا تكمول المشكلة

/منطقة الهيدر/

header-wrapper {

background-color: #f8f8f8;

border-bottom: 1px solid $(bordcolor);

padding-bottom: 50px;

padding-top: 88px;

}

/عنوان المدونة/

.header h1, .header h1 a {color: #555; font-size: 70px;}

.description span {

color: #777;

display: block;

font-size: 20px;

}

/أسفل الهيدر/

outer-wrapper {

margin: 0 auto;

padding: 30px 0;

width: 980px;

}

.slider .widget-content {margin-bottom: 40px; margin-top: -10px;}


------كود HTML ---للأعلان -------

b:section class='topads' id='topads' maxwidgets='1' showaddelement='yes'>

<b:widget id='HTML1' locked='false' title= 'مساحة إعلانية' type='HTML '

---------------كود CSS----للأعلان ----------

/إعلان أسفل الهيدر/

topads .widget-content {

background-color: #fff;

border: 10px solid #fff;

box-shadow: 0 0 0 1px #cccccc;

box-sizing: border-box;

margin: 0 auto 40px;

max-height: 110px;

max-width: 748px;

overflow: hidden;

width: 100%;

}

topads .widget-content img {width:100%; height:auto;}

.owl-loaded li {display: block !important;}

.slidesh li{background-color:#fff;border:1px solid #ddd;height:300px;overflow:hidden;padding:8px;position:relative;transition:all .4s ease 0}

.imgcontain{background-color:#000;display:block;height:190px;overflow:hidden;position:relative;width:100%}

.imgcontain img{height:100%;transition: all 0.4s ease 0s;}

.imgcontain:hover img{opacity:.7}

.imgcontain span{background-color:#fff;box-shadow:0 1px 2px #000;color:#444;display:block;font-size:18px;height:40px;line-height:40px;margin-right:-40px;margin-top:-20px;position:absolute;right:50%;text-align:center;top:50%;width:80px;z-index:2}

.slidesh p{display:block;font-size:16px;line-height:1.8em;margin:5px 0;text-align:center}

.paye{background-color:#f8f8f8;border-top:1px solid #ddd;bottom:0;height:40px;line-height:40px;margin:0;position:absolute;right:0;width:100%}

.paye span{background-color:#446faa;color:#fff;float:right;font:18px/38px arial;height:38px;margin-right:1px;margin-top:1px;text-align:center;width:50px}

.paye span::before{content:"$";margin:0 4px 0 0}

.paye a{color:#fff;display:inline-block;float:left;height:38px;margin-left:1px;margin-top:1px;padding:0 8px}

.paye a:hover {background-color:#000;}

.skhamsat{background-color:#f98101}

.vodafone{background-color:#EA0000}

.slidesh .owl-nav{position:absolute;right:9px;top:9px}

.slidesh .owl-nav div{background-color:rgba(0,0,0,.5);color:#fff;float:left;font-size:24px;height:30px;line-height:30px;text-align:center;width:30px}

.slidesh .owl-nav div:hover{background-color:#000}

.slidesh .owl-prev{margin-right:2px}

.jadeeod::before {

background-color: #cc0000;

box-shadow: 0 2px 4px #000;

color: #fff;

content: "جديد";

display: block;

font: 12px/24px droid arabic kufi;

height: 24px;

left: -20px;

position: absolute;

text-align: center;

top: 8px;

transform: rotate(-45deg);

width: 80px;

}

------الجزء الخاص بالتخطيط ------

/التخطيط/

layout {width: 800px; padding: 5px 0 !important;}

layout #main-menu,#layout .tabs-widget,#layout #cnmuligmes {display:none;}

layout #outer-wrapper {padding: 0; width: 100%;}

layout {padding: 5px 0 !important; width: 800px}

layout #header-wrapper {padding: 0;}

layout #header {background-color: #446FAB;}

layout #topads {background-color: #2a9c00; color:#fff !important;}

layout #topads .widget-content {margin: 0; width: 100%;}

layout #main-wrapper {width: 360px;}

layout #sidebar-wrapper {width: 430px;}

layout .side-taps .section {

background-color: #fca000 !important;

color: #fff;

float: right;

height: 250px;

padding: 5px !important;

width: 135px;

}


وشكراً لكم جميعاً واعتذر عن الايطالة رابط الموقع لتجربة من مطور المتصفح :