How to stop text scrolling into background? Options

[Janesdf]

Hi,

I'm new to this forum. I am in the beginning stage of creating a website for myself and I am a novice with html. When I scroll to the end of the text instead of the entire page scrolling to the bottom, the text scrolls up into the background. Attached are two images. In the second image, you can see how my text is now spread across the background image after scrolling. I would like to avoid that and I know it is possible, I just don't know the code for it.

Thank you for any help you can provide.

Jane

[pandy]

Hi Jane

Do you mean you want the text to scroll and everything else to stay put? You can do that with CSS, position: fixed.
http://www.w3.org/TR/CSS2/visuren.html#propdef-position

It works like this.

CODE

#topstuff   { position: fixed; top: 0;
              height: 6em; width: 100%; background: red }
#leftstuff  { position: fixed; top: 8em;
              width: 8em; background: yellow }
#main       { margin: 8em 0 0 9em }

HTML

<div id="topstuff">
<p>
Top</p>
<p>
Top</p>
</div>

<div id="leftstuff">
<p>
Left</p>
<p>
Left</p>
<p>
Left</p>
<p>
Left</p>
</div>

<div id="main">
<p>
The Web Design Group was founded to promote the creation of non-browser specific, non-resolution specific, creative and informative sites that are accessible to all users worldwide. To this end, the WDG offers material on a wide range of HTML related topics. We hope that with this site as a reference, you will be able to create Web sites that can be used by every person on the Internet, regardless of browser, platform, or settings</p>
<p>
The Web Design Group was founded to promote the creation of non-browser specific, non-resolution specific, creative and informative sites that are accessible to all users worldwide. To this end, the WDG offers material on a wide range of HTML related topics. We hope that with this site as a reference, you will be able to create Web sites that can be used by every person on the Internet, regardless of browser, platform, or settings</p>
<p>
The Web Design Group was founded to promote the creation of non-browser specific, non-resolution specific, creative and informative sites that are accessible to all users worldwide. To this end, the WDG offers material on a wide range of HTML related topics. We hope that with this site as a reference, you will be able to create Web sites that can be used by every person on the Internet, regardless of browser, platform, or settings</p>
<p>
The Web Design Group was founded to promote the creation of non-browser specific, non-resolution specific, creative and informative sites that are accessible to all users worldwide. To this end, the WDG offers material on a wide range of HTML related topics. We hope that with this site as a reference, you will be able to create Web sites that can be used by every person on the Internet, regardless of browser, platform, or settings</p>
<p>
The Web Design Group was founded to promote the creation of non-browser specific, non-resolution specific, creative and informative sites that are accessible to all users worldwide. To this end, the WDG offers material on a wide range of HTML related topics. We hope that with this site as a reference, you will be able to create Web sites that can be used by every person on the Internet, regardless of browser, platform, or settings</p>
</div>

You need to give the text box margins so it goes free of the positioned boxes, or they will be on top of the text and cover it.