Menu changing depending on the screen size

While editing the menu we are running into a little problem that I can’t figure out. We are getting two different outcomes depending on the computer people are using. We are having a hard time centering the text vertically. we want the results of the 21.5" mac. Here is an example of the two I am testing on. We are using the pro version and our website is ripplesofgrace.com

iMac 27" :

iMac 21.5" :

Hi There,

Please provide your URL in order that we can help.

Thank you

Hey there,

Please change your anchor text’s top margin from 8vh to more or less 60px so it’s the same in all screen sizes. VH value depends on the viewport’s height and it is not appropriate in this case.

www.ripplesofgrace.com

Xian,

How do I change those? I haven’t touched any of that.

Hi There,

Please provide your login credentials in a secure note so we can take a closer look.

Thank you!

Is there a way to do that without displaying them publicly?

Hi,

You can use a secure note.

Please refer to : https://theme.co/apex/forum/t/how-to-get-support/288

Hope it helps!

Thank you, I added a secure note to the previous reply.

Hi There,

Thank you for the credentials, first your menu container has a -8px margin above it. It is minor but still can offset your menu a little bit.

Then inspect your Navigation Inline > Top links > Text see that you have uneven top and bottom margins. Avoid uneven margins/padding and do not put huge margins/padding on elements. I also notice that you added negative margin on some of your element and container, please avoid that too. Let the FLEX LAYOUT horizontally and vertically center the elements.

Also Increase the height of your Transparent Top Menu bar just enough to fit your logo, currently your logo on transparent bar falls from navbar (https://prnt.sc/g5n4i7).

Thanks,

You are awesome! That worked. Thank you so much!

You’re most welcome.