This is probably my own stupidity more than anything else. We have a site in draft at the moment at http://www.denobi.com/drafts/denobi_v2/index.html. You'll be able to see from this URL, what Im talking about. Basically there is this huge gap appearing at the end of the page, but i've checked heights and i cannot see any measurement that is anywhere near close!! Any help greatly appreciated!!
There are a number of things wrong with that page. Firstly, you've obviously used Dreamweaver, which makes the code messy and hard to decipher. But that's not too bad. Secondly, and more alarmingly, is this: <h2>Put keyword rich marketing description here, this is the info that google will display in search results.</h2> Code (markup): Keyword whoring will get you banned from Google quick smart, and the assumption is incorrect in any case; the text that search engines are supposed to display is in fact the meta description tag, which goes in your <head> section. Don't force an essay on users who lack CSS. It's off-putting, and pointless; imagine sitting there listening to a non-CSS capable screen reader read all of that out every time. The relevant content (and only the relevant content) should be first in the page. Degrade gracefully; don't make a fuss while you do it. You have used explicit size measurements all through your CSS. These should not be needed, as CSS layout flows automatically. Stick to font size, margin, padding, and float/clear properties to determine the sizing; don't explicitly specify it. Also, try not to give element IDs like "scroll" - they are meaningless in the context of the document structure, and give the air that you have developed the HTML for the CSS rather than the other way round. Having said all that, I am not entirely sure what the large space comes from, but fix the more fundamental issues first and then you will most likely find it will disappear. Regards - P
The culprit is this: .hidden { width: 0; height: 0; visibility: hidden; position: absolute; margin-right: -1000; margin-top: -1000; } Code (markup): It only needs to be this: .hidden { display: none; } Code (markup): If you only hide something, its space is still preserved. When you pulled the element up 1000 somethings (more to follow), the space was replaced below, due to margin collapse. Besides the comments that penagate made, you have errors in your css. That is, you've failed to include the metrical units on several properties. You might want to rethiink things. A single font size increase breaks the layout. Given you have specified a small font to begin with, a large number of people who hang around in spite of the overly small print will certainly hit <ctl>+ for a more readable size. cheers, gary