Site styling problem – right side column

Here is the style sheet:

/* General Layout */
body {
margin: 0;
padding: 0;
background: #f6f6f6;
color: #000;
font-family: 'lucida grande', 'lucida sans unicode', verdana, sans-serif;
text-align: center; /* added by Alex King for compatibility with IE 5 */
}

#rap {
margin: 10px auto 0 auto;
padding: 0;
width: 767px;
border: 3px solid #aba;
background: #fff;
background-image: url('slant-whitegray.gif');
overflow: auto;
text-align: left; /* added by Alex King for compatibility with IE 5 */
}

#header {
background-image: url("http://www.ohioforblackwell.com/blog/images/slant-green.gif");
margin: 0;
padding: 0px;
font: normal 2.8em georgia;
border-bottom: 2px solid #aba;
}

#header a {
color: #666;
text-decoration: none;
}

#content {
width: 500px;
margin: 0;
text-align: left;
float: left;
background-color: transparent;
padding: 10px 25px;
border-right: 2px solid #aaa;
}

#menu {
margin: 0;
padding: 0;
width: 215px;
background: #00135E;
float: right;
overflow: hidden;
}

.credit {
clear: both;
width: 750px; /* changed by Alex King to match the width of the body */
margin: 0 auto 10px auto;
padding: 5px 3px;
background-image: url('slant-green.gif');
color: #000;
text-align: center;
}

.credit cite {
color: #000;
font-size: 90%;
font-style: normal;
letter-spacing: 1px;
}

.credit a, .credit a:link, .credit a:hover {
color: #fff;
text-decoration: none;
}

/* Basic XHTML styling */
h1, h2, h3 {
font-family: georgia, palatino, serif;
}

h2 {
margin: 0;
padding: 0;
font-size: 110%;
}

h3 {
font-size: 120%;
}

p {
font: 80%/130% verdana, 'lucida sans unicode', sans-serif;
color: #555E55;
}

/* Links */
a {
color: #aba;
text-decoration: none;
}

a:link, a:visited {
color: #666;
text-decoration: none;
}

a:hover {
text-decoration: none;
}

a:active {
text-decoration: none;
}

a img {
border: none;
}

/* Menu styling */
#menu a:link, #menu a:visited, #menu a:hover, #menu a:active {
margin: 0;
padding: 0;
}

#menu ul {
margin: 10px 0 5px 10px;
padding: 0;
color: #D10000;
list-style-type: none;
font: 12px palatino, georgia;
}

#menu ul li ul {
margin: 0 10px;
padding: 0;
}

#menu ul li ul li {
margin-top: 2px;
}

#menu #categories, #menu #search, #menu #archives, #menu #other, #menu #meta, #menu #style {
padding-top: 10px;
}

#menu form {
margin: 0;
}

#menu input {
font-family: 'lucida sans unicode', verdana, sans-serif;
}

#menu form #searchbox {
width: 8em;
padding: 2px;
}

/* Form styling */
form {
margin: 0;
padding: 0;
}

input, textarea {
padding: 1px;
}

/* other elements */
code {
font-style: normal;
color: #000;
padding-left: 15px;
font-family: 'courier new', courier, monospace;
}

acronym, abbr {
border-bottom: 1px dashed #aaa;
cursor: help;
font-size: 80%;
letter-spacing: .07em;
font-weight: bold;
}

/* WordPress elements */
.post {
text-align: left;
margin: 0 0 25px 0;
}

.storytitle {
margin: 0;
padding: 0;
font-size: 120%;
font-family: georgia, palatino, serif;
font-weight: normal;

}

.storytitle a {
color: #9BAA9B;
text-decoration: none;
}

.storycontent ul, .storycontent ol {
font: .8em 'lucida sans unicode', 'lucida grande', verdana, sans-serif;
}

.storycontent ul li, .storycontent ol li {
margin-top: 3px;
}

.meta {
font: 11px 'lucida grande', 'lucida sans unicode', verdana, sans-serif;
}

.meta a {
color: #747474;
}

.meta ul {
display: inline;
margin: 0;
padding: 0;
list-style: none;
}

.meta li {
display: inline;
}

.feedback {
font: 11px 'lucida grande', 'lucida sans unicode', verdana, sans-serif;
color: #000;
text-align: left;
}

/* WordPress comments form */
#commentform input, #commentform textarea {
background: #fff;
border: 1px solid #aaa;
}

#commentform textarea {
width: 100%;
}

/* WordPress calendar */
#calendar {
margin: 10px 0;
}

#wp-calendar {
border-left: 1px solid #aba;
border-right: 1px solid #aba;
border-bottom: 1px solid #aba;
empty-cells: show;
margin: 0;
width: 80%;
}

#wp-calendar caption {
padding: 3px;
text-align: center;
background-color: #aba;
color: #fff;
}

#wp-calendar #next a {
margin-top: 5px;
padding-right: 10px;
text-align: right;
}

#wp-calendar #prev a {
margin-top: 5px;
padding-left: 10px;
text-align: left;
}

#wp-calendar a {
display: block;
text-decoration: none;
font-weight: bold;
}

#wp-calendar a:hover {
background: #000;
color: #fff;
}

#wp-calendar td {
color: #777;
font-family: 'lucida grande', 'lucida sans unicode', verdana, sans-serif;
letter-spacing: normal;
padding: 3px 0;
text-align: center;
}

#wp-calendar #today {
background: #aba;
color: #fff;
}

#wp-calendar th {
font-style: normal;
text-transform: capitalize;
}

I don’t see anything that seperates the menu from the “sidebar”- Am I wrong?

I sincerely apologize- I am a stupid newbie who doesn’t know much about css, other than trial and error.

How do I make the height of the blue to be 100%?

That doesn’t work- The gif doesn’t do anything at this point- I just took it out and it still looks the same. Is there no way to change the background color of the right column?

It works perfectly! Thank you so much guys!!!!

🙂