Solved

extra space appearing at bottom of page due to CSS, how to eliminate

Posted on 2010-09-06
3
362 Views
Last Modified: 2012-06-27
On this page:

http://secure.bbdesign.com/sterlingmodular/

...if you reduce the height of the browser window to force scrolling, there is about 60 pixels of unwanted vertical space below the content on the page (see attached screenshot from Safari). I tried to code my CSS to have no margins or padding that would cause all that space.

I need to somehow eliminate it. I've spent a lot of time trying different things and its becoming frustrating. It may be something simple and I'm just not seeing it. So I would really appreciate another set of eyes to take a look. Thank you!

screenshot
0
Comment
Question by:bbdesign
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
3 Comments
 
LVL 13

Accepted Solution

by:
darren-w- earned 500 total points
ID: 33611893
This looks like the size of the div that is holding the image and the text, try styling these divs to the correct height (253px)

Darren
0
 
LVL 43

Expert Comment

by:Chris Stanyon
ID: 33612446
@bbdesign.

Inside each of your DIVS you have a class for the paragraph of text (homethree, homefour) that sets the position:relative and, for example, top to -55px.

The gap that appears is because of the that top:-55px - try changing that to margin-top:-55px; and see how you get on.


0
 

Author Comment

by:bbdesign
ID: 33613064
@darren-w-: that did it! Thanks. I assumed a plain <div></div> would just collapse down to the minimum size.

@chrisstanyon: I did try that, but no affect. The "top" isn't a margin, if I change it to margin-top, then the text appears below the image instead of over it.
0

Featured Post

Secure Your Active Directory - April 20, 2017

Active Directory plays a critical role in your company’s IT infrastructure and keeping it secure in today’s hacker-infested world is a must.
Microsoft published 300+ pages of guidance, but who has the time, money, and resources to implement? Register now to find an easier way.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

726 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question