Site logo

[Resolved] Removing Image Border for a Single Image

Home Forums Support [Resolved] Removing Image Border for a Single Image

Home Forums Support Removing Image Border for a Single Image

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1072851
    Ranjeeta

    Hi,
    I have added the below CSS code to add a border to all images in the single article.

    .single .inside-article img {
        border: 1px solid #002838;

    Now, I want to exclude a particular image in the article.
    How can I do that?
    I’m using GP Premium and Block editor.
    Image Ref: https://imgur.com/WgBCLb3

    #1072926
    David
    Staff
    Customer Support

    Hi there,

    select the Image in the editor – In the Settings Sidebar > Advanced > Additional CSS field add: no-border

    Then adjust your CSS to this:

    .single .inside-article img:not(.no-border) {
        border: 1px solid #002838;
    }
    #1073521
    Ranjeeta

    I have added “no-border” in the Sidebar > Advanced > Additional CSS.
    I added the above CSS code snippet in the Additional CSS field of the website by using the customize option, but it didn’t work. I want to remove the border for this single image only.

    #1073947
    Leo
    Staff
    Customer Support

    Any chance you can link us to the site in question?

    You can edit the original topic and use the private URL field.

    David’s solution should work and we can’t tell why it’s not working without seeing the method applied live.

    Let me know 🙂

    #1074307
    Ranjeeta
    #1074312
    Leo
    Staff
    Customer Support

    Try this as well as David’s code:

    .single .inside-article .wp-block-image.no-border img {
        border: none !important;
    }
    #1074430
    Ranjeeta

    Thanks

    #1074933
    Leo
    Staff
    Customer Support

    No problem 🙂

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.