Help làm sau đề màu menu header rộng hết màn hình

[sukoro]

Nhờ anh em chỉ giúp mình làm sao cho màu nền menu header nó chạy sang 2 bên như hình dưới với. Mình thử nhiều cách rồi không được. Chỉ mỗi menu thôi nhé

 

[PVS]

Nếu thanh menu thì cứ thêm css cho .p-nav là được.

 

[sukoro]

Nếu thanh menu thì cứ thêm css cho .p-nav là được.

mình thêm hoài không được ấy @PVS Cậu hướng dẫn code css giúp mình được không? Cảm ơn!

 

[PVS]

Mình xem trang của bạn thì có thêm đoạn code này

bạn chỉnh ở đây là được nha, nhưng mà nếu chỉnh ở đây thì xem chỉnh lại phần footer luôn.

 

[sukoro]

Mình xem trang của bạn thì có thêm đoạn code này

View attachment 37084

bạn chỉnh ở đây là được nha, nhưng mà nếu chỉnh ở đây thì xem chỉnh lại phần footer luôn.

Mình chỉnh ở đó lúc trước rồi nhưng toàn bộ header nó rộng ra luôn chứ không phải riêng menu ấy bạn

 

[sukoro]

Ví dụ như báo tiền phong nó chỉ có menu là rộng cả màn hình

 

[HungTQ]

Cái này bạn cần có kiến thức css và các vận dụng các class

Vd class A = 100%
Class B = 1000px

 

[sukoro]

Cái này bạn cần có kiến thức css và các vận dụng các class

Vd class A = 100%
Class B = 1000px

Mình không phải dân trong nghề nên không biết ntn cả, bạn giúp mình chỉnh với

 

[PVS]

Mình chỉnh ở đó lúc trước rồi nhưng toàn bộ header nó rộng ra luôn chứ không phải riêng menu ấy bạn

Do bạn có xoá các class inner đi rồi nên vậy

 

[Win]

Cần phải thay đổi phần header để làm lại theo ý bạn. Còn nếu muốn phá cách có thể dùng css như:

.p-navSticky.p-navSticky--primary {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
}

#header {
    padding-top: 30px;
}

@media (max-width: 650px){
    .p-navSticky.p-navSticky--primary{padding-left:10px;padding-right:10px}
}

 

[HungTQ]

Thêm đoạn CSS sau vào Extra.less

.DC_pageWrapper {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
    
    }
    
.p-body-inner,   
.p-header-inner {
    max-width: 1000px;
}
nav.p-nav {
.p-nav-inner {
background: transparent;
max-width: 1000px;
}   

}

Phần footer muốn được căn chỉnh chuẩn thì vào PAGE_CONTAINER tìm <footer class="p-footer">

nói chung đoạn code không cố định có thể sẽ thay đổi theo style hoặc các addon nhưng chỉ cần tìm thẻ mở của <footer


Thêm bên dưới <div class="htq-footer">

Tìm tiếp đoạn </footer> thêm bên trên: </div>

Thêm đoạn CSS sau vào Extra.less

.p-footer {

.htq-footer {
    display: block;
    margin: auto;
    max-width: 1000px;
}

}

max-width:1000px là chiều rộng tối đa hoặc bạn cũng có thể sử dụng mã trong style properties
Mã: max-width:@xf-pageWidthMax ;