Thêm cột trên và dưới bài viết Blog

Thêm cột trên vàdưới bài viết Blog 

Ở bài viết trước Tôi đã viết về TÙY BIẾN Widget Blogspot CHO BLOG CỦA BẠN

Tuy nhiên có bạn không biết thêm cột, chia cột trên hay dưới bài đăng như thế nào?

Vậy hôm nay xin hướng dẫn các bạn chia 2 cột trên hay dưới bài đang Blog hy vọng các bạn thực hiện thành công:

1. Thêm trước thẻ ]]></b:skin>:

/*Under Post
-----------------------------*/
#underpost h2{
font-size:13px;
font-weight:bold;
color:#B8002E;
border-bottom:2px solid #000000;
padding-left:5px;
}
#underpost{
width:530px;
}
#underleft{
width:257px; /*Chiều rộng cột trái*/
float:left;
margin:4px;
}
#underright{
width:250px; /*Chiều rộng cột phải*/
float:right;
margin:4px;
}

Lưu ý:

Bạn cần phải để ý:

#main-wrapper {
width: 410px;

Tương đương hiệu chỉnh lại

width:530px;

Phải là: width:410px;

Không quên điều chỉnh:

width:250px; /*Chiều rộng cột phải*/
width:257px; /*Chiều rộng cột trái*/
Cho phù hợp nhé J

2. Tìm đoạn code sau:

Hoặc tương tự như sau:

<div id='main-wrapper'>

<b:section class='main' id='main' showaddelement='no'>

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>

</b:section>
</div>

Thêm 2 cột dưới bài viết Blog:

Thêm đoan code sau vào như thế này:

<div id='main-wrapper'>

<b:section class='main' id='main' showaddelement='no'>

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>

</b:section>
<div id='underpost'>
<b:section class='underleft' id='underleft'/>

<b:section class='underright' id='underright'/>
</div>
</div>

Thêm 2 cột trên bài viết Blog:

Thêm đoan code sau vào như thế này:

<div id='main-wrapper'>
<div id='underpost'>
<b:section class='underleft' id='underleft'/>

<b:section class='underright' id='underright'/>
</div>

<b:section class='main' id='main' showaddelement='no'>

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>

</b:section>
</div>

Lưu mẫu của bạn lại và xem kết quả! Hy vọng bài viết có ích cho bạn!