Solved

Help with container for 3-column layout

Posted on 2008-10-30
7
207 Views
Last Modified: 2012-05-05
Trying desperately to move away from tables. Thought life was grand until I noticed when the content for my body div grows past a certain length, the text overflows past the footer.  If i set the footer to fixed then I'm left with white spacing under my two columns after the main content grows past a certain point.  Reading around, I'm guessing what I need is a container or multiple containers.  But I'm unsure as how to apply it.  Could someone help me out?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>Enter Title</title>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<meta name="Description" content="Description" />

<meta name="Keywords" content="Keywords" />

<style type="text/css">

#body {

	position:absolute;

	left:182px;

	top:285px;

	z-index:7;

	right: 182px;

	bottom: 5px;

	border-bottom-width: medium;

	border-bottom-style: solid;

	border-bottom-color: #FFFFFF;

	padding: 4px;

	font-family: Verdana, Arial, Helvetica, sans-serif;

	font-size: 11px;

}

#body A:link {

	font-family: Verdana, Arial, Helvetica, sans-serif;

	color: #C10202;

	text-decoration: underline;

}

#body A:visited {

	text-decoration: underline;

	color: #C10202;

}

#body A:hover {

	text-decoration: underline;

	color: #000000;

}

#body A:active {

	text-decoration: underline;

	color: #C10202;

}

#col_right {

	position:absolute;

	top:95px;

	width:176px;

	z-index:1;

	background-color: #f3f2df;

	right: 0px;

	border: medium solid #FFFFFF;

	bottom: 5px;

}

#col_left {

	position:absolute;

	left:0px;

	top:95px;

	width:176px;

	z-index:1;

	background-color: #f3f2df;

	border: medium solid #FFFFFF;

	bottom: 5px;

	padding-top: 45px;

}

.crumbs {

	font-family: Verdana, Arial, Helvetica, sans-serif;

	font-size: 9px;

}

.crumbs A:link {

	text-decoration: underline;

	color: #C10202;

}

.crumbs A:visited {

	text-decoration: underline;

	color: #C10202;

}

.crumbs A:hover {

	text-decoration: underline;

	color: #000000;

}

.crumbs A:active {

	text-decoration: underline;

	color: #C10202;

}

#footer_left {

	position:absolute;

	left:0px;

	width:176px;

	height:17px;

	z-index:11;

	background-color: #C10202;

	bottom: 0px;

	border: medium solid #FFFFFF;

	padding: 2px;

}

#footer_right {

	position:absolute;

	height:17px;

	z-index:12;

	bottom: 0px;

	left: 179px;

	background-color: #505050;

	right: 0px;

	border: medium solid #FFFFFF;

	font-family: Verdana, Arial, Helvetica, sans-serif;

	color: #FFFFFF;

	font-size: 9px;

	text-align: right;

	vertical-align: middle;

	padding: 2px;

}

#header_main {

	position:absolute;

	left:0px;

	top:0px;

	height:71px;

	z-index:2;

	background-color: #C10202;

	right: 0px;

	border: medium solid #FFFFFF;

	padding-top: 2px;

}

#header_sub1 {

	position:absolute;

	left:0px;

	height:25px;

	z-index:6;

	border: medium solid #FFFFFF;

	background-color: #C10202;

	right: 179px;

	top: 113px;

}

#header_sub2 {

	position:absolute;

	left:182px;

	height:130px;

	background-color: #707992;

	right: 182px;

	top: 144px;

	border-bottom-width: medium;

	border-bottom-style: solid;

	border-bottom-color: #FFFFFF;

	z-index: 1;

}

#menu_bar {

	position:absolute;

	left:0px;

	background-color: #D0D0B8;

	right: 0px;

	border-right-width: medium;

	border-right-style: solid;

	border-right-color: #FFFFFF;

	border-left-width: medium;

	border-left-style: solid;

	border-left-color: #FFFFFF;

	z-index: 1;

	height: 100%;

}

#menu_bar_container{

	position: absolute;

	left:0px;

	right:0px;

	top: 80px;

	text-align: center;

	z-index: 1;

	height: 40px;

	margin: 0px;

	padding: 0px;

}

</style>

</head>

<body>

<div id="header_main">Logo goes top.</div>

<div id="menu_bar_container"><div id="menu_bar">Menu goes here</div></div>

<div id="header_sub1"></div>

<div id="col_left"></div>

<div id="header_sub2"></div>

<div id="body">

<p class="crumbs"><a title="" href="#">Top Link</a> - Current Location</p>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.<br>

The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

positions because of their background, integrity, and skills developed through education and professional experience.

</div>

<div id="col_right"></div>

<div id="footer_left"></div><div id="footer_right">Footer text goes here...</div></div>

</body>

</html>

Open in new window

0
Comment
Question by:BendOverIGotYourBack
7 Comments
 
LVL 42

Accepted Solution

by:
David S. earned 400 total points
ID: 22844716
Ah. You're yet another beginner who gravitated toward absolute positioning and its illusion of control.

Check out this layout: http://www.pmob.co.uk/temp/3colfixedtest_4.htm

You can read about more CSS Layout/Positioning Techniques here:
http://www.dynamicsitesolutions.com/css/layout-techniques/
0
 
LVL 14

Expert Comment

by:yessirnosir
ID: 22844752
if you just change the two #footer divs to position:fixed; instead of absolute, your footer will stay glued to the bottom of the screen, while your content scrolls behind it.

if you want something more complicated, I really like Ryan Fait's "sticky footer" http://ryanfait.com/sticky-footer/
0
 
LVL 14

Expert Comment

by:yessirnosir
ID: 22844837
" If i set the footer to fixed then I'm left with white spacing"  
sorry, didn't read closely enough when I responded... I see you already tried fixed.  
I
0
Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

 
LVL 44

Assisted Solution

by:scrathcyboy
scrathcyboy earned 100 total points
ID: 22847219
0
 
LVL 14

Expert Comment

by:yessirnosir
ID: 22852279
if you're still looking for help, I messed around a bit with your layout, the Ryan Fait "sticky footer" approach, mentioned above, and then using the "faux column" approach to getting the background color of the left and right columns to continue beyond the bottom of the content.  I nuked a few of your div's just to make it easier to work with, but hopefully left enough so you can see how it works.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>three column liquid with faux columns background</title>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<meta name="Description" content="Description" />

<meta name="Keywords" content="Keywords" />

<style type="text/css">

* {margin:0;padding:0;}

html {background:url('leftback1.gif') repeat-y left top;height:100%;}

body {background:url('rightback1.gif') repeat-y right top;height:100%;}

html>body { min-height: 100%; height: auto;}

#container {position:relative; width:100%;

	min-height: 100%;

	height: auto !important;

	height: 100%;

	margin: 0 auto -17px; }

#footer {position:fixed;left:0px;bottom:0px;width:100%;height:17px;}

#push {height:17px;}

#col_middle {

	margin-left:184px;margin-right:184px;

}
 

#col_right {

	float:right;

	width:176px;

	background-color: #f3f2df;

	border-left: medium solid #FFFFFF;

	border-right: medium solid #FFFFFF;

	border-top: medium solid #FFFFFF;

	bottom: 5px;

}

#col_left {

	float:left;

	width:176px;

	background-color: #f3f2df;

	border-left: medium solid #FFFFFF;

	border-right: medium solid #FFFFFF;

	border-top: medium solid #FFFFFF;

	bottom: 5px;
 

}

.crumbs {

	font-family: Verdana, Arial, Helvetica, sans-serif;

	font-size: 9px;

}

.crumbs A:link {

	text-decoration: underline;

	color: #C10202;

}

.crumbs A:visited {

	text-decoration: underline;

	color: #C10202;

}

.crumbs A:hover {

	text-decoration: underline;

	color: #000000;

}

.crumbs A:active {

	text-decoration: underline;

	color: #C10202;

}

#footer_left {

	position:absolute;

	left:0px;

	width:176px;

	height:17px;
 

	background-color: #C10202;

	bottom: 0px;

	border: medium solid #FFFFFF;

	padding: 2px;

}

#footer_right {

	position:absolute;

	height:17px;

	

	bottom: 0px;

	left: 179px;

	background-color: #505050;

	right: 0px;

	border: medium solid #FFFFFF;

	font-family: Verdana, Arial, Helvetica, sans-serif;

	color: #FFFFFF;

	font-size: 9px;

	text-align: right;

	vertical-align: middle;

	padding: 2px;

}

#header_main {

	height:71px;

	background-color: #C10202;

	border: medium solid #FFFFFF;

	padding-top: 2px;

}

#header_sub1 {

	height:25px;

	border: medium solid #FFFFFF;

	background-color: #C10202;
 

}

#header_sub2 {

	height:130px;

	background-color: #707992;

	border-bottom-width: medium;

	border-bottom-style: solid;

	border-bottom-color: #FFFFFF;
 

}

#menu_bar {

	position:absolute;

	left:0px;

	background-color: #D0D0B8;

	right: 0px;

	border-right-width: medium;

	border-right-style: solid;

	border-right-color: #FFFFFF;

	border-left-width: medium;

	border-left-style: solid;

	border-left-color: #FFFFFF;

	height: 100%;

}

#menu_bar_container{

	position:relative;

	text-align: center;

	height: 40px;

	margin: 0px;

	padding: 0px;

}

</style>

</head>

<body>

<div id="container">

    <div id="header_main">Logo goes top.</div>

    <div id="menu_bar_container"><div id="menu_bar">Menu goes here</div></div>

     <div id="col_right">test right column</div>

    <div id="col_left">test left column</div>
 

    <div id="col_middle">

    <div id="header_sub2"></div>

          

        <p class="crumbs"><a title="" href="#">Top Link</a> - Current Location</p>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.

    </div>

   

    <div style="clear:both;"></div>

    <div id="push"></div>

</div>

<div id="footer">

<div id="footer_left"></div>

<div id="footer_right">Footer text goes here...</div>

</div>

</body>

</html>

Open in new window

leftback1.gif
rightback1.gif
0
 
LVL 14

Expert Comment

by:yessirnosir
ID: 22852731
just noticed that code above needs a little more work for IE6 compatibility; IE doesn't like the contents of the menu bar or the footer.  Also noticed that the padding around the footer makes it a bit bigger than the 17px I originally used, so below is an update with a few changes... still some padding/margin issues, but getting close...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>three column liquid with faux columns background</title>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<meta name="Description" content="Description" />

<meta name="Keywords" content="Keywords" />

<style type="text/css">

* {margin:0;padding:0;}

html {background:url('leftback1.gif') repeat-y left top;height:100%;}

body {background:url('rightback1.gif') repeat-y right top;height:100%;}

html>body { min-height: 100%; height: auto;}

#container {position:relative; width:100%;

	min-height: 100%;

	height: auto !important;

	height: 100%;

	margin: 0 auto -21px; }

#footer {position:fixed;left:0px;bottom:0px;width:100%;height:21px;}

#push {height:21px;}

#col_middle {

	margin-left:184px;margin-right:184px;

}

 

#col_right {

	float:right;

	width:176px;

	background-color: #f3f2df;

	border-left: medium solid #FFFFFF;

	border-right: medium solid #FFFFFF;

	border-top: medium solid #FFFFFF;

	bottom: 5px;

}

#col_left {

	float:left;

	width:176px;

	background-color: #f3f2df;

	border-left: medium solid #FFFFFF;

	border-right: medium solid #FFFFFF;

	border-top: medium solid #FFFFFF;

	bottom: 5px;

 

}

.crumbs {

	font-family: Verdana, Arial, Helvetica, sans-serif;

	font-size: 9px;

}

.crumbs A:link {

	text-decoration: underline;

	color: #C10202;

}

.crumbs A:visited {

	text-decoration: underline;

	color: #C10202;

}

.crumbs A:hover {

	text-decoration: underline;

	color: #000000;

}

.crumbs A:active {

	text-decoration: underline;

	color: #C10202;

}

#footer_left {

	position:absolute;

	left:0px;

	width:176px;

	height:17px;

 

	background-color: #C10202;
 

	border: medium solid #FFFFFF;

	padding: 2px;

}

#footer_right {

	margin-left:184px;

	height:17px;

	

	

	background-color: #505050;

	

	border: medium solid #FFFFFF;

	font-family: Verdana, Arial, Helvetica, sans-serif;

	color: #FFFFFF;

	font-size: 9px;

	text-align: right;

	vertical-align: middle;

	padding: 2px;

}

#header_main {

	height:71px;

	background-color: #C10202;

	border: medium solid #FFFFFF;

	padding-top: 2px;

}

#header_sub1 {

	height:25px;

	border: medium solid #FFFFFF;

	background-color: #C10202;

 

}

#header_sub2 {

	height:130px;

	background-color: #707992;

	border-bottom-width: medium;

	border-bottom-style: solid;

	border-bottom-color: #FFFFFF;

 

}

#menu_bar {

	position:absolute;

	left:0px;

	background-color: #D0D0B8;

	width:100%;

	border-right-width: medium;

	border-right-style: solid;

	border-right-color: #FFFFFF;

	border-left-width: medium;

	border-left-style: solid;

	border-left-color: #FFFFFF;

	height: 40px;

	

}

#menu_bar_container{

	position:relative;

	text-align: center;

	height: 40px;

	margin: 0px;

	padding: 0px;

}

</style>

</head>

<body>

<div id="container">

    <div id="header_main">Logo goes top.</div>

    <div id="menu_bar_container"><div id="menu_bar">Menu goes here</div></div>

     <div id="col_right">test right column</div>

    <div id="col_left">test left column</div>

 

    <div id="col_middle">

    <div id="header_sub2"></div>

          

        <p class="crumbs"><a title="" href="#">Top Link</a> - Current Location</p>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.<br>

        The <a href="#">accounting</a> discipline has undergone massive changes in the last few years, becoming both broader and more complex. Accountants are 

        trusted, objective professionals who provide information for decision-making and serve as business advisors. Many accountants end up in top executive 

        positions because of their background, integrity, and skills developed through education and professional experience.

    </div>

   

    <div style="clear:both;"></div>

    <div id="push"></div>

</div>

<div id="footer">

<div id="footer_left"></div>

<div id="footer_right">Footer text goes here...</div>

</div>

</body>

</html>

Open in new window

0
 

Author Comment

by:BendOverIGotYourBack
ID: 22871799
thanks folks, appreciate the help.  I'll look into this on tuesday/wednesday.  had another project dropped into my lap that's taking precedence.  
0

Featured Post

Threat Intelligence Starter Resources

Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

Join & Write a Comment

Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …

747 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

8 Experts available now in Live!

Get 1:1 Help Now