My CSS is so:
/* Bodies */
body{
color:#000088;
font-family:Verdana, Sans-serif;
border:2px solid #000066;
}
/*Layout*/
#content{
background:#dddddd;
}
#top {
padding:7px;
border-bottom:2px solid #000088;
background:#ccddff;
}
#wrapper{
margin-right:250px;
}
#left {
width:100%;
float:left;
margin-right:-350px;
padding-top:10px;
padding-right:7px;
padding-left:7px;
background:#cccccc;
border-right:2px solid #888888;
color:#000000;
}
#right {
float:right;
width:240px;
}
#bottom {
font-size:18pt;
clear:both;
border-top:2px solid #000088;
padding:7px;
background:#ccddff;
}
(More CSS that doesn't affect layout)
This is my HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta http-equiv="content-script-type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<meta name="Author" content="John-David Kraaikamp, Scott Ruhl">
<meta name="Description" content="Coach Random">
<meta name="Keywords" content="Coach, Random, Comic, Furry, Funnies, Dogs, Beer, College, Cavalier, Daily">
<title>The Original Coach Random</title>
<link type="text/css" rel="stylesheet" href=http://www.webdeveloper.com/forum/archive/index.php/"./setup.css">
</head>
<body>
<div id="top">
<h1>Heading 1</h1>
<h2>Heading 2</h2>
</div>
<div id="content">
<div id="wrapper">
<div id="left">
(Natterness)
</div>
</div>
<div id="right">
(Linkage)
</div>
</div>
<div id="bottom">yap yap yap</div>
</body>
</html>
What I wanted was for the background of #content to affect #right. However, it doesn't seem to be working. Why?
Site is at <!-- m --><a class="postlink" href="http://coachrandom.furtopia.orgWhy">http://coachrandom.furtopia.orgWhy</a><!-- m --> not just put the background on the #right or even the body?I wanted the body background to be white. If I do the background in #right, then it only goes as far as the text in #right goes, and leaves the rest of the right panel white. #left, you see, is always longer than #right.
/* Bodies */
body{
color:#000088;
font-family:Verdana, Sans-serif;
border:2px solid #000066;
}
/*Layout*/
#content{
background:#dddddd;
}
#top {
padding:7px;
border-bottom:2px solid #000088;
background:#ccddff;
}
#wrapper{
margin-right:250px;
}
#left {
width:100%;
float:left;
margin-right:-350px;
padding-top:10px;
padding-right:7px;
padding-left:7px;
background:#cccccc;
border-right:2px solid #888888;
color:#000000;
}
#right {
float:right;
width:240px;
}
#bottom {
font-size:18pt;
clear:both;
border-top:2px solid #000088;
padding:7px;
background:#ccddff;
}
(More CSS that doesn't affect layout)
This is my HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta http-equiv="content-script-type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<meta name="Author" content="John-David Kraaikamp, Scott Ruhl">
<meta name="Description" content="Coach Random">
<meta name="Keywords" content="Coach, Random, Comic, Furry, Funnies, Dogs, Beer, College, Cavalier, Daily">
<title>The Original Coach Random</title>
<link type="text/css" rel="stylesheet" href=http://www.webdeveloper.com/forum/archive/index.php/"./setup.css">
</head>
<body>
<div id="top">
<h1>Heading 1</h1>
<h2>Heading 2</h2>
</div>
<div id="content">
<div id="wrapper">
<div id="left">
(Natterness)
</div>
</div>
<div id="right">
(Linkage)
</div>
</div>
<div id="bottom">yap yap yap</div>
</body>
</html>
What I wanted was for the background of #content to affect #right. However, it doesn't seem to be working. Why?
Site is at <!-- m --><a class="postlink" href="http://coachrandom.furtopia.orgWhy">http://coachrandom.furtopia.orgWhy</a><!-- m --> not just put the background on the #right or even the body?I wanted the body background to be white. If I do the background in #right, then it only goes as far as the text in #right goes, and leaves the rest of the right panel white. #left, you see, is always longer than #right.