Adjust main menu height

Featured Theme Forums Twenty Plus Pro Adjust main menu height

This topic contains 4 replies, has 4 voices, and was last updated by  zeaks 4 months, 2 weeks ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #13483

    Lee
    Participant

    I have the following code in 20+pro 1.3 css and I want the full logo showing on http://pastebin.com/hNGc7HeN

    .main-navigation {
      line-height: 12px;
      color: #77dad3;
    }
     
    .main-navigation li ul li a, .main-navigation li a:hover {
        background: none repeat scroll 0 0 #ffffff !important;
    }

    I changed the height to line-height: 30px in both css elements but the full logo isn’t displaying? Could you help me show the full logo?

    Thanks

    .main-navigation {
    line-height: 12px;
    color: #77dad3;
    }
    
    .main-navigation li ul li a, .main-navigation li a:hover {
    background: none repeat scroll 0 0 #ffffff !important;
    }

    I changed the height to line-height: 30px in both css elements but the full logo isn’t displaying? Could you help me show the full logo?

    Thanks

    • This topic was modified 6 months, 2 weeks ago by  zeaks.
    #15407

    Zeaks
    Participant

    Hi lee. Try increasing the header area height. Something like this
    #header-logo { height: 150px; }

    #header-logo { height: 150px; }
    #15408

    Lee
    Participant

    It works. Thanks.

    #17719

    TRUSTMEHER
    Participant

    Also I would like to know how to adjust main menu background color like you have in Tan theme in other themes like dark or light ?

    #17720

    zeaks
    Keymaster

    If you open colors/tan.css you’ll see around line 151 where the menu CSS begins. I’d suggest taking a look at that then adding the changes to the custom CSS area in appearance > theme options

    This should get you started, add your own background color where the XXXXX is.

    @media screen and (min-width: 600px) {
    	.main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul {
    		background-color: XXXXX;
    		}
    	.main-navigation li ul li a, .main-navigation li a:hover {
    		background-color: XXXXXX;
    		}
    	}

    Make sure to add the changes between the @media lines just like it is above, otherwise you’ll end up also changing the color of the mobile menu.

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.