Remove borders for specific images

  • Resolved gingerpot

    (@gingerpot)


    10 years, 5 months ago

    Hi,

    I’m using Skeleton Theme for my website:
    http://hihi1d.com
    http://hihi1d.com/guide_for_bkguide/

    With this theme, there’s no border shown around images. Since I want borders around images most of the time, I added the code below to style.css.

    img {
margin: 5px;
padding: 10px;
border: solid #dddddd 2px;}

    It’s working fine. Though now I have some images which I DON’T want to show the borders around them. I tried to do this by adding another code like below and it’s now working.

    -Additional code for style.css

    .post img.border-none {
border: none;
padding: 0;
}

    -HTML for posts

    <img class="border-none">

    Could anyone tell me how to remove borders from specific images while keep showing borders for all other images? Thanks in advance!

Viewing 7 replies - 1 through 7 (of 7 total)
  • Artur Bobinski

    (@kentonwebdesign)

    10 years, 5 months ago

    Remove .post from the front and start with img.border-none{}

    Hope that helps

    Thread Starter gingerpot

    (@gingerpot)

    10 years, 5 months ago

    Dear CureWP,

    Thanks for your super-quick reply! Unfortunately, it’s still not working with the code you gave me.

    Although, I figured out if I put the code below in HTML, I can remove the border from specific images, I’d love to know if there’s the way to do it with using class.

    ‘<img style=”border: 0px; />’

    Thanks again for your help!

    Artur Bobinski

    (@kentonwebdesign)

    10 years, 5 months ago

    Umm you could do is force also like so;

    .post img.border-none {
border: none !important;
padding: 0;
}

    Try that, I’m 99.99% sure it’ll work now 🙂

    Your welcome, happy to help.

    Thread Starter gingerpot

    (@gingerpot)

    10 years, 5 months ago

    Dear CureWP,

    I tried that, and it seems like not working yet…

    I sense that somehow I need to primarily overwrite the code I wrote to puts borders for all images. I just don’t know how?

    Again, thank you so much for your time and effort!

    Artur Bobinski

    (@kentonwebdesign)

    10 years, 5 months ago

    No problem. How about just putting this into your CSS;

    .border-none {
border: none !important;
padding: 0;
}

    I honestly don’t see how it wouldn’t do what your asking since !important forces itself over any other CSS ….

    Thread Starter gingerpot

    (@gingerpot)

    10 years, 5 months ago

    Hi CureWP,

    It’s working! It’s working! It’s working!
    http://hihi1d.com/guide_for_bkguide/
    (The first photo on this page.)

    I still don’t see why I don’t need “img” or “post” in the beginning of the code, though the point is it’s working now!

    Thank you very much CureWP again! I deeply appreciate for your help!

    Thread Starter gingerpot

    (@gingerpot)

    10 years, 5 months ago

    Thanks again CureWP for your help!

    And you all who took time and read this topic!

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Remove borders for specific images’ is closed to new replies.