Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • March 8, 2018 at 5:59 am #923558
    tkumabe

    Hi there,
    I have a couple of questions I’m hoping to get help on.
    1)
    I would like the body of my single blog posts to be about 90% of the browser window. At the moment, it’s currently about 50% of the browser width and I can’t seem to find the place to edit this.

    I’ve even tried adding this to my CSS editor, but this does nothing.

    #top .fullsize .template-blog .post-title,
    #top .fullsize .template-blog .post .entry-content-wrapper > * {
    max-width: 90% !important;
    }

    2) Is there a way to remove the borders around images that have captions on them? I would like to have just the image, non-clickable, and have captions where I can edit how it looks with css, just underneath the image.

    Is there anything else I can do or am I missing something here?
    Any help would be much appreciated.

    In the link, the body of the blog post is much thinner than the “You might also like” area and the comments area, on the bottom.

    March 8, 2018 at 10:13 am #923695
    Victoria

    Hey tkumabe,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
#top .fullsize .template-blog .post .entry-content-wrapper {
  width: 100%;
  max-width: 100%;
}
#top .wp-caption.aligncenter {
  border: none;
}

    Please note, that the text gets hard to read when it’s stretched like that.

    If you need further assistance please let us know.

    Best regards,
    Victoria

    March 8, 2018 at 5:11 pm #923956
    tkumabe

    Thanks for this. The code worked for everything BUT the single blog post!
    I’m using a child theme, and have just added a style.css in the child theme root folder, which is where I have been putting all of my custom css.

    Also, I still see the borders around my images, so that css did not work.

    Any other suggestions?
    Many thanks!

    March 9, 2018 at 2:36 pm #924509
    Mike

    Hi,
    It looks as the top image, has been uploaded with a border around it. Please see the direct link to the image in the Private Content area.
    For the post width please try this css:

    #top .fullsize .template-blog .post .entry-content-wrapper, #top .fullsize .template-blog .post .entry-content-wrapper > * {
    max-width: 90%!important;
    width: 90% !important; 
}

    Best regards,
    Mike

    March 9, 2018 at 4:45 pm #924602
    tkumabe

    Hi Mike!
    Thanks! The code for the blog entry works only if I put it in the Additional CSS section, and not in my custom css file. Is there a reason why this is so? This has happened in other cases too, where it works in the former and not in the latter.

    As for the border, the image you are referring to is created with a border, correct. It’s the images with captions that have a thin gray border around them, that I would like to remove. Ideally, I just want a photo with its caption directly underneath it, which I can style with CSS. I can’t seem to figure out which CSS controls the border around images when a caption is entered.

    Thanks for any help!

    March 10, 2018 at 1:57 am #924812
    Mike

    Hi,
    For the border, I checked with Chrome, Firefox, & Edge and couldn’t see the border, Please see screenshot in Private Content area. Please advise.
    As for your css, I too am using a child theme with the code in my style.css
    have you tried clearing your cache? Also check the file permissions for your child theme. Try using “!important;” with your rule should it already be in use.

    Best regards,
    Mike

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