i am very new to web development and i'm stuck on a scroll issue. i have a background that is always 100% by 100% in body size. my page is structured so that the content is positioned relative to the bottom/footer area of the page. our divs our structured with 100% width by fixed heights (in px measurements) so that they remain aligned properly with the bottom/footer when the window is resized.
my problem: i would like to have scroll bars within the divs or just scroll bars in general for when the window is resized too small, all the while keeping the bottom/footer properly aligned. right now, i have set the overflow property and it isn't working. no scroll bars appear when the window is resized. the bottom/footer stays properly, but the content on the top, etc. starts to disappear... and i've got no scroll bars to get to it. please help, i'm losing my mind
my divs... i'll post other code if nec., let me know.
Code: Select all
<div>
<div id="scroller"></div>
<img src="Images/background.jpg" name="background" width="1150" height="768" id="background" /> </div>
<div id="footerIndex">
<div id="contentSignUp">
<div id="howItWorks"><a href="howItWorks.php"><img src="Images/howItWorks.png" alt="How It Works" width="85" height="85" class="linkButton" /></a></div>
<img src="Images/footerIndex.png" width="709" height="559" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="159,481,230,553" href="index.php" alt="home" />
<area shape="rect" coords="296,519,352,537" href="about.php" alt="about" />
<area shape="rect" coords="286,536,353,553" href="#feedbackGENERAL.php" alt="contact" />
</map>
</div>
<div id="payPalLogo"><img src="Images/verification_seal.gif" width="60" height="60" alt="Official PayPal Seal" /></div>