Ok, I have a design for a web site with a menu positioned on the left and a “main content area” to the right of the menu. I would like the content area to grow vertically only, but be in it’s own “frame” (have scroll bars to move down through while the rest of the page remains motionless.) I’ve tried IFRAMEs and didn’t really like them. Someone told me that I could do the same thing with DIVs and CSS.
I got the div looking the way I want but my problem is that the div scrolls horizontally as well as vertically. I’m using the overflow option. ’ overflow: auto; ’
I can re-type and position the text and content and that fixes the problem but isn’t there a way to make your text automatically fit the container it’s put in instead of the div changing itself to accomodate the text?
Also I have heard other developers criticize the scrolling content idea.
Is it foepaw? (don’t know how to spell that word)
And if so, why?
My rational is:
I have quite a bit of content and wanted the menu and other links to remain where the viewer could get easy access to them.
I’ve never liked the target links that take you back up to the top of the page. I know of ways to make the menu drop down and follow the viewer as they scroll but think those types of menus to be annoying and a bit tacky. (just my opinion, don’t wanna step on anyone’s toes )
No not like that. That’s a little too complicated. Just a little window within a window I guess…cept it wouldn’t be a window…just scroll like one?..I’ve ceased making sense I fear.
I think that’s what you mean, like if the content is larger than the DIV’s height you can either make the DIV bigger to accomodate the content, hide the content, scroll the DIV (scroll bar at the side of the DIV) - I think that’s what the options do.
overflow: visible;
I think you’d want the “overflow: scroll;” property.
<style type="text/css">
div
{
background-color:#00FFFF;
width:150px;
height:150px;
overflow: auto
}
</style>
try this… specify the width and height to your liking.
What about creating a table with the width 100% of the frame? Resizing the window will automatically adjust the width of the table to fit the width of the window since it’s 100%, not in pixels.
)