I am having issues in producing a layout using CSS only. I would be grateful if one of the many CSS gurus in the community would help point me in the direction for creating a stylesheet that accomplishes my goal and remain cross-browser compatible. Convention would suggest I post the code developed to this point. But to be honest, I have found I do not have a clue as to what I am doing. Further, in the process of synthesizing others code that achieves some of what I need to accomplish, my lack of skill has created a product that is a discordant and disparate mess of otherwise good code. As such, please accept my humble apologies for not posting what I have created thus far.
The Goal: Create a fixed header and footer that span the entire width of the top and bottom of the viewport, respectively. In the remaining area would be two surrounds: one for navigation and one for content. The nav container would be 175px wide and 100% the remaining height; while the content container would occupy the remaining area. Within the nav container would be a nested div that has a margin of 3px, a 1px black border and occupy 100% width and height of the nav container; any overflow would be hidden. Within the content container would be a nested div that has a margin of 3px, a 1px black border, and occupy 100% width and at minimum 100% height of the content container. Any overflow would spawn a vertical scrollbar over the content container.
In the event my description was not clear, a GIF of the layout is available at http://www.propagranda.com/images/website_layout.gif
. Thank you in advance for the help.