Docs

[Joao]

Hi There,

Please add the following code to Appereance > Customizer > Custom > CSS

@media (max-width: 480px) {
.telno-mobile {
    float: right;
    margin-top: -18px;
}

.x-topbar .p-info {
 font-size: 14px !important;
width: 100%;
background: none;
}
.topbar-dropdown {
margin-top: 0px;
} 
}

Hope it helps

Joao

[Wannabiz]

Much better! But the phone icon still isn’t placed right (image attached). Also, when the menu button is pressed – a weird gray background appears. How can I get rid of it? (image attached also). And that’s it, that’s all left solving.

Many thanks guys.

[Joao]

HI there,

Please add the following code to Appereance > Customizer > Custom > CSS

.x-topbar p.p-info a {
    font-size: 14px !important;
}

body {
        background-color: #f3f3f3 !important;
}

Hope it helps

Joao

[Wannabiz]

Hi

The gray background problem is now solved! But the phone icon placement is not. Reducing the top bar items’ font size didnt help (image attached), but either way – I would like to keep the font size as it was (18 px).

Thanks.

[Christopher]

Hi there,

You need to reduce font size, at least for mobile devices.

Find this code :

.x-topbar .p-info, .x-topbar .p-info a {
    font-size: 18px!important;
}

And update it to :

@media (min-width:767px){
.x-topbar .p-info, .x-topbar .p-info a {
    font-size: 18px!important;
}
}
@media (max-width:767px){
.x-topbar .p-info, .x-topbar .p-info a {
    font-size: 14px!important;
}
}

Hope it helps.

[Wannabiz]

Ok, so reducing the font size still didn’t work, but I found the problem and managed to fix it.

Thank you very much for all your help, appreciate it!

[Christopher]

You’re most welcome.

[Author]

Posts