can anyone tell me why this doesn't work? see attachment.Can you post a link or the code? I opened your attachment, but it's very difficult to read due to the formatting.There is no code to do the dropdown. Read how to do Suckerfish dropdowns (<!-- m --><a class="postlink" href="http://www.alistapart.com/articles/dropdowns/">http://www.alistapart.com/articles/dropdowns/</a><!-- m -->)sorry, didn't realize how screwed up that got. i couldn't attach html or css so the css/html is as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive">
<title>Forged WebDesign, LLC</title>
<style type="text/css">
body
{
background: #fff;
color: #000;
margin-left: 0px;
padding: 0;
}
#center
{
width: 800px;
margin: 0 auto;
}
/*Primary header tag (sets properties for title area)***********************************************************/
H1
{
margin: 0px;
float: none;
width: 780px;
color: #f90;
font-size: 37px;
font-family: Arial;
border-bottom-width: 2px;
border-bottom-color: #c00;
border-bottom-style: solid;
padding-left: 10px;
padding-bottom: 3px;
}
/*Primary li tag (sets properties for top nav link boxes)*******************************************************/
/*li {display: block; float: left; padding: 0px;}*/
/*Top nav link properties***************************************************************************************/
a {font-family: Times;}
#topnav
{
font-family: Times;
font-size: 14px;
text-align: center;
float: left;
width: 790px;
text-decoration: none;
color: #fff;
background-color: #999;
padding: 1px 0;
}
/*DropDown Definitions***************************************************************************************** */
.drop
{
float: left;
width: 120px;
padding: 2px 0 0 0;
}
/*Controls the appearance of the menu hover**********************************************************************/
.drop:hover
{
margin: 0;
background-color: #c00;
width: 120px;
padding: 2px 0 0;
}
/*Adjusts the display properties of the dropdowns****************************************************************/
.drop ul
{
display: none;
width: 125px;
height: 20px;
background-color: #c00;
color: #fff;
margin: 0;
padding: 0;
}
/*Adjusts the positioning of the dropdowns***********************************************************************/
.drop ul li
{
display: block;
padding: 0;
}
div.drop:hover ul
{
margin: 0;
padding: 0;
}
/*Controls the color of the dropdown hover bg*******************************************************************/
div.drop ul li:hover
{
background-color: #f00;
width: 125px;
height: 1em;
}
/*Font def for main paragraphs**********************************************************************************/
p.main {font-family: Courier}
/*This element encompasses all others except H1*****************************************************************/
div.main
{
margin: 0px;
/*position: absolute;
top: 55px;
left: 0px;*/
font-family: Courier;
width: 790px;
height: 500px;
padding-top: 1px;
}
</style>
</head>
<body id="center">
<div class="header">
<h1>Title Goes Here</h1>
</div>
<div id="center" class="main">
<div id="topnav">
<div id="drop1" class="drop">Link 1</div>
<div id="drop2" class="drop">Link 2
<ul>
<li>sublink 1</li>
<li>sublink 2</li>
</ul>
</div>
<div id="drop3" class="drop">Link 3</div>
<div id="drop4" class="drop">Link 4
<ul>
<li>sublink 3</li>
<li>sublink 4</li>
<li>sublink 5</li>
</ul>
</div>
</div>
</div>
</body>
</html>Yeah, well like Fang said - you've got nothing there that would actually do dropdowns. You have the code all wrong. The link that Fang gave you is what you need.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive">
<title>Forged WebDesign, LLC</title>
<style type="text/css">
body
{
background: #fff;
color: #000;
margin-left: 0px;
padding: 0;
}
#center
{
width: 800px;
margin: 0 auto;
}
/*Primary header tag (sets properties for title area)***********************************************************/
H1
{
margin: 0px;
float: none;
width: 780px;
color: #f90;
font-size: 37px;
font-family: Arial;
border-bottom-width: 2px;
border-bottom-color: #c00;
border-bottom-style: solid;
padding-left: 10px;
padding-bottom: 3px;
}
/*Primary li tag (sets properties for top nav link boxes)*******************************************************/
/*li {display: block; float: left; padding: 0px;}*/
/*Top nav link properties***************************************************************************************/
a {font-family: Times;}
#topnav
{
font-family: Times;
font-size: 14px;
text-align: center;
float: left;
width: 790px;
text-decoration: none;
color: #fff;
background-color: #999;
padding: 1px 0;
}
/*DropDown Definitions***************************************************************************************** */
.drop
{
float: left;
width: 120px;
padding: 2px 0 0 0;
}
/*Controls the appearance of the menu hover**********************************************************************/
.drop:hover
{
margin: 0;
background-color: #c00;
width: 120px;
padding: 2px 0 0;
}
/*Adjusts the display properties of the dropdowns****************************************************************/
.drop ul
{
display: none;
width: 125px;
height: 20px;
background-color: #c00;
color: #fff;
margin: 0;
padding: 0;
}
/*Adjusts the positioning of the dropdowns***********************************************************************/
.drop ul li
{
display: block;
padding: 0;
}
div.drop:hover ul
{
margin: 0;
padding: 0;
}
/*Controls the color of the dropdown hover bg*******************************************************************/
div.drop ul li:hover
{
background-color: #f00;
width: 125px;
height: 1em;
}
/*Font def for main paragraphs**********************************************************************************/
p.main {font-family: Courier}
/*This element encompasses all others except H1*****************************************************************/
div.main
{
margin: 0px;
/*position: absolute;
top: 55px;
left: 0px;*/
font-family: Courier;
width: 790px;
height: 500px;
padding-top: 1px;
}
</style>
</head>
<body id="center">
<div class="header">
<h1>Title Goes Here</h1>
</div>
<div id="center" class="main">
<div id="topnav">
<div id="drop1" class="drop">Link 1</div>
<div id="drop2" class="drop">Link 2
<ul>
<li>sublink 1</li>
<li>sublink 2</li>
</ul>
</div>
<div id="drop3" class="drop">Link 3</div>
<div id="drop4" class="drop">Link 4
<ul>
<li>sublink 3</li>
<li>sublink 4</li>
<li>sublink 5</li>
</ul>
</div>
</div>
</div>
</body>
</html>Yeah, well like Fang said - you've got nothing there that would actually do dropdowns. You have the code all wrong. The link that Fang gave you is what you need.