On www.trance-sylvania.com where it has the MENU like that white section how do i fix that big gap?

Im a complete noob with this.../:
please help....

...
In the style.css file, find this line:

#header { width:100%; height:132px; position:fixed; top:0; left:0; z-index:100; padding:10px 0 20px 0; overflow:hidden; }

and remove the height attribute ( height:132px; )

That should do the trick.

That didn't work, it just made it worse lol

alright then i tried playing with the 132px around whatever i do it still makes it look worst
and if i make it SMALLER my MENU wont appear.

ughh

EDIT: Oh, and as I said before, remove the height attribute.

It looks fine to me. But then again, as said in your last thread, if your window width is too small it messes it up a little. 1074px seems to be the magic number for the inner width. If we add in the browsers border and scroll bar etc. we can round it to an upper limit of 1200px. So if your screen resolution is less than 1200px wide, it messes up your design.

Anyhow, the big gap you are refering to is because of the padding that is applied to all div tags in the header, on this line

#header div { float:left; margin:0; padding:20px 0 18px 30px; text-shadow:none; }

This padding is applied both to the pages' title to the left (div tag with class blogInfo) and the menu row (div tag with class stuffing) underneeth it. Try playing around with the padding a little.

I would suggest modifying the vertical padding in the #header div a bit and adding seperate paddings to the blogInfo and stuffing classes.

Perhaps something like this?

#header div { float:left; margin:0; padding: 5px 0 10px 30px; text-shadow:none; }
#header .blogInfo { padding: 20px 0 5px 30px; }
#header .stuffing { padding: 0; }

Wow, haha look @ it, it completely destroyed it ! lol

I don't understand how you managed that... Are you sure you made the changes I suggested and nothing more? Because it looked great in my browser yesterday when I edited the code, and now all the header elements is completely out of position.

Ok, I think I know what you did wrong
There was a line for styling the header itself, and there were another line for its' div tags, as in

#header { some styles here... }

/* and a bit further down */

#header div { some styles here }

You edited the wrong one. I hope you have some kind of backup or a good memory of how the #header line looked before, so you can restore it. Then make the changes I wrote about before on the #header div line.

Alright done (:
look at it now looks way nicer lol !
the menu just went more up but the huge gap is still there

EDIT: Wow look i fixed it ! i edited this line

#header                        { width:100%; height:132px; position:fixed; top:0; left:0; z-index:100; padding:10px 0 20px 0; overflow:hidden; }

instead of the 132px i changed it to 95px!

So that fixed the gap! now theres a slight gap between that and the content!
how do i fix that?

also appreciate all the help!

Find the row with the body styling, and adjust the top padding (in bold text below).

body { padding:170px 25px 50px 25px; margin:0; }

 body { padding:170px 25px 50px 25px; margin:0; }

i found that line and edited to diffrent numbers multiple times and nothing changes at all?

EDIT: nevermind I FINALLY GOT IT looks good? (((:

Yes, it looks fine.