Reducing white and grey space

• 

  mlcraane · Member · June 16, 2017 at 11:28 am

  • Copy link
  • Add topic to favorites

  Can anyone help me reducing some of the white spaces on my blog (www.stitchingsheep.com)?

  I would like to reduce the white space between:

  – the preview of a blogpost and the next preview on my main blog page (http://stitchingsheep.com/blog). The column width and white space on both sides is fine, I just want to reduce the white space between the rows.

  – the image of preview on that same page and the corresponding post title, categories and text so they sit nicer together.

  – between comments and between comments and replies

  – the height of the grey space in the footer. I have hardly any widgets in the footer but the grey footer space is huge.

  Thank you!

  The blog I need help with is: (visible only to logged in users)

• 

  djordjegrubac · Theme Author · June 18, 2017 at 4:32 pm

  • Copy link

  Hello,

  Here are the answers on your questions:
  1. Q: – the preview of a blogpost and the next preview on my main blog page (http://stitchingsheep.com/blog). The column width and white space on both sides is fine, I just want to reduce the white space between the rows.

  – the image of preview on that same page and the corresponding post title, categories and text so they sit nicer together.
  A: This is the same fix. Please add this code to Custom CSS:

  .layout-four-columns .masonry [class*="col-"] {
      padding-left: 0;
      padding-right: 0;
  }

  2. Q: between comments and between comments and replies
  A: Please add this to Custom CSS:

  .comments-area .comment, .comments-area .pingback {
      margin-top: 1.8rem;
  }

  3. Q: the height of the grey space in the footer. I have hardly any widgets in the footer but the grey footer space is huge.
  A: Please add this to Custom CSS:

  .site-footer .widget-area {
      margin-top: 2.25rem;
  }

  Thank you,
  – Djordje

• 

  mlcraane · Member · June 18, 2017 at 5:17 pm

  • Copy link

  Thank you Djordje, 2 and 3 worked perfectly.

  1 didn’t seem to work for me, the columns ended up touching each other in the middle which made it unreadable but the preview post didn’t seem to get much closer to the next preview below. Is there anything else I could try?

• 

  djordjegrubac · Theme Author · June 21, 2017 at 9:20 pm

  • Copy link

  Hello,

  Try adding little padding:

  .layout-four-columns .masonry [class*="col-"] {
      padding-left: 5px;
      padding-right: px;
  }

  And check the effect.

  Thank you,
  – Djordje