Return to previous page

Secondary Menu – Font Size / Row Height

This topic has 12 replies, 3 voices, and was last updated 7 years, 9 months ago ago by Rose Tyler

George

Participant

January 29, 2017 at 06:04

Can you please let me know the css code for reducing the font size and the vertical height of each entry in the Secondary menu. I want to reduce vertical of the menu. Thanks.

#153359 Copied

11 Answers
8theme

Support staff

January 30, 2017 at 08:40
Hello,
```
.secondary-menu-wrapper .menu li > a {
	font-size:12px;
  	padding-top:5px;
  	padding-bottom:5px;
}
```
Regards
#153404 Copied
George

Participant

January 30, 2017 at 17:19

Thanks. That works great in reducing font size and padding above/below menu title, but how about reducing the vertical height of each Title box itself?

#153495 Copied
Rose Tyler

Support staff

January 31, 2017 at 14:47
Hello,

Also use this code:
```
.global-header-center.et-secondary-menu-on .secondary-menu-wrapper .menu > li > a {
    padding-top: 10px; 
    padding-bottom: 10px; 
}
```
Regards
#153563 Copied
George

Participant

January 31, 2017 at 16:15

Unfortunately neither of the 2 css code snippets you provided had any affect in reducing the vertical height of the Secondary Menu Title rows. The font size adjustment worked great.

#153571 Copied

Rose Tyler

Support staff

January 31, 2017 at 16:24

Hello,

Please, add !important http://prntscr.com/e2pss8

Regards

#153573 Copied

George

Participant

January 31, 2017 at 17:40

That did it!!

Can you also give me the css code for doing the same thing on the mobile menu? Changing font size and reducing vertical height of the menu title box.

#153586 Copied
Rose Tyler

Support staff

February 2, 2017 at 13:13
Hello,
```
.mobile-menu-wrapper .menu > li > a {
    line-height: 45px !important;
    font-size: 12px;
}
.mobile-menu-wrapper .menu > li .open-child:before {
    line-height: 45px;
}
.mobile-menu-wrapper .links li a {
    line-height: 45px !important;
}
.mobile-menu-wrapper .mobile-sidebar-widget {
    padding-top: 15px;
    padding-bottom: 15px;
}
```
Regards
#153748 Copied
George

Participant

February 2, 2017 at 15:54

Thanks. This css code works great in adjusting the main mobile menu BUT if there it does not change anything on the 2nd level menu which remains the original font size and vertical height for each row. Looks like there is some additional coding. Thanks.

#153781 Copied
Rose Tyler

Support staff

February 2, 2017 at 16:24
Hello,

Change previous code to:
```
.mobile-menu-wrapper .menu > li > a, .mobile-menu-wrapper .menu > li .sub-menu li a {
    line-height: 45px !important;
    font-size: 12px;
}
.mobile-menu-wrapper .menu > li .open-child:before, .mobile-menu-wrapper .menu > li .sub-menu .menu-back:before {
    line-height: 45px;
}
.mobile-menu-wrapper .links li a {
    line-height: 45px !important;
}
.mobile-menu-wrapper .mobile-sidebar-widget {
    padding-top: 15px;
    padding-bottom: 15px;
}
```
Regards
#153785 Copied
George

Participant

February 2, 2017 at 23:57

Thanks! Your new css changes font size/row height just fine on the mobile menu as requested. Appreciate the help.

#153843 Copied

Rose Tyler

Support staff

February 3, 2017 at 14:17

Hello,

You’re welcome!

Regards

#153897 Copied
Viewing 12 results - 1 through 12 (of 12 total)