Serenity – Remove Border on Image

Community Forums Forums Design Tips and Tricks Serenity – Remove Border on Image

This topic is: not resolved

This topic contains 10 replies, has 3 voices, and was last updated by  braddalton 6 months ago.

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

    nkitchen31
    Participant
    Post count: 16

    I would like to add an image, but the default has a border around all images. I want to put on just one image with no border. How would this be done?

    Thank you in advance!

    #53559

    braddalton
    Participant
    Post count: 7454

    Add 0 to the border filed under Advanced Settings > Advanced image settings when you edit the image after insertion.

    Image properties > Border 0


    WordPress Developer & Consultant
    Brad Dalton400+ StudioPress Tutorials & 1200+ Code snippets

    #53561

    nkitchen31
    Participant
    Post count: 16

    this is in a text widget

    #53563

    braddalton
    Participant
    Post count: 7454

    Change it before pasting it into the text widget.

    Click the image and then click the small window which appears to edit the image.


    WordPress Developer & Consultant
    Brad Dalton400+ StudioPress Tutorials & 1200+ Code snippets

    #53574

    nkitchen31
    Participant
    Post count: 16

    It’s just code in the text widget… I don’t understand what you are talking about.. ???

    #53605

    nkitchen31
    Participant
    Post count: 16

    Could you please explain what you mean by changing it before I put it into a text widget? The .css has a border for all images in the featured’s. I want to only remove it for 1 image.

    #53673

    braddalton
    Participant
    Post count: 7454

    When you upload and insert an image in a new post draft, you can then click the image and small window which appears to edit it.

    Then you can add 0 to the border filed under Advanced Settings > Advanced image settings when you edit the image after insertion.

    Then you can copy and paste the HTML for the image into your text widget.


    WordPress Developer & Consultant
    Brad Dalton400+ StudioPress Tutorials & 1200+ Code snippets

    #67194

    Emilio
    Participant
    Post count: 5

    Hi,

    When I tried placing a zero in the border box the border still appears. I would like to control when borders appear. So what am I doing wrong?

    #67318

    braddalton
    Participant
    Post count: 7454

    You can inspect the image using Firebug and use the image i.d in a new CSS rule to add or remove the border on specific images:

    Examples:

    Add a border to a specific image.

    .wp-image-123866 {
    border: 5px solid red;
    }
    

    Or remove a border:

    .wp-image-123866 {
    border: none;
    }
    

    WordPress Developer & Consultant
    Brad Dalton400+ StudioPress Tutorials & 1200+ Code snippets

    #67386

    Emilio
    Participant
    Post count: 5

    Okay, once I have the image ID, where do I place the CSS code?

    Emilio

    #67391

    braddalton
    Participant
    Post count: 7454

    At the end of your child themes style.css file before the Media Queries


    WordPress Developer & Consultant
    Brad Dalton400+ StudioPress Tutorials & 1200+ Code snippets

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

You must be logged in to reply to this topic.