<div>
Part of that space is for the <i>&lt;!-- Second Row Middle Box --&gt;</i> section. The div with id <i>panel-news</i> become 200px tall on the smaller screen (style2.css, line 1878). Also, the footer has a margin-top of 140px at all screen sizes (style2.css, line 1294).
</div>


Part of that space is for the  section. The div with id panel-news become 200px tall on the smaller screen (style2.css, line 1878). Also, the footer has a margin-top of 140px at all screen sizes (style2.css, line 1294).

<div>
my comments are same like Kim walkers, but just elaborated them more.
</div>


my comments are same like Kim walkers, but just elaborated them more.

<div>
<div class="content wysiwyg-content">
The page looks fine when it's displayed on the full desktop screen, but when I scrunch it down in the browser to see how it looks on the cell phone there is a huge gap between the footer and container part of the page.<br />
<br />
<a href="http://insuranceqa.illinois.gov/TestSite1/index2.html" rel="ugc">http://insuranceqa.illinois.gov/TestSite1/index2.html</a>
</div>
</div>


The page looks fine when it's displayed on the full desktop screen, but when I scrunch it down in the browser to see how it looks on the cell phone there is a huge gap between the footer and container part of the page.

http://insuranceqa.illinois.gov/TestSite1/index2.html

css footer doesn't collapse properly

Cascading Style Sheets (CSS) is a language used for describing the look and formatting of a document written in a markup language. Usually used to change web pages and user interfaces written in HTML, it can also be applied to any kind of XML document. CSS is designed primarily to distinguish the content of a document from its presentation.