Computer height of top border, where?

The top green bar is too tall. I'm using Firebug and it's telling me the computer height is 37 pixels. I don't know where, or how, that is being computed.

Url is http://shopplusplus.com/shop/

Should be navMainWrapper.

From my css, I have:

.navMainWrapper .boxcontent {display:block; background:#2D6B3C; border-left:2px solid #2D6B3C; border-right:2px solid #2D6B3C; height:25px}

but the height is displaying as 37 pixels. (the height was not part of the original css, that was my effort to change it)

The other lines releval teh navMainWrapper are:

/* navMainWrapper Inset 3D Curved */

.navMainWrapper {background: transparent; width:100%; margin:0 auto; font-weight: bold; color: #ffffff;}
.navMainWrapper h1, .navMainWrapper p {margin:0 10px;}
.navMainWrapper h1 {font-size:2em; color:#fff; letter-spacing:1px;}
// .navMainWrapper p {padding-bottom:0.5em;}

.navMainWrapper .top, .navMainWrapper .bottom {display:block; background:transparent; font-size:1px;}
.navMainWrapper .b1, .navMainWrapper .b2, .navMainWrapper .b3, .navMainWrapper .b4, .navMainWrapper .b1b, .navMainWrapper .b2b, .navMainWrapper .b3b, .navMainWrapper .b4b {display:block; overflow:hidden;}
.navMainWrapper .b1, .navMainWrapper .b2, .navMainWrapper .b3, .navMainWrapper .b1b, .navMainWrapper .b2b, .navMainWrapper .b3b {height:1px;}
.navMainWrapper .b2 {background:#2D6B3C; border-left:2px solid #2D6B3C; border-right:2px solid #2D6B3C;}
.navMainWrapper .b3 {background:#2D6B3C; border-left:2px solid #2D6B3C; border-right:2px solid #2D6B3C;}
.navMainWrapper .b4 {background:#2D6B3C; border-left:2px solid #2D6B3C; border-right:2px solid #2D6B3C;}
.navMainWrapper .b4b {background:#2D6B3C; border-left:2px solid #2D6B3C; border-right:2px solid #2D6B3C;}
.navMainWrapper .b3b {background:#2D6B3C; border-left:2px solid #2D6B3C; border-right:2px solid #2D6B3C;}
.navMainWrapper .b2b {background:#2D6B3C; border-left:2px solid #2D6B3C; border-right:2px solid #2D6B3C;}

.navMainWrapper .b1 {margin:0 5px; background:#2D6B3C;}
.navMainWrapper .b2, .navMainWrapper .b2b {margin:0 3px; border-width:0 2px;}
.navMainWrapper .b3, .navMainWrapper .b3b {margin:0 2px;}
.navMainWrapper .b4, .navMainWrapper .b4b {height:2px; margin:0 1px;}
.navMainWrapper .b1b {margin:0 5px; background:#fff;}

.navMainWrapper .boxcontent {background:#2D6B3C; border-left:2px solid #2D6B3C; border-right:2px solid #2D6B3C;}}

.navMainWrapper .boxcontent {display:block; background:#2D6B3C; border-left:2px solid #2D6B3C; border-right:2px solid #2D6B3C; height:25px}

.boxcontent

is not a core style class, so it must have been edited into the code.

What is it's purpose? (You will probably see it in:

includes/templates/shopplus_2/common/header.php )

It seems to be adding a lot to the element... Just why is unclear.

The top green 'bar' originally had rounded corners. The client did not like them.

I commented out this code from /shop/includes/templates/shopplus_2/common/tpl_header.php:
// <b class="top"><b class="b1"></b><b class="b2"></b><b class="b3"></b><b class="b4"></b></b>

which was creating them. I think this explains the extra stuff in the css but I'm still at a loss as to why it's 37 pixel high.

If you are not using the feature provided for in that header, try this...

Re-name it to tpl_header.BAK

This will invoke the DEFAULT tpl_header.php in the template_default template - which will (if not modified by someone), be CORE code.

It may then be easier to see where your problem lies.

Thanks for the suggestion. I tried and and with some more trial and error, was able to modify the css to reduce the height.

Thanks very much!