Forums

Give help. Get help.

  • # July 14, 2013 at 9:26 pm

    Please take a look at the following page,
    http://www.knowledgenotebook.com/index4.html

    I’m now having trouble with adding extra space between the header image and menu items. The header image is defined by the last attribute of the following code,
    #header{ min-height:150px; border-radius: 25px 25px 0 0 ; background-color:linear-gradient(#BCD3FF, #EEF8FA);background: url(‘../images/header.logo.png’) no-repeat;} (see the CSS file link below).

    And the CSS elements header and for UL and LI etc. can be found from the following URL,
    http://www.knowledgenotebook.com/css/main_new2.css

    Many thanks.

    # July 14, 2013 at 9:33 pm

    Increase left margin on your #header ul

    # July 14, 2013 at 9:34 pm

    I’m not sure if there’s a better/more efficient solution out there (maybe someone else will comment it here), but here’s how I fixed it. I simply added more `margin-left` to the `ul`. I changed it from

    #header ul {
    margin: 2px 0 0 90px;
    padding: 0;
    height: 40px;
    }

    to

    #header ul {
    margin: 2px 0 0 144px;
    padding: 0;
    height: 40px;
    }

    @jurotek beat me by a minute! :P

    # July 14, 2013 at 9:41 pm

    :) Unintended tho, I guess I had lot less to write

    # July 14, 2013 at 9:44 pm

    @jurotek No worries. :)

    # July 14, 2013 at 9:46 pm

    There’s more ways then one to remedy this problem besides increasing left margin. Here’s one of top of my head

    .nav { text-align: center; }
    .nav ul, .nav li, .nav a { display: inline-block; *display: inline; zoom: 1; }

    # July 14, 2013 at 9:56 pm

    Without looking at the code, looks like you could give width to social media wraper just enough to contain it. Add position relative to header and place social media wraper absolutely in header and give it left and top dims. to clear logo.

    # July 14, 2013 at 10:10 pm

    I would do it with position absolute rigth:Xpx; top:Xpx; Just make sure your header is positioned relative

    # July 14, 2013 at 10:24 pm

    :) Add position absolute rigth:Xpx; top:Xpx; to your class AddThis and add position relative to header like

    #header{
    position:relative;
    min-height:150px;
    border-radius: 25px 25px 0 0 ;
    background-color:linear-gradient(#BCD3FF, #EEF8FA);background: url(‘../images/header.logo.png’) no-repeat;
    }

    Then place div class AddThis inside your header

    # July 14, 2013 at 10:44 pm

    I don’t see wrapper2 in you html, it’s actually #wrapper which holds social media buttons

    # July 14, 2013 at 10:53 pm

    Nope. This is what you got currently in there






    # July 14, 2013 at 11:13 pm

    Ok, I emptied cache and now I see it. Let me look and I get back to you

    # July 14, 2013 at 11:37 pm

    Oh man what did you do? The social buttons are gone. Plus you made copy of css file and link to it also. So now you got links to 2 css files which conflict with each other. Which css file out of those 2 is suppose to be current?

    # July 14, 2013 at 11:42 pm

    I tell you what. Why don’t you put the relevant html and css on Codepen and we take it from there. I am going to bed right now anyways so maybe someone steps in.

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

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag