Excess Padding

• 

  aestheticwebdesigner · Member · Feb 8, 2019 at 1:06 am

  • Copy link
  • Add topic to favorites

  Hello,

  I have been wracking my brain trying to figure out why there is so much padding on the top and bottom of the image in the descriptive text box on the home page. This padding does not show at all in the text box of the dashboard. In fact, it looks exactly as I want it. Any ideas of what I can do?

  I’m using the Sela Theme.

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

• 

  shubhamgmath · Member · Feb 8, 2019 at 1:52 am

  • Copy link

  Hi aestheticwebdesigner

  Are you talking about the three post on your home page. Here is the CSS code that you will need to add to your site:

  h3.widget-title {
      margin: 0px;
  }
  
  .widget.widget_text p {
      margin-bottom: 0px;
  }

  Custom CSS is part of Custom Design, which is a feature of the WordPress.com Premium and WordPress.com Business plans. You can add custom CSS to your WordPress.com blog using the CSS Editor in My Sites → Customize → CSS in your blog dashboard. Here is the support document that will help you to know more about the Custom CSS:
  https://en.support.wordpress.com/custom-css/

• 

  aestheticwebdesigner · Member · Feb 8, 2019 at 1:55 am

  • Copy link

  No, I’m not talking about that. I’m referring to:

  AFFORDABLE WEB DESIGN BY LINDA DARLENE
  [IMAGE]
  Maximum Aesthetics
  Empowering Small Businesses and Non-Profits

  The image (see above) is where there is excess padding.

  Thanks for trying to help. :-)

• 

  shubhamgmath · Member · Feb 8, 2019 at 1:58 am

  • Copy link

  .front-page-content-area .with-featured-image .entry-header {
      margin-top: 0 !important;
  }
  
  .front-page-content-area .with-featured-image .entry-content {
      margin-bottom: 0em !important;
  }

  Use the above given code for removing the margin from image area.

• 

  aestheticwebdesigner · Member · Feb 8, 2019 at 2:08 am

  • Copy link

  No sorry, that did not work. It succeeded in removing the top and bottom margins of the entry content, but that is not what I’m asking for.

  What I want is less padding on the ‘top’ and on the ‘bottom’ of the IMAGE.

  (The image is not a featured image, by the way.)

• 

  shubhamgmath · Member · Feb 8, 2019 at 2:24 am

  • Copy link

  @aestheticwebdesigner

  i am tagging this post as ‘modlook’ for staff attention. Please wait for sometime they will get back to you on this.

• 

  aestheticwebdesigner · Member · Feb 8, 2019 at 2:25 am

  • Copy link

  Thank you for doing that and for trying to help.

  Yea, it’s strange that this is happening. I’ve never seen anything like it. I can’t find any coding to explain it.

• 

  kokkieh · Staff · Feb 8, 2019 at 6:18 am

  • Copy link

  Hi there,

  There is no padding on that image. There is a margin of 1.5em on the aligncenter class applied to that image.

  This should do the trick:

  /* reduce whitespace above and below image added in front page/hero content */
  img.aligncenter {
  	margin: 1em auto;
  }

  Change the 1em to what looks best for you – you can substitute that with a px value as well if you want. Just make sure not to remove the auto, as that’s what ensures the image remains centered.

• 

  aestheticwebdesigner · Member · Feb 8, 2019 at 6:23 am

  • Copy link

  THANK YOU so much! Changed the value to .5em and that did the trick. :-)

• 

  kokkieh · Staff · Feb 8, 2019 at 6:45 am

  • Copy link

  Glad I could help :)