Archived

This topic is now archived and is closed to further replies.

  • 0

Remove Large White Space Between Soapboxes And Call To Action


Question

Posted · Report post

I'm looking for some direction on what steps to take to remove the large amount of whitespace between the bottom of the Call To Action element and the top of the Soapbox element on a home page.

 

A screenshot is included here and the URL for the work-in-progress site is: http://wp.safehouseweb.com/wip6/

 

Thanks in advance for any help you can offer!

 

DGhTm.png

 

 

Share this post


Link to post
Share on other sites

2 answers to this question

Posted · Report post

Hi,

 

Try adding this to your custom CSS:

#page #soapbox .content-pad {
padding-top: 0;
}


#page #soapbox .fboxgraphic img {
vertical-align: middle;
}

#page #callout .content-pad {
padding-bottom: 0;
}

 

I highly recommend you install FireBug or use the web developer tools that come bundled with most modern browsers. These tools allow you to inspect your sites HTML structure, along with the CSS used to style your site and are perfect for this kind of issue.

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

Danny, thanks much! That did the trick.

 

And I completely understand/appreciate your recommendation about using FireBug; I do have it but do not yet know enough about CSS to really ID what I'm looking for when I want to change something. Your help here not only solved my whitespace problem but it's also a great learning point & example for me as far as getting more CSS under my belt. Thanks, again!

Share this post


Link to post
Share on other sites