• Locked
No replies
Sun, 2009-05-03 20:25
ctinder
ctinder's picture
User offline. Last seen 1 year 17 weeks ago. Offline
newbie
Joined: 2009-05-03
Posts: 1
Points: 0

I've been working on this for weeks and I'm desperate for some help. I'm a college student enrolled in an online Web Design Course. I understand the basics of CSS but am having trouble with my drop-down menus. I have validated both the html and css with the respected validators on W3.org. Also I don't know exactly how to find out which DTD to put on my site so if I can have a little help with that it would be greatly appreciated. I've tried tutorials at various websites so if there is a tutorial anyone can recommend that would be excellent.
Link: http://slsnv001.enmu.edu/tinderc/directory/index.html

<html>
<head>
 
<title>SANE</title>
 
<link rel="stylesheet" href="style.css" type="text/css">
<style type="text/css"> 
 
.required
{
    width: 300px;
    font: bold 12px Verdana;
    background-color: #6a6;
    border: solid 2px #000;
}
.tdrequired
{
    font: bold 12px Verdana;
}
.optional 
{
    width: 300px;
    font: 12px Verdana;
    background-color: #6a6;
    border: solid 2px #999;
}
.tdoptional 
{
    font: 12px Verdana;
}
.submit
{
    background-color: #6a6;
    border: solid 2px #000;
    font: bold 12px Verdana;
}
</style>
 
</head>
 
<body>
<div id="header"><img src="title.jpg"></div>
 
<div id="menu">
<table>
<tr>
<td><a href="index.html">Home</a></td>
<td>|</td>
<td><a href="getinfo.html">Get Information</a></td>
<td>|</td>
<td><a href="gethelp.html">Get Help</a></td>
<td>|</td>
<td><a href="aboutus.html">About Us</a></td>
</tr>
</table>
</div>
<div id="content">
<h1>Home</h1>
 
<center><img src="enmu.jpg" style="border: 2px solid black" width="50%" height="50%" alt="ENMU Campus">
<p>
 
 
 
</center>
</div>
</body>
</html>

style.css

body 
{	font-family: Georgia; 
margin: 0px; 
background-color: #6c6;
 }
 
table 
{ 
	 font-family: Trebuchet MS; 
 }
 
td, th 
{	padding-left: 25px; 
  margin: 0px; 
  font-weight: bold;
}
 
#header 
{ 	font: bold 48px Trebuchet MS;
padding-left: 0px;
text-align: center;
border-bottom: 3px solid black;
border-right: 0px solid black; 
background-color: #060; 
margin-bottom: 0px; 
}
#content 
{	float: left;
padding: 1px 20px 1px 10px; 
width: 100%; 
margin-top: 0px;
border: none; 
height: 97%;
background-color: silver;
 }
#menu {
width: 100%;
background: #060;
text-align: center;
}
 
#menu ul {
list-style: none;
margin: 0;
padding: 0;
width: 12em;
float: left;
}
 
#menu a, #menu h2 {
font: bold 11px/16px arial, helvetica, sans-serif;
border-width: 1px;
border-style: solid;
border-color: #060;
margin: 0;
padding: 2px 3px;
}
 
#menu h2 {
color: #fff;
background: #060;
text-transform: uppercase;
}
 
#menu a {
color: #003;
background: #060;
text-decoration: none;
}
 
#menu a:hover {
color: #ff0;
background: #060;
}
 
#menu li {position: relative;}
 
#menu ul ul {
position: absolute;
z-index: 500;
}
 
#menu ul ul ul {
position: absolute;
top: 0;
left: 100%;
}
 
div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul
{display: none;}
 
div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}
 
#menu ul li {float: left; width: 100%;}

Again any help is appreciated I have asked my teacher and we do not have a textbook so this is my last resort.
-CT

Top
Tags: