• Resolved Gmount

    (@gmount)


    I’ve been creating graphics and editing images in Photo Shop, and although I saved them with a transparrent background and as PNG files, when I place them into my web pages they always have a faint border and white background that shows and it makes the pages un-professional looking.

    I always go into the image editer when it is loaded onto the page and enter “0” in the “border” properties.

    Anyone any ideas?
    Thanks in advance.

    Regards, Gary.

Viewing 12 replies - 1 through 12 (of 12 total)
  • Can you provide a link to your site (and a location where we can see a PNG that displays these problems?)

    are you using any image compressing plugin like smush it or anything like that ?

    Thread Starter Gmount

    (@gmount)

    Sorry for the delay…. here’s the link
    https://onlineretailcoupons.net/phen375/

    Not using any image compressing plugin.

    Regards, Gary.

    Which images have the problem?

    ok this is what I found:

    You have an image below: Click-here-To-Order.png

    It’s contained in a div which has a background color.

    .wp-caption {
        background: none repeat scroll 0 0 hsl(0, 0%, 97%);
        border: 1px solid hsl(0, 0%, 90%);
        padding: 4px 0 5px;
        text-align: center;
    }

    The background color is

    hsl (0,0%,97%)

    Fix this by setting the background-color to #ffffff and you should be fine.

    Thread Starter Gmount

    (@gmount)

    Thanks Mike… but do I do this in WordPress HTML or in Photo Shop?

    I’m not very good at this tech. stuff!
    Do I replace what’s in the brackets, eg:(0,0%,97%)
    with (#ffffff) or am I getting this wrong?

    Thread Starter Gmount

    (@gmount)

    Looked everywhere in WordPress and can’t find anything that resembles:

    .wp-caption {
    background: none repeat scroll 0 0 hsl(0, 0%, 97%);
    border: 1px solid hsl(0, 0%, 90%);
    padding: 4px 0 5px;
    text-align: center;
    }

    That was the generated code:

    In your style.css you would find:

    .wp-caption { background:#F7F7F7; text-align:center; padding:4px 0px 5px 0px; border:1px solid #e6e6e6; }

    But I noticed you removed the caption code around the images so your problem seems to be fixed.

    If so could you change the status of this topic to resolved?

    Thread Starter Gmount

    (@gmount)

    Thanks for getting back to me Mike!
    Yes I worked it out myself today…. by removing the caption from the image it seemed to cure the problem.
    Not sure if this will detract from the SEO side of things.
    I would have thought that there should be another way to deal with this but it seems not.

    I did try to find the code that you referred to but the style CSS sheet in my wordpress backend for this site is blank!

    Once again thanks for your help.

    Regards, Gary.

    Thread Starter Gmount

    (@gmount)

    Sorry I forgot to close the post!

    your style css is located here: https://onlineretailcoupons.net/wp-content/themes/WPThemeKenya1.1/style.css

    Glad you figured an other way!

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘PNG images showing with faint background!’ is closed to new replies.