Video tutorial help

[insanepenguin]

Hello,

I’ve really enjoyed the video tutorial, for a beginner like me it’s brilliant!

I’ve followed the guide and my xhtml/css conversion is 99% good the only problem I’m having is the background after the header
is staggered. I used dreamweaver as my text editor and in design mode the header and bg are fine (but the links are staggered) when displaying in a broswer everything is fine apart from the staggered header BG.

Could you give me any tips to fix it?

I’ve included a screenshot, thanks a lot!

Michael

[darren]

could you send a link to the website so we can look at the code

[insanepenguin]

Hi, here it is:

http://www.harpersdesigns.co.uk/test/

thanks

Mike

[uloga]

In your style.css on line 47.

Add following code to your ul#nav :

position : relative ;
top: -10px;

[insanepenguin]

Thanks uloga! now it’s working great :D

If you don’t mind could you explain a little why it wasn’t working correcty and how you fixed it?

*total newb* lol

Cheers

Mike

[AshtonSanders]

Just, FYI:

That spacing is being created by the margin in this css:

p, li {
font-size:1.3em;
line-height:1.4em;
margin-bottom:0.8em;
}

Doesn’t really make any sense, but I’d add:

#nav li {
margin-bottom:0;
}

Then you can remove the -10px hack.

[insanepenguin]

thanks!

[Author]

Posts