Title: Menu bar height Last modified: September 1, 2016 --- # Menu bar height * Resolved [lazar96](https://wordpress.org/support/users/lazar96/) * (@lazar96) * [9 years, 10 months ago](https://wordpress.org/support/topic/menu-bar-height-1/) * Hi, * Is there a way to make the Flymag menu bar and text etc thinner? * tried to change the CSS myself I can’t suss it. * Thanks Viewing 5 replies - 1 through 5 (of 5 total) * [danielmace](https://wordpress.org/support/users/danielmace/) * (@danielmace) * [9 years, 10 months ago](https://wordpress.org/support/topic/menu-bar-height-1/#post-7615449) * Have you tried making changes to the font weight? * Thread Starter [lazar96](https://wordpress.org/support/users/lazar96/) * (@lazar96) * [9 years, 10 months ago](https://wordpress.org/support/topic/menu-bar-height-1/#post-7615454) * Yep but the bar/buttons don’t get smaller with it * [danielmace](https://wordpress.org/support/users/danielmace/) * (@danielmace) * [9 years, 10 months ago](https://wordpress.org/support/topic/menu-bar-height-1/#post-7615457) * Ah, ok! * Looks like you’re going to need to change a combination of: * – Font Size / Weight – Padding – Line height * And you should see some better results! * Thread Starter [lazar96](https://wordpress.org/support/users/lazar96/) * (@lazar96) * [9 years, 10 months ago](https://wordpress.org/support/topic/menu-bar-height-1/#post-7615488) * This is my themes code for menus….?? * ``` /*-------------------------------------------------------------- Menus --------------------------------------------------------------*/ .main-navigation { clear: both; display: block; float: left; width: 100%; font-family: 'Oswald', sans-serif; font-weight: 300; padding: 0 30px; background-color: #fff; border-top: 3px solid #444; border-bottom: 3px solid #444; border-left: 1px solid #ebebeb; border-right: 1px solid #ebebeb; } .main-navigation ul { list-style: none; margin: 0; padding-left: 0; } .main-navigation li { float: left; position: relative; padding: 15px; font-size: 16px; text-transform: uppercase; -webkit-transition: all 0.3s; transition: all 0.3s; margin: -3px 0 -1px; font-weight: 400; } .main-navigation a { display: block; text-decoration: none; color: #505559; position: relative; z-index: 11; } .main-navigation ul ul { box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2); float: left; position: absolute; top: 100%; left: -999em; z-index: 99999; background-color: #272E37; } .main-navigation ul ul ul { left: -999em; top: 0; } .main-navigation ul ul a { width: 200px; color: #fff; } .main-navigation ul ul li { text-transform: none; box-shadow: none; font-weight: 300; border-bottom: 1px solid #fff; } .main-navigation ul ul li:last-of-type { border: 0; } .main-navigation ul ul li:hover { box-shadow: none; } .main-navigation li:hover > a, .main-navigation li:hover::before, .main-navigation ul ul li::before { color: #fff; } .main-navigation ul li:hover > ul { left: 0; } .main-navigation ul ul li:hover > ul { left: 100%; } .main-navigation li::before { font-family: Fontawesome; color: #1E262D; float: left; margin-right: 5px; -webkit-transition: color 0.3s; transition: color 0.3s; } .slicknav_nav li:hover { background-color: transparent; } .slicknav_nav li::before { display: none; } .main-navigation a { float: left; } .main-navigation ul ul a { float: none; } .menu-fallback { font-size: 20px; line-height: 50px; } .site-main .comment-navigation, .site-main .paging-navigation, .site-main .post-navigation { margin: 0; padding: 30px; overflow: hidden; background-color: #fff; border-left: 1px solid #ebebeb; border-right: 1px solid #ebebeb; border-bottom: 1px solid #ebebeb; } .custom-menu-item-1:hover, .custom-menu-item-1 .sub-menu { background-color: #F0696A; } .custom-menu-item-2:hover, .custom-menu-item-2 .sub-menu { background-color: #5B8AC0; } .custom-menu-item-3:hover, .custom-menu-item-3 .sub-menu { background-color: #ED945D; } .custom-menu-item-4:hover, .custom-menu-item-4 .sub-menu { background-color: #9F76CA; } .custom-menu-item-0:hover, .custom-menu-item-0 .sub-menu { background-color: #7FC09B; } .custom-menu-item-1 { border-top: 3px solid #F0696A; } .custom-menu-item-2 { border-top: 3px solid #5B8AC0; } .custom-menu-item-3 { border-top: 3px solid #ED945D; } .custom-menu-item-4 { border-top: 3px solid #9F76CA; } .custom-menu-item-0 { border-top: 3px solid #7FC09B; } ``` * [Suyogya Shukla](https://wordpress.org/support/users/themeislesupport/) * (@themeislesupport) * [9 years, 10 months ago](https://wordpress.org/support/topic/menu-bar-height-1/#post-7615661) * Hey there, * Apologies for the late reply. * Please add following custom CSS to the theme and it should do the trick: * ``` .main-navigation a, .main-navigation li::before{ font-weight: 100; } .main-navigation{ border-top: 1px solid #444; border-bottom: 1px solid #444; } ``` * You can add it in your child theme’s stylesheet directly or using a plugin like [Advanced CSS Editor](https://wordpress.org/plugins/advanced-css-editor/), for the sake of simplicity. Please don’t add it in the theme’s main stylesheet (without using a child theme) as all the changes will be lost when the theme is updated. Hope you understand. Viewing 5 replies - 1 through 5 (of 5 total) The topic ‘Menu bar height’ is closed to new replies. * ![](https://i0.wp.com/themes.svn.wordpress.org/flymag/2.0.6/screenshot.png) * FlyMag * [Support Threads](https://wordpress.org/support/theme/flymag/) * [Active Topics](https://wordpress.org/support/theme/flymag/active/) * [Unresolved Topics](https://wordpress.org/support/theme/flymag/unresolved/) * [Reviews](https://wordpress.org/support/theme/flymag/reviews/) * 5 replies * 3 participants * Last reply from: [Suyogya Shukla](https://wordpress.org/support/users/themeislesupport/) * Last activity: [9 years, 10 months ago](https://wordpress.org/support/topic/menu-bar-height-1/#post-7615661) * Status: resolved