Reducing white space/padding above and below images

  • Hi,

    I’m looking to reduce the padding/white space above and below images on my blog posts (you can see what I mean on this post – [ redundant link removed ]). I know I need to add Additional CSS and have tried to figure out how to do this myself but can’t quite make it work!

    Any help in what to insert as the Additional CSS would be greatly appreciated! I’m very new to blogging/coding, so if you’re mentioning inserting code etc, could you please be really Specific about what to insert and where, because I’m still trying to wrap my head around it.

    Thanks so much ??
    Jess

    • This topic was modified 4 years, 7 months ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Everything else WordPress topic

    The page I need help with: [log in to see the link]

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

  • You can add to your Additional CSS (Dashboard > Appearance > Customize > Additional CSS (or Custom CSS)) next codes. However: insert them one by one, see what happens, and change the values you want to change.

    #primary {
    padding:0;
    }

    .single-post .site-content {
    margin-top: 0;
    }

    .single-post .entry-content figure,
    .single-post .entry-content img,
    .single-post .entry-content ul {
    margin: 0 auto;
    padding:0;
    }

    For example: Use:

    /*
    #primary {
    padding:0;
    }
    */

    /*
    .single-post .site-content {
    margin-top: 0;
    }
    */

    /*
    .single-post .entry-content figure,
    .single-post .entry-content img, */
    .single-post .entry-content ul {
    margin: 0 auto;
    padding:0;
    }

    Thread Starter seekflourishbloom

    (@seekflourishbloom)

    Thanks so much for getting back to me, I really appreciate it!

    The third option you gave worked and did reduce the white space, however not as much as I was hoping. I tried putting a negative value in where it says ‘margin: 0 value’ but it didn’t make any difference. Do you know if there is a way to reduce the white space some more?

    Thanks so much for your help!!

    There are a lot of different white places on your website, like margins and paddings. To finetune this. you’d better do it yourself.
    Did you understand the use of /* … */ ?
    On your website now you’ve used just a part of the suggested codes.
    Try to learn about the browser’s inspector, to isolate the styles and manipulate them.

    Hi guys,

    Sorry to jump in on this one, the coding worked perfectly for me that you have supplied.

    I just wonder if you could help when it comes to the mobile phone side of things please?

    I’m having issues with the padding above needing more space and below needing less, this is an example if you wouldn’t mind taking a look from a mobile device

    https://sustainhealth.fit/lifestyle/tommy-fleetwood-tag-heuer-brand-ambassador/

    Thank you and once again sorry for jumping on this thread.

    ?

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Reducing white space/padding above and below images’ is closed to new replies.