Menu
There are only 2 files, their contents are displayed below. If someone can provide a Standards Compliant solution then I’d be grateful.
I’m not in a rush so take your time, I’ll put the sitemap in ajax later hence the noscript list.
[code]
@media screen
{
html, html *
{
margin: 0px;
outline: none;
padding: 0px
}
ul
{
padding: 5px;
padding-left: 20px
}
a, label, input, button
{
border-width: thin;
display: inline-block;
font-size: medium
}
html
{
overflow: auto
}
body
{
position: relative
}
/* Navigation */
/* – Default as List */
#n
{
position: absolute;
top: 0px;
left: 0px
}
/* – Not IE6 or below */
#nav > #n { position: static }
#n > ul
{
display: block;
font-size: 2pt;
text-align: justify
}
#n > ul *
{
font-size: medium
}
#n > ul a
{
text-decoration: none
}
#n > ul > li
{
position: relative;
display: inline-block;
list-style: none;
white-space: nowrap
}
#n > ul > li.last
{
font-size: 2pt;
width: 100%
}
#ie7 #n > ul > li
{
/* Workaround */
display: inline
}
#ie7 #n > ul
{
}
#n > ul ul
{
background: #fff;
border: #000 solid thin;
border-radius: 5px;
display: none;
position: absolute;
top: 5px;
left: 90%
}
#n > ul > li > ul
{
top: 90%;
left: 5px
}
#n > ul li:hover > ul
{
display: block
}
#search > form { display: inline-block }
}
[code]
<!DOCTYPE html>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”content-type” content=”text/html; charset=UTF-8″ />
<title>HackerEX</title>
<link href=”inc/main.css” type=”text/css” rel=”Stylesheet” />
</head>
<!–[if IE 7]>
<body id=”ie7″>
<![endif]–>
<!–[if !IE]> –>
<body>
<!– <![endif]–>
<nav>
<div id=”nav”>
<div id=”n”>
<ul>
<li>
<a href=”index.htm”>HackerEX</a>
<ul>
<li><a href=”hackerex/sony.htm”>Sony</a>
<ul>
<li><a href=”hackerex/sony/ps1.htm”>PS1</a> </li>
<li><a href=”hackerex/sony/ps2.htm”>PS2</a> </li>
</ul>
</li>
</ul>
</li>
<li id=”search”>
<form action=”search.htm” method=”get”>
<label for=”q”>Search for: </label>
<input id=”q” name=”q” type=”search” placeholder=”Search Terms…” />
<button type=”submit”>Find</button>
</form>
</li>
<li class=”last”> </li>
</ul>
</div>
</div>
</nav>
<div id=”b”>
<noscript>
<p>Please enable Javascript.</p>
<ul>
<li><a href=”sitemap.htm”>Sitemap</a></li>
<li><a href=”sony/links.htm”>Sony Links</a></li>
</ul>
</noscript>
</div>
</body>
</html>