...

View Full Version : What's wrong with my CSS?



footballwags12
10-21-2007, 08:42 PM
I can't seem to color my sidebar navigational menu. Here is my code for CSS, home.html, and sidebar.html. Can you help me find the error?

Thanks, Joe


**********CSS********
#body {
background-color: #009900;
font-family: "Trebuchet MS";
}
#table {
list-style-position: outside;
list-style-type: disc;
border-spacing: 2px 2px;
border-collapse: separate;
font-size: 16px;
font-style: normal;
font-weight: normal;
font-family: "Trebuchet MS";
}
#main-con {
position: absolute;
top: 200px;
left: 300px;
border-color: #FF0000;
border-width: 10px;
padding: 1px;
height:auto;
width:500px;
font-size: 14px;
font-family: "Trebuchet MS";
background-color: #000066;
}
#main-con a:link {color: #FFFF00;}
#main-con a:visited {color: #00FFFF;}
#main-con a:hover {color: #000000; background: #00FFFF; font-weight: bold;}
#main-con a:active {color: #00FFFF;}
#sideframe {
position: absolute;
top: 150px;
left: 0px;
height: 500px;
width: 150px;
}
#SidebarMenu {
position: absolute;
top: 150px;
left: 0px;
height: 500px;
width: 150px;
background: #000066;
}
.header {
margin-top: 0px;
font-size: 15pt;
text-align: center;
border-bottom: 1px solid #009900;
}
#SidebarMenu a {
display: block;
text-decoration: none;
text-indent: 10px;
border-bottom: 1px solid #FFFFFF;
}
#SidebarMenu a:link{color: #FF0000; background: #000066; border-bottom: 1px solid #FFFFFF;}
#SidebarMenu a:visited{color:#FF0000; background: #000066;border-bottom: 1px solid #FFFFFF;}
#SidebarMenu a:hover{color: #000066; background: #FF0000; border-bottom: 1px solid #FFFFFF; font-weight: bold; font-style: italic;}
#SidebarMenu a:active{color: #FF0000; background:#000066; border-bottom: 1px solid #FFFFFF;}
#footer {
position: absolute;
top: 490px; <!--was 500-->
left: 0px; <!--was 375-->
width: 275px; <!--was 300-->
}
#footer a:link {color: #00FFFF;}
#footer a:visited {color: #00FFFF;}
#footer a:hover {color: #000000; background: #00FFFF; font-weight: bold; font-style: italic;}
#footer a:active {color: #00FFFF;}
p {
color: #FFFFFF;
font-size: 12pt;
}
h1, h2, h3, h4, h5, h6 {
text-align: center;
color: #FFFFFF;
}
strong {
color: #FFFFFF;
}
ul {
color: #FFFFFF;
}
ol {
color: #FFFFFF;
}
li {
color: #FFFFFF;
}
table, td, tr {
text-align: center;
color: #FFFFFF;
}
marquee {
font-color: FFFFFF#;
background-color: #FFFFFF;
}

************HOME****************
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html>
<head>
<title>The DS Realm - Home</title>
<link href="style.css" rel="stylesheet" type="text/css">
<img src="logo.jpg">
</head>
<body bgcolor="#000000">
<marquee>What is up?</marquee>
<div id="main-con">
<table>
<center><caption><img src="news.jpg"></center></caption>
<td><tr><h1>Site Created!</h1><hr>Hi/tr></td>


</table>
</div>
<iframe src="sidebar.html" scrolling="no" frameborder="0" id="sideframe">The navigation is here. Click<a href="sidebar.html" target="_top">here</a>to navigate.</iframe>
</div>
</body>
</html>
*************SIDEBAR****************
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="sidebar">
<div class="header"><a href="home.html" target="_top">Home</a></div>
<div class="header"><a href="news.html" target="_top">News</a></div>
<div class="header"><a href="cheats.html" target="_top">Cheats</a></div>
<div class="header"><a href="codes.html" target="_top">Codes</a></div>
<div class="header"><a href="previews.html" target="_top">Previews</a></div>
<div class="header"><a href="reviews.html" target="_top">Reviews</a></div>
<div class="header"><a href="screenshots.html" target="_top">Screenshots</a></div>
<div class="header"><a href="videos.html" target="_top">Videos</a></div>



</div>
</body>
</html>


THANKS!

medigerati
10-22-2007, 04:04 AM
In your CSS, try changing all instances of 'SidebarMenu' to just 'sidebar'



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum