Novice CSS question

I am trying to learn to use CSS for layout and I am really having a hard time getting the right content div to go where I think I am telling it to. I know I am not doing anything complicated so I must be making a simple mistake, but I do not see what I am doing wrong. I am pasting in a portion of the css and markup that I am using. The problem is everything is fine until the right content which for some reason stays on the right like it is supposed to but is below the center content. Nothing I do will make it work but there is room for it. Thanks to anyone that can figure out what I am doing wrong.

body
{
color: black;
font-family: Verdana, Arial;
background-color: #f0f0f0;
}

#status
{
background-color: #a0c0e0;
width: 100%;
position: static;
color: Black;
}

#leftContent
{
left: 10px;
width: 150px;
position: absolute;
background-color: #80a0c0;
height: 100%;
color: black;
}

#centerContent
{
margin-left: 155px;
margin-right: 155px;
position: static;
height: 100%;
}

#rightContent
{
position: absolute;
right: 10px;
width: 150px;
background-color: #80a0c0;
height: 100%;
}

#myHeader
{
font-size: xx-large;
vertical-align: middle;
text-align: center;
}

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="JRLibrary.master.cs" Inherits="JRLibrary" %>
<!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 runat="server">
<title></title>
</head>
<body>
<h1 id="myHeader">
</h1>
<form id="form1" runat="server">
<div id="status">
</div>
<div id="leftContent">
</div>
<div id="centerContent">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
<div id="rightContent">
</div>
</form>
</body>
</html>

Novice CSS question

ABKThor

Setek

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week