Increase hight top bar mobile version

Hey Emanon,

Please try the following in Quick CSS under Enfold->General Styling:

@media only screen and (max-width: 767px) {
#header_meta {
    padding: 10px 0;
}
}

Best regards,
Rikard

Hi,

Please add the following code to the Quick CSS field in Enfold theme options > General Styling tab

@media only screen and (max-width: 767px) { 
#header_meta .phone-info {
  text-align: left;
}
}

If that doesn’t work, please post a link to your website.

Best regards,
Yigit

Hi,

The text is already left aligned on my end. Would you like to remove the highlighted space in the screenshot I attached in the private content field?
If so, please use the following code instead

@media only screen and (max-width: 767px) { 
.responsive #top #wrap_all #header_meta .container {
  padding: 0;
  width: 100%;
  max-width: 100%;
}
}

Best regards,
Yigit

Hi,

I edited the last media query you have in your Quick CSS field and added the following code to it as well

#header_meta .sub_menu #menu-item-2545::before {
  padding-right: 15px;
}
#header_meta .sub_menu #menu-item-2547::before {
  padding-right: 18px;
}

Please review your website.

Best regards,
Yigit

Hi,

Great, I’m glad that Yigit could help you out. I’ll close this thread for now then, please open a new thread if you should have any further questions or problems.

Best regards,
Rikard