Tagged: 

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • May 6, 2017 at 2:33 pm #788835
    SailTheOcean

    I just want to add a 1px gray padded border around images sitewide. Like those around post images and linked images. It should be a styling option somewhere? Or do I need some custom CSS for this. Can someone provide the custom code to add? Sorry for the newbie question.

    May 6, 2017 at 6:58 pm #788883
    Mike

    Hey SailTheOcean,
    We are happy to help, Try this code in the General Styling > Quick CSS field:

    img {
    border-color: #ebebeb;
    border-style: solid!important; 
    border-width: 1px!important; 
    padding: 7px!important; 
}

    But you may find that you don’t really want every image to have a border, if so include a URL and which type of images you do want a border on and we will try to help :)

    Best regards,
    Mike

    May 7, 2017 at 8:31 am #789053
    SailTheOcean

    Thanks, Mike. What a great forum. That’s what I was looking for. Unfortunately, though, images in posts (which already had a border), now have a double border. Is there an additional line of CSS needed to exclude posts?

    May 7, 2017 at 9:47 pm #789207
    Mike

    Hi,
    I was afraid that would happen, we can’t exclude, we need to be more specific. If you include a URL and which images you do want a border around we will try to help.

    Best regards,
    Mike

    May 11, 2017 at 9:47 am #791563
    SailTheOcean

    Mike,
    Specifically, I’d like to put a frame (like your above formatting) around the featured image in blog posts. And maybe a little more padding below.
    I’ve combed through the layout.css file and experimented with things in the Enfold custom CSS box, and wasted incredible amounts of time. It is not an easily done for beginners.
    Can you help?

    May 11, 2017 at 11:01 am #791583
    Sarah

    Hi,
    You can try this code:

    
.post-entry .big-preview > a > img {
    border: 1px solid black !important;
    padding: 10px !important; 
}

    If you need further help, please give us a link to the page you’re working on so we can give you a more accurate solution.

    Best regards,
    Sarah

    May 11, 2017 at 3:28 pm #791678
    SailTheOcean

    This worked. I think things are styled to look great now. You guys should be paid for your great consulting! Thanks for your help!

    May 11, 2017 at 3:37 pm #791687
    Sarah

    Thank you for the kind words! We’re happy to help.

    If you don’t need further help with this topic, can we close this thread now? Of course, you can open a new thread if you need help again.
    Best regards,
    Sarah

    May 11, 2017 at 3:58 pm #791700
    SailTheOcean

    Okay. I’m going to squeeze in one more question before closing the thread. You’re being so gracious. Thanks.

    Back to my original question above, I’d still like to know how to put a border around specific images on the page (all those without a border). Like the three under my slider. See http://denengracechapel.org/gardencity/home/

    If I know how to do one image, I think I can figure it out for the rest of the site as I need.

    Thanks for the help.

    May 11, 2017 at 4:07 pm #791704
    Jordan Shannon

    Hi,

    Try adding the following to quick css. You can match the color to whatever you need:

    #av_section_2 a.avia_image{
border: 1px solid red!important;
padding: 5px;
}

    Best regards,
    Jordan Shannon

    May 11, 2017 at 5:15 pm #791747
    SailTheOcean

    This worked for the linked image at left, but not the image in middle or google map at right.
    I’m at a loss. I certainly do appreciate this great help.

    May 11, 2017 at 6:46 pm #791819
    Jordan Shannon

    Hi,

    Adjust to the following:

    #av_section_2 img.avia_image, #av_gmap_1.avia-google-map-container{
border: 1px solid red!important;
padding: 5px;
}

    Since the map is scrollable the padding may not apply

    Best regards,
    Jordan Shannon

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