I want it to look like this and go completely top to bottom.
and here is what im getting
CSS Code:
- Code: Select all
@charset "utf-8";
/* CSS Document */
body {
text-align: center;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
background-color:#526d7b;
}
#main_content_area
{
width:900px;
height:auto;
background-color:ebebeb;
}
#left_bar
{
width:25px;
height:auto;
background-image:url(images/left_bar.gif);
background-repeat:repeat-y;
float:left;
}
#right_bar
{
width:25px;
height:auto;
background-image:url(images/right_bar.gif);
background-repeat:repeat-y;
float:right;
}
HTML Code
- Code: Select all
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled</title>
<link href="inevmaps.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="main_content_area">
<div id="left_bar"></div>
<div id="right_bar"></div>
This is starting to annoy me!
<p>
It needs to be centered and stretch all the way from the top to the bottom of any resolution moniter, including those gradient things on each side.
</div>
</body>
</html>
