Support » Theme: Customizr » Change menu height

  • I would like to remove span 5 the social block and span 7 the site title so that I can make the height of the menu bar smaller. Where do I do it or is there another way to reduce the height of the menu bar.

Viewing 15 replies - 1 through 15 (of 15 total)
  • Changing the span values would reduce the width of the menu bar, not its height. I think modifying the CSS on a child theme or a custom CSS plugin would be a better option. Could you post a link to your site?

    I don’t want to change the span values I want to get rid of them so the height of menu can be changed or collapse itself due to their absence.
    My site is

    Hi, I see what you mean. However, the span is needed as part of the grid system to keep the navbar to the right side and preserve the layout. You can change the height by modifying the height value on this CSS rule:

    .row-fluid [class*="span"] {
        -moz-box-sizing: border-box;
        display: block;
        float: left;
        margin-left: 2.5641%;
        min-height: 30px;
        width: 100%;

    However, this would affect all rows. Therefore, I suggest you leave the rule above as it is and enter this new CSS rule instead, after the one above, which should overwrite the 30px height:

    .navbar-wrapper {
      height: 20px;

    Or whatever height you want.

    One more problem that I see is the position of the menu items: they should be vertically aligned to the middle, but the CSS for this would depend on the height that you decide the menu bar should have.

    I hope it works.

    Don’t know if I get your point.
    You want to hide social-blocks and site description in navbar?
    You can easily do that with css (or php if you want):
    CSS version:

    .navbar-inner .social-block {
    display: none;
    .navbar-inner .site-description {
    display: none;

    Was that?

    I’m new to WordPress, my first site, but if I don’t display them aren’t they still there just not visible? I want to change the height but if there are items in the menu bar then they are taking room.

    antonietta456 – When I changed the wrapper height it just moved the entire menu container down.

    I don’t understand: do you want to decrease the menu bar’s height or get rid of site title and description? Or both?

    I can see now that there are 2 elements inside the menu bar that are not visible on the page. Now I think I understand! I think that you can either put a display none on the elements (this would also eliminate the space the elements take), as already posted by d4z_c0nf above, or adjust the template for that page.

    For the second solution, you need to copy over the template file for that page into your child theme and simply delete both the social block div and the inside-site-description h2 element.

    sorry antonietta but that code is wrong for 2 reasons:
    1) will hide all social-block & inside-site-description classes.
    2) inside-site-description class doesn’t exist.

    Yeah, sorry, it’s .site-description: copying and pasting from firebug is a bit cumbersome at times. If .social-block is repeated throughout the site, then being more specific, like you did in the previous post, is the right solution. Also, copying the template from the parent to the child and deleting the div and h2 could achieve the same result.

    Yeah it happens, just wanted to point it for hmd01810
    If he’s new to wordpress, and I presume also to css and php, find the right file and those divs could be a little hard.
    start from here:

    It looks great, whatever hmd01810 is comfortable doing.

    I think I will leave it for now. I feel fairly comfortable with CSS but am completely lost with php. I may place the church address in the site description box. I wanted the container shorter because I wanted to change the background color to black or dark green, but it would look too heavy if it is that fat.
    Thanks for your help and I think I will call this resolved.

    Oh I see, so but what’s the problem with that css code I gave you?
    Doesn’t work as expected?

    I’m sorry d4z, I thought I had already turned them off with the code
    .span7, .span11 {display:none;}
    Tried your code and it did just what I want. Thank you so much.
    I would like to move the menu bar down now and I think I can do that with the the code Antonietta gave earlier which moved the menu bar down.
    .navbar-wrapper {
    height: 20px;
    (or whatever number of pixels work)

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘Change menu height’ is closed to new replies.