Support » Themes and Templates » Reduce size of header in custom theme

  • Resolved nathanernest


    Hi Everybody,

    We have had a custom template made for us at our site

    Can somebody please visit the site and explain to me how to reduce the size of height of the blue header?

    I’ve had some experience in making websites before but I don’t want to play with things that might cause issues with our site. I’m assuming that this is a field in the style.css but I haven’t a clue what to look for. Any tips?

    Also, our menu wraps over to another line in some browsers and different zoom levels.

    Can I increase the length that the menu has so it wont wrap over to the next line? In some browsers with the correct zoom it looks like I want.

    Please note that IN WINDOWS this will probably work correctly. I have had reports that the page doesn’t display properly in Firefox or Chromium in Ubuntu and Safari in OSX.

    Thanks everybody.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The header height is being affected by the padding in this css — line 133 of style.css:

    #header {
        padding: 40px 0;
        position: relative;
        z-index: 2;

    Reduce the 40 to fit your preference.

    The width of the menu is set in 960.css by this:

    .container_12 .grid_8 {
        margin-left: 40px;
        width: 660px;

    But as you will see if you change it, it jumps to the lower line — because of the logo on the left. You might be able to get it to be wider by messing around with the CSS in that area — but be sure to save a copy of your CSS before changing anything. The best way to work with CSS is using a tool such as Firebug — which lets you look at the CSS and try changes in the browser without making them in the page code yet.

    And BTW, bumping is against the forum rules — will generally get removed by a moderator…

    Wow thanks very much! I’m very grateful for your help!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Reduce size of header in custom theme’ is closed to new replies.