Return to previous page

How to adjust Top bar height when mobile in "portrait" direction?

This topic has 14 replies, 3 voices, and was last updated 10 years, 2 months ago ago by Jack Richardson

Eric

Participant

September 21, 2015 at 08:03

Dear Service,

After I add text link in right top bar, those text in right top bar shown at the middle place, and become 2 rows. I think it’s Ok but the text above space become too much height.
Please see the picture https://drive.google.com/file/d/0B0UZ77fMI9c0RHVNLUdHSzR5bHc/view?usp=sharing
Please tell me how to adjust top bar to be slimmer? Thanks.

Regards,
Eric

#88200 Copied

13 Answers
Jack Richardson

Support staff

September 21, 2015 at 10:52
Hello,

Please add this code in Theme Options > Custom CSS > Custom CSS for mobile:

.languages-area { display: none; }

Best regards,
Jack Richardson.
#88252 Copied
Eric

Participant

September 22, 2015 at 06:29

Dear Jack,

Do you misunderstand what I mean?
I’ve diaplayed language area.
My problem is I want the mobile top bar could be slimmer as my link show.
Please tell me how to adjust it?
Thanks

Regard,
Eric

#88455 Copied

Eric

Participant

September 22, 2015 at 08:11

Dear Jack,

(Describe again, sorry )
I think you must misunderstand what I mean.
I’ve set language area diaplay as none but language area atill in a invisible place at the left space, you may check it when use a mobile portrait look.

Please tell me how to adjust or eliminate the space?
Thanks

Regard,
Eric

#88492 Copied

Eric

Participant

September 22, 2015 at 08:49

Dear Jack,

Finally, I realize what’s different with set langurahe invisible and set display none from CSS.
Thank you, the extra space on top bar is already gone.

Another question, if I want to let all the texts at right top bar in a line, how to do that?
Thank you!!!!

Regards,
Eric

#88507 Copied
Stan Russell

Participant

September 22, 2015 at 09:22
Hello,

please use following css code:

.top-bar .topbar-widget { padding-top:3px }

Regards,
Stan Russell.
#88517 Copied
Eric

Participant

September 25, 2015 at 11:02

Dear Stan,

I mean that when the top bar show on portrait mobile screen, the text in the top bar will become 2 rows like this https://drive.google.com/file/d/0B0UZ77fMI9c0NE95ak9wU04wYlE/view?usp=sharing .How to adjust these two rows as one row? Thank you!

Regards,
Eric

#89254 Copied
Jack Richardson

Support staff

September 25, 2015 at 14:56
Hello,

Please use this code in Theme Options > Custom CSS > Custom CSS for mobile:

.top-links .topbar-widget { width: 30% !important; }

Best regards,
Jack Richardson.
#89310 Copied
Eric

Participant

September 28, 2015 at 08:59

Dear Jack,

Yes, it seems work, but the text show at right side?
please check this link https://drive.google.com/file/d/0B0UZ77fMI9c0R0JRdElYY25CRDQ/view?usp=sharing
Should the text show infront of login(at the left side of login text link)?
How to do to let it show at left side? Thanks!

Regards,
Eric

#89516 Copied
Jack Richardson

Support staff

September 28, 2015 at 12:16
Hello,

Also use this code:

.top-links .topbar-widget { float: left; }

Best regards,
Jack Richardson.
#89632 Copied
Eric

Participant

October 6, 2015 at 04:22

Dear Jack

That’s OK, but after I put this code into custom CSS, the text at right top bar become squeezed, and I remove the added CSS Code the squeezed text still there.

Please see these link…
https://drive.google.com/file/d/0B0UZ77fMI9c0RTMxNDRWYnNldHM/view?usp=sharing
https://drive.google.com/open?id=0B0UZ77fMI9c0djNtRnh3cnM1djQ

How to solve it? Thank you!

Eric

#91570 Copied
Jack Richardson

Support staff

October 6, 2015 at 09:34
Hello,

As I told you this code should be added to “Custom CSS for mobile” section, not to “Global Custom CSS”:

.top-links .topbar-widget { width: 30% !important; }

I’ve corrected this.

Please check the site now.

Best regards,
Jack Richardson.
#91652 Copied
Eric

Participant

October 12, 2015 at 10:43

Dear Jack,

It’s solved.
Thank you!

Best regards,
Eric

#93192 Copied

Jack Richardson

Support staff

October 12, 2015 at 12:49

Hello,

You’re welcome.

Best regards,
Jack Richardson.

#93229 Copied
Viewing 14 results - 1 through 14 (of 14 total)

The issue related to '‘How to adjust Top bar height when mobile in "portrait" direction?’' has been successfully resolved, and the topic is now closed for further responses

How to adjust Top bar height when mobile in "portrait" direction?

Explore our best WordPress WooCommerce Themes collection