Optimise mobile logobar

Hi There,

first of all thanks for your great service!
I found many answer so far in the support forum.

Apperently one thing still strucks me.

I have customised the logobar with an image.
On the PC version it all looks beautiful, but on mobile there is a big black letterbox around the picture.

My custom css are looking like this:
.x-logobar {background: url(http://ulrichstaege.de/wp-content/uploads/2017/09/Ulrich-Staege-1-2.png) no-repeat center center;background-size: 100% auto;}
body .x-brand.text {display: none;}
.x-topbar .x-social-global a {
color: red;
background-color: black;}
.x-social-global a:hover.facebook {background-color: #3b5998;color: white;}

I have also added some picture to display what I mean.

What should I do?

Thanks,
Leon :slight_smile:

website:


(under construction code: island)

Hi There,

Please add the following CSS to Theme Options CSS

@media(max-width: 480px) {
.x-logobar-inner {
    padding-top: 160px;
}}

Hope it helps!

1 Like

Hi Joao,
thanks for the quick responds!

It works perfectly, thanks again.

Leon :slight_smile:

You’re welcome.