Text is scrolling in website when browser window is shrunk

[ODRKyle]

Everything was going great in the new site I was building until I realized that when the browser window is shrunk, or even just smaller than the 800 width i set my page up, any text I have begins to scroll and mess up the page. How can I fix this? Can I but a tag in the header or what? Thanks.

Here is the site and all you have to do is shrink your browser. http://www.odrvb.org/kyle/index.html

Thanks again.

[jthayne]

The problem is in your using position: absolute. What that does is remove the item from the height determination of the page. When you resize your window, the divs get narrower cauing the text to wrap, and the div to then get longer. This should push the other divs down, but since you are using position: absolute, you are telling every item exactly where to start, and like good little children they are listening.

The best way to counteract that is to give every div that is giving you issues, a set width. For example, "width: 600px" (And don't forget the px if you add it by hand. However, Coffee Cup will probably take care of it for you)

Another recommendation (though it won't really affect what you are doing now) is to not put the hard returns after each line. Unless you want the line to break in a specific spot (i.e. the usavolleyball link at the bottom on its own line), let the lines wrap naturally. You will be a lot happier and any future changes will be a lot easier.

[ODRKyle]

Ok, I will take a look at that, and I too notice the hard lines, but I didn't do that, I think that CoffeeCup automatically formatted it that way. Will revisit though, thanks.

[jthayne]

No problem. Let me know if there is anything else I can do to help.