Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
  • #6796

    Transparent Issue — I have searched for these problems and haven’t found a direct answer really. When I place my .PNG transparent image in a normal text box widget for the sidebar the image does not appear transparent. Instead it adds in a black background and places a grey border around the image. It does the same for .GIF images as well. I want to remove this border that is there and get my image to appear transparent like intended. If you look at the site right now you will see two images stacked up, they should be transparent but are not, it puts a dark color behind it and you can see the border which isn’t supposed to be there. What can I do to get .PNG’s and .GIF’s transparent like they should be?

    Widget Image Issue — I plan on placing two “buttons” side by side in the sidebar but it will not allow them to be beside each other and instead stacks them vertically. If you look at the site now I threw two images up there that should be side by side because they are small enough to fit but will not. How is this corrected?

    My URL is

    Thank you so very much! :)



    I think this thread will help you: – I’d use the second solution (noborder class for transparent images).

    2) Try to remove the center tag and add following code to style.css:

    #main .sidebar img {
    display: inline !important;


    Both solutions worked out great! Thank you very much for the help!


    Alright I am having a new issue here but it is really related to my #2 question again. That worked for the sidebar but now I need to get images to line up side by side in my main body of the pages & posts. Where would I place that code, I tried several spots and I couldn’t find it.

    Thanks again!!!


    Could you link to a page where you have multiple images you’d like to put in one line? This way we can give specific instructions :)


    It is on the contact page.


    In your style.css you’ll find

    .entry img {
    padding: 3px;

    You can make it float left by using

    .entry img {
    padding: 3px;
    float: left;

    This, however will change all images you’ll use within entries, maybe this doesn’t matter – but a solution to this would be to put a class around your images in HTML view. For example:

    <p class="floatleft"><img src="image1.png" /><img src="image2.png" /><img src="image3.png" /><img src="image4.png" /></p>

    The CSS for this would be

    .entry .floatleft img {
    float: left;

    You can add that below “.entry img”

    Let me know if it works :)


    This worked, thank you.


    But I can’t center the images now?


    Yeah, take a look at the “Contact” page…

    The images are going side by side now but it disrupts the look of the page. I would want those images all centered and be able to put text on the bottom not on the side like that. Let me know what you think could be a possible the fix to that haha.



    go to HTML view and put this in below your images:

    <div class="clearboth">&nbsp;</div>

Viewing 11 posts - 1 through 11 (of 11 total)

The topic ‘.PNG transparent images not transparent + Widget image issue’ is closed to new replies.