Removing ugly gap (with SSs and URL to site)

[jeronimoh]

Hi. I'm setting this site up. Can anybody help me get rid of the gap encircled in screenshot1.jpg?. Also, if anybody can point me in the direction of getting the headline the way it is in home.jpg. Thanks in advance.

[kobra]

First off your logo is not contained inside the logoWrapper div as you have placed the #logo tag as -200px
I suggest that you rearrange this and apply the background image only to the logoWrapper and give it a width of 200px to facilitate your design. Then you will not need the -200px for #logo as the container will be positioned correctly

[jeronimoh]

First off your logo is not contained inside the logoWrapper div as you have placed the #logo tag as -200px
I suggest that you rearrange this and apply the background image only to the logoWrapper and give it a width of 200px to facilitate your design. Then you will not need the -200px for #logo as the container will be positioned correctly

Ok, I'll do it. You think this will get rid of the gap?

[kobra]

Ok, I'll do it. You think this will get rid of the gap?

I did not see a "GAP" per se from your pics What I did see is the background repeating across the width and doing what I stated will move the background image to the logoWrapper where you want it and not in the body tag(remove it from the body tag)

[jeronimoh]

I did not see a "GAP" per se from your pics What I did see is the background repeating across the width and doing what I stated will move the background image to the logoWrapper where you want it and not in the body tag(remove it from the body tag)

Can you take a look, it didn't work out..

[kobra]

Several adjustments and note that I am limited as to what I can see and then cross browser viewing changes - as you need to make these and then all can see any remaining issues.

Also, "it didn't work out.." is not descriptive as I do see some change - so being more specific allows others to assist also.

try altering, seperating etc so that you end up with this(these are in order of appearance and not exactly as they appear) - and always maintain a copy of your original...

#logo {
	float: left;
	position: relative;	
}

#logoWrapper {
	height: 65px;
	background-image: url(../images/fondo70.jpg);
	width: 200px;
}

#navMainWrapper {
        width: 75%;
        float: right;
        clear: none;
}

#navMainWrapper ul li a:link {
	font-weight: bold;
	color: #34A02C;
	height: 1%;
	width: 75%;
	text-align: right;
	margin-left: 200px;
	background-color: White;
}

[jeronimoh]

I made the changes, but still no go. I can't figure out where that gap comes from.

[jeronimoh]

It worked with your image, you are the master of Zen-Cart. Thanks a lot. Can you draw any conclusions on this?

[kobra]

Only that rearranging the header as you have caused other issues and these might have been avoided initially but I was working with what you had.

[jeronimoh]

On FireFox works perfectly, but on IE the gap still shows... any suggestions? Thanks.