There are better and more convenient ways to customize forum view on different sizes of screen. Turning off the whole WordPress functionality on website front-end is the worst way and it's not professional.

The main problem why you cannot customize it using CSS is the mobile and other device browser caches. You don't see the changes when you adding custom CSS code. You should delete website cache and open a new private browser session each time you make some change in code to see the result. Mobile and tab browser caches are very hard, they don't allow to see any changes made in CSS.

You'll not see that. You just need to remove all custom CSS and explain the issue. We'll provide better CSS code to fix that.

Hello Robert, in the end with this code I have been able to solve all the problems, the logo adapts to any type of screen and the white frames disappear in narrow screens like that of a mobile phone.

@media (max-width: 980px) {
#et_mobile_nav_menu {
display: none;
}
}

@media (max-width: 620px) {
.et_header_style_centered #logo {
position: relative;
bottom: 40px;
max-height: 180px;
}
}

@media (min-width: 621px) and (max-width: 639px) {
.et_header_style_centered #logo {
position: relative;
bottom: 50px;
max-height: 140px;
}
}

@media (min-width: 640px) and (max-width: 980px) {
.et_header_style_centered #logo {
position: relative;
bottom: 20px;
max-height: 140px;
}
}

@media (max-width:768px)
{
html .container {width: 100%;}
}

Hi FranRicht,

I think it's ok. I just suggest you remove the menu paddings. Use this CSS code for this purpose. 

ul#wpf-menu {
   padding: 0px;
}

Wow! Thanks Sofy, it looks great now!