I need a little help with an Eric Meyer project I'm working on, below is the
current code and below that I'll put the instructions.
[code]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd";>
<html>
<head>
<title>Project 6</title>
<style type="text/css">
body {background: #EEE; color: #000;
behavior: url(csshover.htc);} /* WinIE behavior call */
h1 {color: #AAA; border-bottom: 1px solid; margin-bottom: 0;}
#main {color: #CCC; margin-left: 7em; padding: 2em 0 1px 5%;
border-left: 1px solid;}
div#nav {float: left; margin: -1px 0 0 7em;
background: #FFF; border: 1px solid #AAA;}
div#nav ul {margin: 0; padding: 0; background: white;
border: 1px solid #CCC; border-width: 0 1px;}
div#nav li {position: relative; list-style: none; margin: 0;
float: left; width: 7em; line-height: 1em;}
div#nav li:hover {background: #EBB;}
div#nav li.submenu {background: url(dropmenu.gif) 95% 50% no-repeat;}
div#nav li.submenu:hover {background-color: #EDD;}
div#nav li a {display: block; padding: 0.25em 0 0.25em 0.5em;
text-decoration: none; width: 6.5em;}
div#nav>ul a {width: auto;}
div#nav ul ul {position: absolute; width: 7em;
display: none;}
div#nav ul ul li {border-bottom: 1px solid #CCC;}
div#nav li.submenu li.submenu {background: url(submenu.gif) 95% 50% no-repeat;}
div#nav li.submenu li.submenu:hover {background-color: #EDD;}
div#nav li.submenu li.submenu:hover {background-color: #EDD;}
div#nav ul.level1 li.submenu:hover ul.level2,
div#nav ul.level2 li.submenu:hover ul.level3 {display:block;}
div#nav ul.level2 {top: 1.5em; left: -1px;}
div#nav ul.level3 {top: -1px; left: 7em;
border-top: 1px solid #CCC;}
</style>
</head>
<body>
<h1>Adipiscing Rhubarb</h1>
<div id="nav">
<ul class="level1">
<li><a href="/">Home</a></li>
<li class="submenu"><a href="/services/">Services</a>
<ul class="level2">
<li><a href="/services/strategy/">Strategy</a></li>
<li><a href="/services/optimize/">Optimization</a></li>
<li><a href="/services/guidance/">Guidance</a></li>
<li><a href="/services/training/">Training</a></li>
</ul>
</li>
<li><a href="/events/">Events</a></li>
<li class="submenu"><a href="/pubs/">Publications</a>
<ul class="level2">
<li><a href="/pubs/articles/">Articles</a></li>
<li class="submenu"><a href="/pubs/tuts/">Tutorials</a>
<ul class="level3">
<li><a href="/pubs/tuts/html/">HTML</a></li>
<li><a href="/pubs/tuts/css/">CSS</a></li>
<li><a href="/pubs/tuts/svg/">SVG</a></li>
<li><a href="/pubs/tuts/xml/">XML</a></li>
</ul>
</li>
<li><a href="/pubs/wpapers/">White Papers</a></li>
<li><a href="/pubs/comment/">Commentary</a></li>
</ul>
</li>
<li><a href="/contact/">Contact</a></li>
</ul>
</div>
<div id="main">
<p>
</p>
</div>
</body>
</html>
[/code]
Instructions: The options in the menu are supposed to become eye-catching when
you hover over them with your mouse. The text is supposed to get bigger as if
it's coming towards you (I have no idea how to do this one) and the background
of the option is supposed to have a color that goes with the text (if anyone
could show me how to change the color of the text and background that would be
nice although I could probably work that out on my own if I mess with it a bit
but a "you change it here" and a "that's why you do it there" could possibly
help me learn this).
You also need to see that the website behind the button has been visited.
That's it, any help would be appreciated!
_________________________________________________________________
Your E-mail and More On-the-Go. Get Windows Live Hotmail Free.
https://signup.live.com/signup.aspx?id=60969
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
