Need help? Check out our Support site, then


Reducing height of #nav menu bar

  1. I have been trying to reduce the height of the #nav menu bar on the Enterprise theme. Originally, it is set at 45px. I have changed the height to 30px, but the black background's height does not get smaller.

    This work is being done on a private blog that I am working on, but the menu bar can be seen at the Enterprise Demo here: http://enterprisedemo.wordpress.com/

    The code I've applied to the #nav code is:

    #nav {
    min-height: 30px;
    {

    The original code is:

    #nav {
    min-height: 45px;
    }

    Why wouldn't the change take place?

    Thanks!

    The blog I need help with is real-agenda.com.

  2. You have set a "minimum" height. That means it will not get shorter than that number. Because a "min-height" is set in the original CSS, set a max-height as well and make them both the same. (I tried setting a regular height, but the min-height overrides it no matter what.)

    min-height: 30px;
    max-height: 30px;

    You will also have to set a line height in #supernav ul otherwise the current page background image will hang out the bottom. 5px seems to work with a height of 30px.

    #supernav ul {
    line-height: 5px;
    }
  3. You'll also have to set the line-height to 5px in .navright (RSS icons on right end of menu bar).

    .navright {
    line-height: 5px;
    |
  4. Marvelous! Thanks!

  5. You are welcome.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags