Support » Fixing WordPress » How do I close the gap between the content and navigation bar?

  • If you look at my site: SortofBeautiful there is a really small margin or gap between my middle content and the navigation bar and it’s driving me crazy. It was not there a few days ago. Then suddenly my wrapper disappeared and I had that gap. I added overflow: hidden and my wrapper showed back up but that gap is still there. The -1px I had for the content top margin doesn’t seem to have any affect anymore and I don’t know why or how to fix it. Please advise!


    Here’s what my wrapper looks like

    #wrap {
    background: #ffffff url(images/bgm.gif) repeat-y center top;
    overflow: hidden;
    width : 998px;
    color : #ec9dfa;
    font-size : 11px;
    font-family : Verdana, Helvetica, Sans-Serif;
    margin : 0 0 0 0;
    padding : 0;
    border : 1px solid #ffffff;

    Here’s my content middle

    #contentmiddle {
    float : left;
    width : 470px;
    background-color : #630094;
    color : #ffffff;
    margin : -1px 2px 10px 10px;
    padding : 0 5px 0 5px;

Viewing 10 replies - 1 through 10 (of 10 total)
  • change #wrap margin from 0 0 0 0 to -1px 0 0 0

    Thanks for the response. That closes the gap, but when I do that the bottom border of my navigation bar completely disappears. Is there a fix or another way?

    Thanks again

    in #wrap add

    border-top: none

    Tried that and my border-bottom is still gone. I want that little space closed but I still want that very thin line separating the navigation from the content. I had it perfect before and have no idea how everything got messed up, especially when I never changed anything.

    Anyways, thanks for your patience and your help.

    I made the change I wrote you to make, here, in Firebug and saw the purple center section pull up to meet the divider line, the lower border of your nav. the nav bottom divider line was visible to the right and left of the purple content box.

    If you did not see the lower nav line to the left and right of the purple content box with the 2nd change I suggested, I suggest you put the border-top: none back in and refresh your browser a few times as I clearly see it here. Your browser may have been displaying an earlier version.

    I don’t have any further suggestions since, unless I don’t understand what you are trying to accomplish (which is possible), I am seeing here the result you asked for. When the purple content box exactly meets the nav lower divider bar (the one pixel white space is removed) the optical illusion is going to make the purple box and the divider line look like one unit. If you see the lower nav divider line to the left and right of the purple content box, that is your proof the line still exists. I see it here.

    I hope you find the way to get the result you are after. Sorry it stopped working for you.

    I changed the wrap margin to -1px and added the border-top: none and did a hard refresh and it’s still a no go. My nav line is gone when I do that in IE and Firefox.

    But thanks for trying to help! I’m gad someone can see it even though I can’t. Maybe it’s just my computer. I’m going to go see what it looks like when pull it up on the computer in the loft.

    you are supposed to remove the margin -1px, return it to 0

    and replace it with the border-top: none;

    My bad. Did that, and the white space is back. It’s okay, I guess I’ll just have to live with it.

    Not sure, but this could be a line-height issue. Give it a try!

    I’ll look into that. Thanks.

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘How do I close the gap between the content and navigation bar?’ is closed to new replies.