Forums

WordPress › Support » How-To and Troubleshooting

12

Cannot remove borders around images (39 posts)

  1. Thedishmaster
    Member
    Posted 1 year ago #

    I recently switched to a new wordpress template, and some of my images have borders around them that I want to remove. Here's an example of an image with a border issue:

    http://thedishmaster.com/2011/04/is-charlie-sheen-being-courted-to-return-to-two-and-a-half-men-i-guess-yes.html

    I Can't find the issue in my CSS code, and I'm a major coding novice.

  2. samirtuladhar
    Member
    Posted 1 year ago #

    Try this

    .post-entry img {
       float: left;
       margin: .4em 0 0 1em;
       padding: 0 10px 10px 0;
       border: 0px;
}

    on your style.css file

  3. Netsultants
    Member
    Posted 1 year ago #

    It's not the border, but padding in
    .post-entry img {

    I think you want to remove it.

    Or I f you want padding you probably want to remove the border

  4. Thedishmaster
    Member
    Posted 1 year ago #

    and what do I change it to?

  5. elkirkmo
    Member
    Posted 1 year ago #

    I'm not sure what you're using for an editor, but if you're in the Appearance > Editor > CSS section of the admin dashboard, I'd recommend just using ctrl f and searching for "img". From there you should be able to tinker with it and find what you like.

    Also, I'm not really seeing the "border" issue on the example you gave. It doesn't have a border. Are you referring to the text wrap issue?

  6. Thedishmaster
    Member
    Posted 1 year ago #

    The text is laid up against the image and there's definitely a "border" because you can see an odd space between the right border and the image itself. Do you see what I mean?

    Here's the other thing -- I have no knowledge of CSS -- I'm a major NOVICE -- so any suggestions about how to tinker with it.

  7. samirtuladhar
    Member
    Posted 1 year ago #

    Its showing on Firefox.
    GO to wp-content/themes/vesper/style.css

    Line 290
    Replace

    .post-entry img {
       float: left;
       margin: .4em 0 0 1em;
       padding: 0 10px 10px 0;
}

    with

    .post-entry img {
       float: left;
       margin: .4em 0 0 1em;
       padding: 0 10px 10px 0;
       border: 0px;
}

  8. Thedishmaster
    Member
    Posted 1 year ago #

    Still there. :( Didn't work.

  9. samirtuladhar
    Member
    Posted 1 year ago #

    It fixed on my browser now. Can you send a screenshot.

  10. Thedishmaster
    Member
    Posted 1 year ago #

    Argh -- I don't know how to do that. Are you sure it fixed in firefox? I still see it.

  11. Netsultants
    Member
    Posted 1 year ago #

    Yep it's fixed. Refresh your page holding down the shift key. You might have a cache issue.

  12. samirtuladhar
    Member
    Posted 1 year ago #

    Its fixed. I tested it in IE6 IE7 and other browsers. May be its only you, refresh couple of time.

  13. Thedishmaster
    Member
    Posted 1 year ago #

    YAAAAAAY! YOU'RE RIGHT --- YOU DID IT!!! THANKS SOOOOOOOOOOOO MUCH!!!

  14. elkirkmo
    Member
    Posted 1 year ago #

    Find .post-entry img on the editor and change the border-style: initial; to border-style: none;

    Or just delete all the border styles all together.

    I'm viewing with both Firefox and Chrome on a mac and it looks fine to me.

  15. Netsultants
    Member
    Posted 1 year ago #

    The only thing I'll add is you might want to make it 20px:

    .post-entry img {
       float: left;
       margin: .4em 0 0 1em;
       padding: 0 20px 10px 0;
       border: 0px;
}

  16. samirtuladhar
    Member
    Posted 1 year ago #

    No Worries.

  17. Thedishmaster
    Member
    Posted 1 year ago #

    You're right! That looks so much better!!!! You're amazing! Can I ask one more question if it's not too much trouble? Do you know how to center and increase the size of my header where it says "The Dishmaster" with the slogan "entertainment news with a side of dish" underneath? I'm the worst! hahaha

  18. elkirkmo
    Member
    Posted 1 year ago #

    Go to the /* HEADER ELEMENTS section and addfont-size to it.
    I.E.

    #header h1 a {
       color: #7e4c10;
       color: #fff;
       font-size: 25px;
}

    Just experiment till you find what you want.

  19. Thedishmaster
    Member
    Posted 1 year ago #

    and what do I add if I wanted it centered instead of flush left?

  20. samirtuladhar
    Member
    Posted 1 year ago #

    Replace

    #header span.description {
       position: relative;
       margin-left: 5px;
       color: #7e4c10;
}

    with

    #header span.description {
       position: relative;
       margin-left: 5px;
       color: #7e4c10;
       text-align: center;
       display: block;
}

  21. Thedishmaster
    Member
    Posted 1 year ago #

    For some reason that just moved my tabs up over the header instead of moving the header.

  22. samirtuladhar
    Member
    Posted 1 year ago #

    Add this then

    #header ul {
       position: absolute;
       left: 0;
       top: 93px;
       bottom: 1px;
       font: 13px Georgia, "Times New Roman", Times, serif;
       list-style: none;
       margin-top: -6px;
       padding: 0;
       text-transform: none;
}

  23. Thedishmaster
    Member
    Posted 1 year ago #

    Just did that! It looks great! Is there a way to stretch out the tagline so the letters aren't so shoved together? or am I being super annoying now?

  24. Netsultants
    Member
    Posted 1 year ago #

    This

    #header span.description {
    color: #7E4C10;
    font-size: 20px;
    font-style: italic;
    margin-left: 5px;
    padding-top: 6px;
    position: absolute;
}

  25. Thedishmaster
    Member
    Posted 1 year ago #

    THAT LOOKS GREAT! IT'S NOT SO PRESSED UP AGAINST THE HEADER ANYMORE. THANKS SOOOOOOOO MUCH!!!!!!!!!

    OKAY THIS IS MY LAST QUESTION -- I PROMISE!!

    HOW DO I REMOVE THAT "continue reading" link under each post on my blog?

    So sorry to be annoying with these questions but you guys have solved all my issues and I can't resist one more!

  26. Netsultants
    Member
    Posted 1 year ago #

    I'm not sure what you want. Do you want the full text to show on the homepage? I don't know how you set the "More" tag. It seems this is the wording used for your theme. You need some "more" or continue reading" text to let people know there is more to the story.

  27. Thedishmaster
    Member
    Posted 1 year ago #

    I want the full text of the individual post to show, instead of cutting the post in half with "continue reading" link. My site is at http://www.thedishmaster.com btw.

  28. Netsultants
    Member
    Posted 1 year ago #

    Well it's probably a setting in your theme options to have excerpts on the home page..... or someone is adding a "more" tag when they write the post.

  29. Thedishmaster
    Member
    Posted 1 year ago #

    My site is not working in explorer now, the content is completely messed up

  30. Thedishmaster
    Member
    Posted 1 year ago #

    I never noticed before, but when I switched to my new theme, the posts don't correctly display in internet explorer. Does anyone know what I can do?

    http://www.TheDishmaster.com

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags