Need help? Check out our Support site, then


Remove Border Images from Bueno Theme?

  1. I've purchased CSS and have gone through it with a fine tooth comb trying to remove the border images from my pictures.

    Here is my site: http://jcrylequotes.com/

    And here is an example of an image with the border: http://jcrylequotes.com/2010/05/15/finally-knots-untied/

    Please tell me where to find the border image in the CSS so I can insert "none" or "0"?

    Thanks

    The blog I need help with is jcrylequotes.com.

  2. Change the .entry img border to 0 none;

    <br /> .entry img {<br /> border:0 none;<br /> }<br />

    The 0 described the border width, none will describe the border style, (which is null) then to give the border colour, which is not given.

    Similarly i think you need to change the border property of the other img classes in the CSS sheet. You can search for 'img' in the CSS file and get the other CSS classes and then change the border properties.

  3. The only ".entry img" I see is this:

    .entry img, .wp-caption { margin-bottom: 15px; }

    However, this is not working since it is not a "border".

    Still need help.

    I'm supposed to be looking under this section in CSS correct?

    /* 3.2 Images */

  4. actually, "border: none;" will suffice. No need to set a value such as "0".

  5. Here is what I have under the "Image" section of my CSS for Bueno.

    Let me know which one of these I need to adjust to rid myself of the image borders.

    Thanks.

    _____________________________

    /* 3.2 Images */
    img.wp-smiley  { padding: 0 !important; border: none !important; margin: 0 !important; }
    
    .entry img, .wp-caption { margin-bottom: 15px; }
    
    .entry .alignleft  { float: left; width: auto; margin: 10px 15px 10px 0; }
    .entry .alignright  { float: right; width: auto; margin: 10px 0 10px 15px; }
    .entry .aligncenter  { display: block; text-align: center; margin: 10px auto; }
    
    .entry .wp-caption { padding: 1px; text-align:center; background:#F8F8F4; border: solid 1px #e6e6e6; }
    .entry .wp-caption img{ margin:0; padding:4px 0; background:none; border:0; }
    .entry .wp-caption-text { margin:0; padding:0; font-size:11px; text-align:center; }
  6. add the below line

    i see that this option is in the blue.css file, which probably is not editable.
    Then just add the below

    <br /> .entry img {<br /> border:0 none;<br /> }<br />
    in any place of the CSS file

  7. Yep...pasting that small code anywhere into the CSS worked.

    MUCH appreciated phoxis.

    You folks at WordPress are INCREDIBLE! :-)

  8. I don't understand why the redundancy of defining the border property like this:

    border: 0 none;

    It's like defining something like this

    selector {
    display: none;
    height: 0;
    width: 0;
    }

    Meh...

  9. @devblog, it's to keep the browser busy.

    ;-)

  10. Yeah, I bet!

  11. just following the syntax. making 0px border would be enough.

  12. That code doesn't remove the green border on the featured image in a post )at least not when I tried inserting a featured image in a previous post.) Any thoughts? Thanks so much.

  13. Sandra,

    Would you please post a temp "featured image"? I would need to see the elements in order to give you the proper code. If you want to do it tomorrow, that's fine. I'm going to bed right now.

    making 0px border would be enough.

    phoxis,

    Yes, that'd suffice, but the proper way would be to set it to "none". Also, when setting a value to zero (0) no units are necessary.

  14. @sandrapawula: you need to check which class the featured post images uses to show the image, and you need to set the border property to 0 within that class. I think the easiest way to figure the call is to use FireBug, a firefox plugin. Get it here: http://getfirebug.com/
    Using it you can check the changes at once, and when you are satisfied you then can apply those changes from your wordpress CSS editor.

    @devblog : Right. Actually i am not very well with CSS (not in web development), and have no experience, so just trying to apply what i learnt.

  15. Sandra,

    I guess I was too tired last night that I forgot to say that, if you want to get rid of the borders of ALL images throughout your blog then this code will take care of that:

    img {
    border: none !important;
    }

    If you just want to get rid of the images inside your posts only, then this will do it:

    .hentry img {
    border: none !important;
    }

    The "!important" rule will deal with the border that persists around images such as the one in your "Zen Parable" post.

    HTH

  16. Thanks everyone. I used this:

    For no border around featured images:

    .post img.attachment-post-thumbnail { border: none; }
    For no border around the thumbnails in the Featured Posts widget:
    #featured span.thumb img { border: none; }
  17. I was having the same problem with unwanted picture borders on my blog: http://mikkahillphotography.com/

    I have the Bueno Theme for WordPress and entered this:

    .entry img {
    border:0 none;
    }

    Now, I'm happy with no borders! Thanks for (thekowalkerjourney) for asking my question and (phoxis) for answering my question.

  18. It should be just

    .entry img {border: none;}

    *sigh*

  19. Can you help me how could I remove border from featured images? In all other cases setting border 0 is working but with featured images the border still remains whatever I do. Thanks a lot!

  20. Has been answered - see posts above.

  21. @kispetra
    I do not see any CSS editing on your blog. You must have the CSS upgrade to remove the borders. If you have not purchased the CSS editing upgrade then here are the relevant links:
    http://en.support.wordpress.com/custom-css/
    http://en.support.wordpress.com/editing-css/

    If you have purchased the CSS upgrade then as Panos has said above the answer is found in this thread in the posts above your own.

  22. Hoping someone is still paying attention to this thread. Specifically devblog, who answered this question so thoroughly before . . .

    Now that I've managed to remove the border, is there a piece of code I could insert that would set a specific amount of blank space around each image within a post? As it is now, the words are too flush against the right side of the image. I have not yet purchased the CSS upgrade, but if there is a way to do this, then I'm all over it.

    Help?

  23. Goofing around on my own, I came up with this . . .

    .entry img {border: none; padding: 5px}

    . . . which puts a nice little border around the whole image. Beautiful. I may not be as dumb as I look!

  24. When you create an image hop across to the HTML editor and add in the stlye padding attribute as shown below:

    <img src="URL" style="padding:10px;">

    The good news is you don't have to purchase the CSS upgrade, the bad news is that you need to do this for every image you post. If you like having the image flush with the text on the right hand side you can always specify different values for the top right bottom and left padding amounts, in that order seperated by spaces.

    If you do go for the CSS upgrade something like this should do the trick:

    .post img {padding:10px;}

    lh

  25. You want to add right and bottom padding as follows:

    img, fieldset {
    padding:10px;
    }

    The above will put padding on all 4 sides of the image. The reason I suggest that is that it will work whether the image is left or right aligned.

  26. My solution is if you had the CSS upgrade. Since this thread is in the CSS forum, I assumed you did.

  27. Yes, I did purchase the upgrade. Even figured out the padding thing on my very own!

    Thanks for the reply. I appreciate it, and will likely be back with more questions about CSS . . .

Topic Closed

This topic has been closed to new replies.

About this Topic