Grow your CSS skills. Land your dream job.

Video tutorial help

  • # December 21, 2009 at 1:55 pm

    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

    # December 21, 2009 at 1:59 pm

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

    # December 22, 2009 at 5:31 am

    Hi, here it is:

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

    thanks

    Mike

    # December 22, 2009 at 6:55 am

    In your style.css on line 47.

    Add following code to your ul#nav :

    position : relative ;
    top: -10px;

    # December 22, 2009 at 7:49 am

    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

    # December 22, 2009 at 11:42 am

    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.

    # December 22, 2009 at 12:11 pm

    thanks!

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".