Willing to give a whopping $10 via PayPal to anyone who can fix this problem!!!

  • Hey everyone,

    I have a navigation bar on my website: https://sitedemonstration.hostei.com/

    Their are 2 problems:

    1. Whenever I click on either ‘contact’ or ‘about’, their is no white tab that appears like it does on the ‘home’ tab. It should appear when I click on it.

    2. Whenever I click on either ‘contact’ or’ about’, the ‘home’ tab stretches even wider, it isn’t supposed to!

    If you want, you can create some code instead of modifying the code that I already have, it doesn’t really matter.

    After the problem is fixed and functions on my website, please provide your PayPal email address and I will deposit $10 in your account! EASY MONEY!!

    Here is my code:

    /* navigation bar */

#navigation {
        width: 819px;
        height: 34px;
        float: left;
        position: relative;
        top: 0px;
        left: 0px;
        }

#navigation_left {
        width: 11px;
        height: 34px;
        float: left;
        padding: 6px 0 0 11px;
        text-align: right;
        }
#navigation_center {
        width: 654px;
        height: 34px;
        float: left;
        background-position: bottom left;
        background-image: url(https://thanksgoogle.com/wordpress/images/nav-rept.jpg);
        background-repeat: repeat-x;
        padding: 0;
        }

#navigation_center ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
        }

#navigation_center ul li {
        float: left;
        line-height: 34px;
        }

#navigation_center ul li a {
        display: block;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #FFFFFF;
        text-decoration: none;
        font-weight: bold;
        padding: 0px 17px 3px;
        background-image: url(https://thanksgoogle.com/wordpress/images/navline.jpg);
        background-position: right center;
        background-repeat: no-repeat;
        line-height: 39px;
        }

#navigation_center ul li a span {
        color: #FFFFFF;
        display: block;
        padding: 0px 20px 0 10px;
        }

#navigation_center ul li a:hover {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #ffffff;
        text-decoration: none;
        font-weight: bold;
        display: block;
        padding: 0px 17px 3px;
        }

#navigation_center ul li a:hover span {
        color: #ffffff;
        display: block;
        padding: 0px 20px 0 10px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        text-decoration: none;
        font-weight: bold;
        }

#navigation_center ul li a.active, #navigation_center ul li a.current_page_item {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #000000;
        text-decoration: none;
        font-weight: bold;
        background-image: url(https://thanksgoogle.com/wordpress/images/leftnav.png);
        background-repeat: no-repeat;
        background-position: left top;
        display: block;
        padding: 0px 0px 0 10px;
        }

#navigation_center ul li a.active span {
        color: #000000;
        background-image: url(https://thanksgoogle.com/wordpress/images/rightnav.png);
        background-repeat: no-repeat;
        background-position: right top;
        display: block;
        padding: 0px 20px 0 10px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #000000;
        text-decoration: none;
        font-weight: bold;
        }

#navigation_right {
        width: 141px;
        height: 28px;
        float: left;
        padding: 6px 0 0 0;
        }
Viewing 15 replies - 1 through 15 (of 20 total)

  • Hope it will work

    /* navigation bar */

    #navigation {
    width: 819px;
    height: 34px;
    float: left;
    position: relative;
    top: 0px;
    left: 0px;
    }

    #navigation_left {
    width: 11px;
    height: 34px;
    float: left;
    padding: 6px 0 0 11px;
    text-align: right;
    }
    #navigation_center {
    width: 654px;
    height: 34px;
    float: left;
    background-position: bottom left;
    background-image: url(https://thanksgoogle.com/wordpress/images/nav-rept.jpg);
    background-repeat: repeat-x;
    padding: 0;
    }

    #navigation_center ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
    }

    #navigation_center ul li {
    float: left;
    line-height: 34px;
    }

    #navigation_center ul li a {
    display: block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #FFFFFF;
    text-decoration: none;
    font-weight: bold;
    padding: 0px 17px 3px;
    background-image: url(https://thanksgoogle.com/wordpress/images/navline.jpg);
    background-position: right center;
    background-repeat: no-repeat;
    line-height: 39px;
    }

    #navigation_center ul li a span {
    color: #FFFFFF;
    display: block;
    }

    #navigation_center ul li a:hover {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #ffffff;
    text-decoration: none;
    font-weight: bold;
    display: block;
    padding: 0px 17px 3px;
    }

    #navigation_center ul li a:hover span {
    color: #ffffff;
    display: block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    text-decoration: none;
    font-weight: bold;
    }

    #navigation_center ul li a.active, #navigation_center ul li.current_page_item {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #000000;
    text-decoration: none;
    font-weight: bold;
    background-image: url(https://thanksgoogle.com/wordpress/images/leftnav.png);
    background-repeat: no-repeat;
    background-position: left top;
    display: block;
    padding: 0px 0px 0 10px;
    }

    #navigation_center ul li a.active span, #navigation_center ul li.current_page_item a {
    color: #000000;
    background-image: url(https://thanksgoogle.com/wordpress/images/rightnav.png);
    background-repeat: no-repeat;
    background-position: right top;
    display: block;
    padding: 0px 20px 0 10px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #000000;
    text-decoration: none;
    font-weight: bold;
    }

    #navigation_right {
    width: 141px;
    height: 28px;
    float: left;
    padding: 6px 0 0 0;
    }

    im not understanding why you arent using the same css and whatnot thats at https://thanksgoogle.com/wordpress/

    THAT works.

    Oops.. wrong tag

    /* navigation bar */

#navigation {
        width: 819px;
        height: 34px;
        float: left;
        position: relative;
        top: 0px;
        left: 0px;
        }

#navigation_left {
        width: 11px;
        height: 34px;
        float: left;
        padding: 6px 0 0 11px;
        text-align: right;
        }
#navigation_center {
        width: 654px;
        height: 34px;
        float: left;
        background-position: bottom left;
        background-image: url(https://thanksgoogle.com/wordpress/images/nav-rept.jpg);
        background-repeat: repeat-x;
        padding: 0;
        }

#navigation_center ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
        }

#navigation_center ul li {
        float: left;
        line-height: 34px;
        }

#navigation_center ul li a {
        display: block;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #FFFFFF;
        text-decoration: none;
        font-weight: bold;
        padding: 0px 17px 3px;
        background-image: url(https://thanksgoogle.com/wordpress/images/navline.jpg);
        background-position: right center;
        background-repeat: no-repeat;
        line-height: 39px;
        }

#navigation_center ul li a span {
        color: #FFFFFF;
        display: block;
        }

#navigation_center ul li a:hover {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #ffffff;
        text-decoration: none;
        font-weight: bold;
        display: block;
        padding: 0px 17px 3px;
        }

#navigation_center ul li a:hover span {
        color: #ffffff;
        display: block;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        text-decoration: none;
        font-weight: bold;
        }

#navigation_center ul li a.active, #navigation_center ul li.current_page_item {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #000000;
        text-decoration: none;
        font-weight: bold;
        background-image: url(https://thanksgoogle.com/wordpress/images/leftnav.png);
        background-repeat: no-repeat;
        background-position: left top;
        display: block;
        padding: 0px 0px 0 10px;
        }

#navigation_center ul li a.active span, #navigation_center ul li.current_page_item a {
        color: #000000;
        background-image: url(https://thanksgoogle.com/wordpress/images/rightnav.png);
        background-repeat: no-repeat;
        background-position: right top;
        display: block;
        padding: 0px 20px 0 10px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #000000;
        text-decoration: none;
        font-weight: bold;
        }

#navigation_right {
        width: 141px;
        height: 28px;
        float: left;
        padding: 6px 0 0 0;
        }
    Thread Starter eliteuser

    (@eliteuser)

    Hey,

    Thanks for the replies, I will be adding the code in nazieb. Hopefully it will work. If it does, $10 coming your way.

    @ whooami: I actually did use the same CSS code as that site, but it didn’t work. It turns out as you can see on my site.

    Thread Starter eliteuser

    (@eliteuser)

    HEY nazieb,

    It ALMOST works, just look at the site now.

    The ONLY thing that I need is the white tab to stretch out as far as the line. You will see what I mean when you visit the site https://sitedemonstration.hostei.com/

    Click on ‘about’ and ‘contact’ and you will see what I mean!

    $10 is almost in your hand lol!!! ??

    lol

    Here your code

    /* navigation bar */

#navigation {
        width: 819px;
        height: 34px;
        float: left;
        position: relative;
        top: 0px;
        left: 0px;
        }

#navigation_left {
        width: 11px;
        height: 34px;
        float: left;
        padding: 6px 0 0 11px;
        text-align: right;
        }
#navigation_center {
        width: 654px;
        height: 34px;
        float: left;
        background-position: bottom left;
        background-image: url(https://thanksgoogle.com/wordpress/images/nav-rept.jpg);
        background-repeat: repeat-x;
        padding: 0;
        }

#navigation_center ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
        }

#navigation_center ul li {
        float: left;
        line-height: 34px;
        }

#navigation_center ul li a {
        display: block;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #FFFFFF;
        text-decoration: none;
        font-weight: bold;
        padding: 0px 17px 3px;
        background-image: url(https://thanksgoogle.com/wordpress/images/navline.jpg);
        background-position: right center;
        background-repeat: no-repeat;
        line-height: 39px;
        }

#navigation_center ul li a span {
        color: #FFFFFF;
        display: block;
        }

#navigation_center ul li a:hover {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #ffffff;
        text-decoration: none;
        font-weight: bold;
        display: block;
        padding: 0px 17px 3px;
        }

#navigation_center ul li a:hover span {
        color: #ffffff;
        display: block;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        text-decoration: none;
        font-weight: bold;
        }

#navigation_center ul li a.active, #navigation_center ul li.current_page_item {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #000000;
        text-decoration: none;
        font-weight: bold;
        background-image: url(https://thanksgoogle.com/wordpress/images/leftnav.png);
        background-repeat: no-repeat;
        background-position: left top;
        display: block;
        padding: 0px 0px 0 10px;
        }

#navigation_center ul li.current_page_item {
		margin-left: -4px;
}

#navigation_center ul li a.active span, #navigation_center ul li.current_page_item a {
        color: #000000;
        background-image: url(https://thanksgoogle.com/wordpress/images/rightnav.png);
        background-repeat: no-repeat;
        background-position: right top;
        display: block;
        padding: 0px 20px 0 10px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #000000;
        text-decoration: none;
        font-weight: bold;
        }

#navigation_right {
        width: 141px;
        height: 28px;
        float: left;
        padding: 6px 0 0 0;
        }

    :p

    Thread Starter eliteuser

    (@eliteuser)

    Hey,

    Ok look at the site now, it is ALMOST done (this time, I think should be the last).

    The only problem remaining you can see on the site, is when you click on ‘home’ or ‘contact’ all the writing and lines move.

    It is hard to explain, just have a look at the site and click on the bar. You will see, like more static, not have the writing and lines move.

    When you send this post, send me your PayPal ID please for your reward ??

    I see no problem there. Which lines / writing that you mean?

    :S

    Thread Starter eliteuser

    (@eliteuser)

    Hello again,

    Go to the home page. Then click on, say…click on ‘about’.

    Then click on ‘home’ and watch carefully that the ‘about’ writing and line moves to the right.

    Oh.. I see..

    If you click on ‘about’ or ‘contact’, it will move to the left to cover the line of Home.. Of course when you go to Home again, it will looks like that the ‘about’ or ‘contact’ writing moves to the right..

    I think it’s not a big problem, is it?

    Thread Starter eliteuser

    (@eliteuser)

    Well,

    It kinda is…sort of. Would you be able to fix it?

    If you can, you will get the $10 reward straight away ?? Just send me your PayPal ID when you post the code change.

    Thx!

    EDIT: It seems to be ‘home’ that is becoming longer/shorter that is making all the problems, making all the other tabs to move.

    All right then.. Hope this will fix it..

    /* navigation bar */

#navigation {
        width: 819px;
        height: 34px;
        float: left;
        position: relative;
        top: 0px;
        left: 0px;
        }

#navigation_left {
        width: 11px;
        height: 34px;
        float: left;
        padding: 6px 0 0 11px;
        text-align: right;
        }
#navigation_center {
        width: 654px;
        height: 34px;
        float: left;
        background-position: bottom left;
        background-image: url(https://thanksgoogle.com/wordpress/images/nav-rept.jpg);
        background-repeat: repeat-x;
        padding: 0;
        }

#navigation_center ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
        }

#navigation_center ul li {
        float: left;
        line-height: 34px;
        }

#navigation_center ul li a {
        display: block;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #FFFFFF;
        text-decoration: none;
        font-weight: bold;
        padding: 0px 17px 3px;
        background-image: url(https://thanksgoogle.com/wordpress/images/navline.jpg);
        background-position: right center;
        background-repeat: no-repeat;
        line-height: 39px;
        }

#navigation_center ul li a span {
        color: #FFFFFF;
        display: block;
        }

#navigation_center ul li a:hover {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #ffffff;
        text-decoration: none;
        font-weight: bold;
        display: block;
        padding: 0px 17px 3px;
        }

#navigation_center ul li a:hover span {
        color: #ffffff;
        display: block;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        text-decoration: none;
        font-weight: bold;
        }

#navigation_center ul li a.active, #navigation_center ul li.current_page_item {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #000000;
        text-decoration: none;
        font-weight: bold;
        background-image: url(https://thanksgoogle.com/wordpress/images/leftnav.png);
        background-repeat: no-repeat;
        background-position: left top;
        display: block;
        padding: 0px 0px 0 10px;
        }

#navigation_center ul li.current_page_item {
		margin-left: -4px;
}

#navigation_center ul li a.active span, #navigation_center ul li.current_page_item a {
        color: #000000;
        background-image: url(https://thanksgoogle.com/wordpress/images/rightnav.png);
        background-repeat: no-repeat;
        background-position: right top;
        display: block;
        padding: 0px 20px 0 10px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #000000;
        text-decoration: none;
        font-weight: bold;
        }

#navigation_center ul li a.active span {
	padding: 0px 16px 0 10px;
	}

#navigation_right {
        width: 141px;
        height: 28px;
        float: left;
        padding: 6px 0 0 0;
        }

    My Paypal ID is [email protected]

    Thanks

    Thread Starter eliteuser

    (@eliteuser)

    Hello again,

    Ok Ok, sorry for being so picky…

    Now when you click on for example ‘home’ and ‘FAQ’, everything between those two tabs move. Try it out, click backward and forward on your browser.

    Then for another example, click on ‘home’ and then ‘A’ and you will see that everything between those two tabs move. Now they only move by a tiny amount, so it shouldn’t be hard to fix =D

    Again, sorry for being such a perfectionist, but you will be paid if u can get this right!! ?? I must congratulate you on your skill too!!

    Here it is:

    /* navigation bar */

#navigation {
        width: 819px;
        height: 34px;
        float: left;
        position: relative;
        top: 0px;
        left: 0px;
        }

#navigation_left {
        width: 11px;
        height: 34px;
        float: left;
        padding: 6px 0 0 11px;
        text-align: right;
        }
#navigation_center {
        width: 654px;
        height: 34px;
        float: left;
        background-position: bottom left;
        background-image: url(https://thanksgoogle.com/wordpress/images/nav-rept.jpg);
        background-repeat: repeat-x;
        padding: 0;
        }

#navigation_center ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
        }

#navigation_center ul li {
        float: left;
        line-height: 34px;
        }

#navigation_center ul li a {
        display: block;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #FFFFFF;
        text-decoration: none;
        font-weight: bold;
        padding: 0px 17px 3px;
        background-image: url(https://thanksgoogle.com/wordpress/images/navline.jpg);
        background-position: right center;
        background-repeat: no-repeat;
        line-height: 39px;
        }

#navigation_center ul li a span {
        color: #FFFFFF;
        display: block;
        }

#navigation_center ul li a:hover {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #ffffff;
        text-decoration: none;
        font-weight: bold;
        display: block;
        padding: 0px 17px 3px;
        }

#navigation_center ul li a:hover span {
        color: #ffffff;
        display: block;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        text-decoration: none;
        font-weight: bold;
        }

#navigation_center ul li a.active, #navigation_center ul li.current_page_item {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #000000;
        text-decoration: none;
        font-weight: bold;
        background-image: url(https://thanksgoogle.com/wordpress/images/leftnav.png);
        background-repeat: no-repeat;
        background-position: left top;
        display: block;
        padding: 0px 0px 0 10px;
        }

#navigation_center ul li.current_page_item {
		margin-left: -4px;
}

#navigation_center ul li a.active span, #navigation_center ul li.current_page_item a {
        color: #000000;
        background-image: url(https://thanksgoogle.com/wordpress/images/rightnav.png);
        background-repeat: no-repeat;
        background-position: right top;
        display: block;
        padding: 0px 18px 0 10px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #000000;
        text-decoration: none;
        font-weight: bold;
        }

#navigation_center ul li a.active span {
	padding: 0px 14px 0 10px;
	}

#navigation_right {
        width: 141px;
        height: 28px;
        float: left;
        padding: 6px 0 0 0;
        }
    Thread Starter eliteuser

    (@eliteuser)

    Hey nazieb,

    I must congratulate you, it works!!!! Thank you for all your help!!

    I’m sending you your reward of $10 right now! A quick and easy $10, better than helping everyone else out for free isn’t it??

    Thx again!! ??

    BTW: You don’t have to because you have already earned your reward, do u know how to remove the LAST line near the end of the navigation bar to make it look like this? https://i44.tinypic.com/2w4jud1.png

    Sending…

Viewing 15 replies - 1 through 15 (of 20 total)
  • The topic ‘Willing to give a whopping $10 via PayPal to anyone who can fix this problem!!!’ is closed to new replies.