Pro Header Telephone Number not responsive

Support
#1

I have designed a header which has a telephone number and some social icons in. Looks great on a large screen but as soon as you get to ipad or below it looks terrible as it does not respond correctly.

Please could you advise.

Many thanks.

Kind regards

#2

Hi There,

On the small screens, it’s not enough the spacing for 4 elements(logo, text, social icons).

I recommend you create a new bar(#2 bar) below your first bar(#1 bar) that contains the phone number and socials icon then hide it on the desktop version. Also hide the phone text and social icons in the #1 bar on the tablet screens.

Let us know how it goes!

#3

Thai

Where does the my-bar come into it? I cant get my head round it at the moment!

Thanks

#4

Hi There,

The my-bar CSS class is my custom class on my local installation, you can skip it.

Would you mind providing us with your admin account so I can create an example for you?

Regards!

#5

Sure, I have attached login details.

#6

Hi There,

I’ve duplicated the logo container into 2 containers. One for the desktop version and one for the mobile version.

In the desktop container, I hid the phone number and socials.

And in the mobile container, I hid the logo.

Everything looks better now.

Could you please check on your end?

Thanks.

#7

Ahh I see how you mean now, thanks… I Just also checked on my iphone 5 and the telephone number is still running behind the menu circle. I have tried reducing the text size but it does not see to make any difference.

Funny thing is that if you look at the mobile size from within the header as you are working on it then it looks fine. It is just not replicating that on the actual phone.

The socials look odd as well and not worked out how I can change that. The actual icon is tiny inside the square and not in the center.

#8

Hi Thai

It appears all ok now so have you just gone in or sorted or was it cache !

In either case many thanks for all your help much appreciated.

Kind regards

#9

Hi There,

Actually, I was adjusting it now, It looks fine now.

Thanks

#10

It looks great thank you.

#11

You’re most welcome.

#12

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.