• I have been able to change all the colors on my website from blue to green except for the horizontal bar in the background. When I change the url in an inspection box (green.png) it works. When I attempt to copy the code to either the Additional CSS page, or the Child CSS page, it will not work, even with and exact copy. Can someone give me an idea of what I’m missing

    The page I need help with: [log in to see the link]

Viewing 12 replies - 1 through 12 (of 12 total)
  • Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    Which horizontal bar? 1, 2, or 3?

    View post on imgur.com

    Thread Starter eonelson48

    (@eonelson48)

    It is none of those. The bar code is:

    /* BODY AND CONTAINER */
    body {background:#fff url(‘images/border.png’) repeat-x; background-position:50% 250px; color:#333; font-family:’Open Sans’, sans-serif; font-size:0.9em; line-height:1.5em; text-align:left; word-wrap:break-word;}
    #container {max-width:960px; position:relative; margin:0 auto 0; padding:0 20px;}
    #container:after {content:”; display:block; height:0; clear:both;}

    It shows now on http://www.plantclippings.com I have an image that is green.png loaded in the same file. It works if I substitute on the Inspection – but will not get called to the template.

    CLUE: On WAMP when I put the code for the bar in first and then the rest of the code in – they all show up and work. If I remove all of the code, the one for the #header-second does not change. . .

    So, something is hung up somewhere and there is probably a conflict between the body background bar and the header-second.

    I have cleared my caches and restarted my computers on two different browsers with no luck.

    Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    It seems to me that this CSS should work:

    body {
           background: #fff url(images/green.png) repeat-x;
    }

    What file are you editing when you make this change?

    Please make the change and ping me here when it’s done so I can see what’s up.

    Thread Starter eonelson48

    (@eonelson48)

    You are right Steve, that should work, but it doesn’t. I notice that when I inspect the site in Chrome it shows that rule as grayed out – perhaps that has something to do with it? I’ve gone through all of the style sheets and can’t find anywhere else that it could be changed.

    Does anyone have any other ideas?

    Thanks.

    Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    You entered it as #body. It should be JUST body.

    Thread Starter eonelson48

    (@eonelson48)

    I tried that as well. When I remove the # the line simply disappears.

    Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    This time, you put in a .. That’s also incorrect. Just body, all by istelf.

    Thread Starter eonelson48

    (@eonelson48)

    Yes, I know.

    Now you will find it with nothing before body. When it is entered like that the line disappears completely – also not solving my problem.

    Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    There’s a 404 error on ‘green.png’.

    OH I GET IT!

    The directory is relative to the CSS file, so when it’s in the theme’s style.css, images/green.png works, but when it’s custom CSS, you’ll have to spell out the fully qualified address

    Use this instead of images/green.png:

    http://www.plantclippings.com/wp-content/themes/medical/images/green.png

    Thread Starter eonelson48

    (@eonelson48)

    Steve, Thank you for your patience and persistence. If nothing else, I am learning that I do have some sense of the different things to try to attempt to figure out a problem since I had tried that as well.

    I have now pasted that line of code in and saved it. Again, it doesn’t affect the color of the bar. It is pasted with single quotes, but I tried double quotes to just to see if that would make a difference.

    Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    THis should work:

    body {
        background: #fff url(http://www.plantclippings.com/wp-content/themes/medical/images/green.png) repeat-x;
        background-position: 50% 250px;
    }
    Thread Starter eonelson48

    (@eonelson48)

    IT WORKS!!!!! Thank you. Can I ask you what was different so I can learn something?

    Yes, the complete url — but was the lack of quotes? Everything I saw in various places put the url within the parenths in either single or double quotes . . .guess I didn’t try it without the quotes.

    Thank you.

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘Site Inspector Change Works, Coding doesn’t’ is closed to new replies.