The header of the pages is not responsive

Hello,

this page: ( https://team-entusiasta.it/filosofia/ ) works perfectly when i open it with a computer browser, but when i open it with a smartphone the menu and the link of the logo don’t work at all. Can you help me please solve this problem?

Hi there

Hope you are having a good day and thank you for your question
this is the code you added in the theme and is source of the problem:

@media(max-width:550px){
.bottom-header .col-sm-12 {
margin-top: -230px!Important;
}}

Thanks!
Colorlib Support Team

i tried to delete this part of CSS code and i saw that if i do this the header of the home page becomes not responsive in smartphones.

1ion you have to decide such things yourself, you customized the theme and now some styles are conflicting to the customized styles, is this code added by you? you need some additional revision on your customization

I found this CSS code on your forum and I implemented it with the aim to make the header responsive.

The result is that the header of the home page became responsive, but the header of the other pages became not responsive because the H1 title goes up.

I analyzed the problem and i found out that all H1 titles have this class=“col-sm-12” . So if you can give me a solution I will be very grateful.

Thanks in advance.

On this page I found the CSS code: https://colorlibsupport.com/t/homepage-is-not-displaying-correctly-on-mobile-version/#post-99381

Hello

lets try to modify your css code to this:

@media (max-width: 550px){
.bottom-header .col-sm-12 {
margin-top: -83px!Important;
}
}