ចែកប្លកជាពីរចំហៀង

ចែកប្លកជាពីរចំហៀងដូចរូបខាងលើដំបូងយើងចូលBlogger > Layout > Edit HTML រួចចុចCtrl F (ដើម្បីងាយស្រួលរក)

ជំហានទី១សូមរកកូដដូចខាងក្រោម៖
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Header | ខ្មែរក្រោម blog (Header)' type='Header'/>
</b:section>
</div>
ប្តូរកូដព៌ណក្រហមខាងលើនេះអោយដូចជាកូដព៌ណខៀវខាងក្រោម
<div id='header-wrapper'> /* header-wrapper គឺរួមទាំងពីរខាងឆ្វេងនឹងខាងស្តាំ */
<div id='header'> /* ខាងឆ្វេង */
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Header | ខ្មែរក្រោម blog (Header)' type='Header'/>
</b:section>
</div>
<div id='box'> /* ខាងស្តាំ */<b:section class='searchbox' id='searchbox' maxwidgets='1' showaddelement='yes'>
<b:widget id='HTML99' locked='false' title='' type='HTML'/>
</b:section>
</div>
</div>
ជំហានទី២អូសកូនកណ្តុរឡើងលើហើយរកកូដ
#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}
រួចប្តូរកូដព៌ណក្រហមខាងលើនេះអោយដូចជាកូដព៌ណខៀវខាងក្រោមដូចជាជំហានទី១ដែរ។

#header {
float: left; /* ដេកខាងឆ្វេង, យើងអាចប្រើ: float: $startSide */
width: 310px; /* ប្រវេង logo របស់ blog */margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

#box {
float: right; /* ដេកខាងស្តាំ, យើងអាចប្រើ: float: $endSide */width: 320px; /* ប្រវេង box */
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}
សូមអរគុណ!