Help Chỉnh kích thước sidebar theo kích thước màn hình

[duylong676]

Chào mọi người!
Hiện tại mình đang làm forum nhưng thấy trang bên Nhatrangclub làm hay quá mình muốn làm theo. Bạn nào biết chỉ mình với?

1. Quảng cáo

Nếu giao diện desktop mở rộng full thì quảng cáo xuất hiện ở Ad_header

Chuyển sang giao diện nhỏ hơn hoặc trên Mobile thì nó chuyển xuống phía ad_breadcum

2. Sidebar

Độ rộng hiển thị ở sidebar chạy theo kích thước màn hình

Của bên bạn nhatrangclub thì hiện rộng thế này

Ai giúp mình với nè! thanks nhiều

 

[hinte65]

mình cũng mới làm xen đc vài ngày, góp ý giúp bạn xíu

1. Quảng cáo

cái này trang bạn nói chỉ ẩn hiện thôi.
Muốn làm giống vậy bạn tạo 2 cái quảng cáo html :

• 1 cái cho Container breadcrumb (top): Above
• 1 cái cho Container header

nội dung html vd từ nhatrangclub:
----------
<div id="bannerTopLogoMobile">
<a href="Your post count not enough to post link. Required 5 post(s)" title="Phở Gốc - 40 Yết Kiêu - Nha Trang" target="_blank">
<img src="Your post count not enough to post link. Required 5 post(s)" alt="Phở Gốc - 40 Yết Kiêu - Nha Trang">
</a>
</div>
-----------

kế tiếp bạn vào template thêm vào extra.less
--------------------
@media (min-width: 650px) {
#bannerTopLogoMobile{
display: none;
}
}


--------------------

650px là kích thước nhỏ nhất để template chuyển qua dạng mobile



2. Sidebar

cũng đang muốn biết

 

[duylong676]

cảm ơn bạn rất nhiều nha!!

 

[duylong676]

2. Sidebar

cũng đang muốn biết

Cũng làm giống bạn luôn nhờ bạn chỉ mình cũng đã mò ra nè
tuy nhiên cho đoạn này vào sidebar.css

Tìm đoạn này:

@media (max-width:340px)
{
.Responsive .sidebar
{
width: 100%;
}
}

Thay bằng đoạn này:

@media (max-width:800px)
{
.Responsive .sidebar {
width: 100%;
float: none;
margin: 0 auto
}
}