WordPress.org

Ready to get started?Download WordPress

Forums

Header and navigation problems (4 posts)

  1. csgillis
    Member
    Posted 7 years ago #

    I was wondering if anyone had a clue as to why my navigation has this gap on it and is pushed way to the right:

    http://saltlinestudio.com/blog

    It should look like - http://saltlinestudio.com

    I've tried so many combinations with the CSS and have not been able to fix this bug.

    Any help on this would be greatly appreciated.

  2. csgillis
    Member
    Posted 7 years ago #

    Any thoughts on this bug?

  3. whooami
    Member
    Posted 7 years ago #

    thats a bug? you do this for a living or no?

    Your CSS between the 2 pages isnt the same..

    On the main page, you have:

    #nav {
        margin: 0 auto 0 auto;
        background:#46402E;
        padding:0px 20px 15px 0;
        width: 680px;
        height:15px;
        }
    #nav li {
        margin: 0;
        display: inline;
        padding: 0px 18px 15px 0;
        border-right: 1px solid #716759;
        list-style: none;
        }
    #nav a {
        float: left;
        line-height: 14px;
        font-weight: bold;
        margin: 7px 10px 7px 10px;
        text-decoration: none;
        color: #E0DAD2;
        }
    #nav a:hover {
        color: #B8B2AB;
        }
    #nav a:active {
        font-weight: bold;
        color: #fff;
        }
    #nav ul{
        margin:0;
        padding:0;
        list-style:none;
        }
    #nav li {
        float: left;
        margin:0;
        padding:1px;
        font-family: Georgia, serif;
        font-size: 69%;
        letter-spacing: 1px;
        text-transform: uppercase;
        }

    On the blog page, you have:

    #navbar {
        margin: 0;
        background:#46402E;
        padding:0 20px 30px 0;
        width: 690px;
    	}
    #navbar li {
        display: inline;
        border-right: 1px solid #716759;
        list-style: none;
    	}
    #navbar a {
        float: left;
        line-height: 14px;
        font-weight: bold;
        margin: 7px 10px 7px 10px;
        text-decoration: none;
        text-transform: uppercase;
        color: #E0DAD2;
    	}
    #navbar a:hover {
        color: #B8B2AB;
        text-transform: uppercase;
    	}

    forget the fact that the id is named differently. Look at the code.

    How about:

    #navbar {
        margin: 0 auto 0 auto;
        background:#46402E;
        padding:0px 20px 15px 0;
        width: 680px;
        height:15px;
        }
    #navbar li {
        margin: 0;
        display: inline;
        padding: 0px 18px 15px 0;
        border-right: 1px solid #716759;
        list-style: none;
        }
    #navbar a {
        float: left;
        line-height: 14px;
        font-weight: bold;
        margin: 7px 10px 7px 10px;
        text-decoration: none;
        color: #E0DAD2;
        }
    #navbar a:hover {
        color: #B8B2AB;
        }
    #navbar a:active {
        font-weight: bold;
        color: #fff;
        }
    #navbar ul{
        margin:0;
        padding:0;
        list-style:none;
        }
    #navbar li {
        float: left;
        margin:0;
        padding:1px;
        font-family: Georgia, serif;
        font-size: 69%;
        letter-spacing: 1px;
        text-transform: uppercase;
        }

    sigh, and people get paid to do this, un-fricken-believable :(

  4. csgillis
    Member
    Posted 7 years ago #

    Thanks for the post. I'm new to wordpress and actually laying sites out with CSS instead of tables. No I haven't done this for a living, but have been a web/print graphic designer for 7 years (if you know they do?)

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags