CSS: Adjusting Header Size

Site: www.connectsolutions.com

Hi there:

I’d like to adjust the size of my header so it isn’t as “tall”. Currently, in our CSS file I see:

#header .rays {
background:url(images/_global/rays.png) 50% 0 no-repeat;

#header .header-area {
margin:0 auto;
padding:38px 0 33px;

I’ve tried multiple things:

  1. Adjusting the size of rays.png -> no affect on the size of the header.
  2. I’ve attempted to include “height 150px;” in the above code -> this made the header taller (expanding on what is already there).
  3. I’ve attempted to remove “#header .rays {
    background:url(images/_global/rays.png) 50% 0 no-repeat;
    }” -> this had no impact even with the “height 150px;” included.

I just don’t want as much dead space around my menu and logo.

Any advice on how to decrease the size of the header?


The padding is causing the issue.
Reduce the top and bottom padding and everything works.

Barry - thanks for the help. That’s exactly what I needed!