Header is covering my images in some pages

[mrsan65]

Hello im having problems with header of my page, its covering images of the following pages:

-Home - Desktop - The header its over an image banner

-Collections- Mobile- The header is over image collection

-Products - Mobile The image is over product image

Hope someone can help, thanks in advance

[Denishamakwana]

Welcome to shopify community.

Please share your store URL and if your store is password protected then please provide password too.

Thank you.

[mrsan65]

https://www.canvasplace.com.mx/

[Denishamakwana]

Please add below css in bottom of assets/theme.css file

For Desktop view:

div#shopify-section-16530103875038743a {
margin-top: 45px;

}

.header-sticky-wrapper {
top: 0;

}
and check is it proper or not then solve mobile view.
Thank you.

[mrsan65]

It worked well, only the mobile its left. Thanks in advance

[DelightCart]

@mrsan65

Could you provide me store URL? I should be able to answer your question.

Yours faithfully!

[Denishamakwana]

Please add below css in bottom of assets/theme.css file

@media only screen and (max-width:767px)

.collection-content {
padding-top: 48px;

}
Thank you.

[mrsan65]

Mmmm, this didn’t work.

[mrsan65]

www.canvasplace.com.mx

[Denishamakwana]

Please try this one:

Please add below css in bottom of assets/theme.css file

.collection-content {
padding-top: 48px;

}
Thank you.

[mrsan65]

Didnt work also

[mrsan65]

No one?

[mrsan65]

Found this solution in another topic, hope it helps someone else. Thanks everybody.

@media screen and (max-width: 768px){
body:not(.template-index) .main-content {
padding-top: 60px !important ;
}
}