Hey Elliott

Thanks for the code. I adjusted it to the following parameters so it works on the iPhone perfectly and the flag icons are not so close together:

 @media only screen and (max-width: 667px) {
.responsive #top #header_meta .container {
width: 100% !important;
max-width: 100%;
}
}

Thanks for your help and support!

Cheers, Sam

Dear Eliott

Thanks for the CSS Code. Work’s perfectly. I didn’t have to modify the .sub_menu padding to make it work.
Your support is very quick and accurate.

Regards & cheers, Sam

Hi Andy

Thanks for your input. When the margin-top is used the phone number is lowered even though I’m on a computer browser (Safari & Firefox). Is there a way to set the behavior that only when viewed on iPhone the phone number or the WPML menu will not overlap?

Regards, Sam

By the way when I use your complete code

@media only screen and (max-width: 1024px) 
.responsive .phone-info {
margin-top: 30px;
}

No change in the menu (iphone) will be shown.
If I use the code

.responsive .phone-info {
margin-top: 30px;
}

the phone number will have a margin on top.

• This reply was modified 9 years, 11 months ago by sambolleter.

Hi Ismael

Thank your for your input. I included your code in functions.php and added the custom css rule as stated above.
After accessing the page the submenu fonts stays in verdana.

I’m I missing something?

Regards, Sam