Template:INSALyon2010 menu Test

From 2010.igem.org

(Difference between revisions)
m
 
(34 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
 +
<style type="text/css">
<style type="text/css">
 +
#info {height:0px;margin-left: 0.1%;margin-right: 0%;}
 +
/* ================================================================
 +
This copyright notice must be untouched at all times.
-
/* begin Menu */
+
The original version of this stylesheet and the associated (x)html
-
/* menu structure */
+
is available at http://www.cssplay.co.uk/menus/drop_definition3.html
 +
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
 +
This stylesheet and the assocaited (x)html may be modified in any
 +
way to fit your requirements.
 +
=================================================================== */
 +
#menu {list-style-type:none; margin:0px auto 0px auto; padding:0; width:965px;list-style: none;}
 +
#menu li {float:left; padding:0; margin:0 1px 0 0; position:relative; width:106.2px; margin-top:-0.3cm; height:3em; z-index:100;}
 +
#menu li dl {position:absolute; top:0; left:0; padding-bottom:0;}
 +
#menu li a, #menu li a:visited {text-decoration:none;}
 +
#menu li dd {display:none;}
 +
#menu li a:hover {border:0;}
 +
#menu li:hover dd, #menu li a:hover dd {display:block;}
 +
#menu li:hover dl, #menu li a:hover dl {padding-bottom:10px;}
 +
#menu table {border-collapse:collapse; padding:0; margin:-1px; font-size:1em;}
 +
#menu dl {width: 106.2px; margin: 0; padding: 0; background: transparent;}
 +
#menu dt {margin:0; padding: 0;border:0px;}
-
.art-menu a, .art-menu a:link, .art-menu a:visited, .art-menu a:hover
+
#menu dd {margin:0; padding:0; color: #000000; font-size: 0.91em; text-align:left;}
-
{
+
-
  text-align: left;
+
-
  text-decoration: none;
+
-
  outline: none;
+
-
  letter-spacing: normal;
+
-
  word-spacing: normal;
+
-
}
+
-
.art-menu, .art-menu ul
+
#menu dt a, #menu dt a:visited {display:block; font-size: 12px; color: #000000; text-align:center; border-width:0 1px 1px 1px; background:#cee0c8; padding:0.25em 0 0.2em 0;}
-
{
+
-
  margin: 0;
+
-
  padding: 0;
+
-
  border: 0;
+
-
  list-style-type: none;
+
-
  display: block;
+
-
}
+
-
.art-menu li
+
#menu li:hover dt a, #menu a:hover dt a {color:#000000; background:#99bf8b; }
-
{
+
-
  margin: 0;
+
-
  padding: 0;
+
-
  border: 0;
+
-
  display: block;
+
-
  float: left;
+
-
  position: relative;
+
-
  z-index: 5;
+
-
  background: none;
+
-
}
+
-
.art-menu li:hover
+
#menu dd a, #menu dd a:visited {background:#cee0c8; color:#000000; padding:0.3em 0; text-decoration:none; display:block; text-align:center;}
-
{
+
-
  z-index: 10000;
+
-
  white-space: normal;
+
-
}
+
-
.art-menu li li
+
#menu dd a:hover {background:#99bf8b; color:#000000;}
-
{
+
-
  float: none;
+
-
}
+
-
.art-menu ul
+
#menu b {display:block; overflow:hidden; height:1px;}
-
{
+
-
  visibility: hidden;
+
-
  position: absolute;
+
-
  z-index: 10;
+
-
  left: 0;
+
-
  top: 0;
+
-
  background: none;
+
-
}
+
-
.art-menu li:hover>ul
+
#menu b.p5 {background:#cee0c8; margin:0 5px; border:0px; border-width:0 0px;}
-
{
+
#menu b.p6 {background:#cee0c8; margin:0 3px; border:0px; border-width:0 0px;}
-
  visibility: visible;
+
#menu b.p7 {background:#cee0c8; margin:0 2px; border:0px; border-width:0 0px;}
-
  top: 100%;
+
#menu b.p8 {height:2px; background:#cee0c8; margin:0 1px; border-width:0 0px;}
-
}
+
-
.art-menu li li:hover>ul
+
#menu li:hover b.p2, #menu a:hover b.p2 {background:#776bd6;}
-
{
+
#menu li:hover b.p3, #menu a:hover b.p3 {background:#776bd6;}
-
  top: 0;
+
#menu li:hover b.p4, #menu a:hover b.p4 {background:#776bd6;}
-
  left: 100%;
+
</style>
-
}
+
-
.art-menu:after, .art-menu ul:after
 
-
{
 
-
  content: ".";
 
-
  height: 0;
 
-
  display: block;
 
-
  visibility: hidden;
 
-
  overflow: hidden;
 
-
  clear: both;
 
-
}
 
-
.art-menu, .art-menu ul
 
-
{
 
-
  min-height: 0;
 
-
}
 
-
.art-menu ul
 
-
{
 
-
  background-image: url(https://static.igem.org/mediawiki/2010/5/52/INSA-Lyon_Spacer.gif);
 
-
  padding: 10px 30px 30px 30px;
 
-
  margin: -10px 0 0 -30px;
 
-
}
 
-
.art-menu ul ul
+
<div id="info">
-
{
+
-
  padding: 30px 30px 30px 10px;
+
-
  margin: -30px 0 0 -10px;
+
-
}
+
 +
<ul id="menu">
 +
<li>
 +
<!--[if lte IE 6]><a href="#nogo"><table><tr><td><![endif]-->
 +
<dl>
 +
<dt><a href="/Team:INSA-Lyon">Home</a></dt>
 +
</dl>
 +
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
 +
</li>
 +
<li>
 +
<!--[if lte IE 6]><a href="#nogo"><table><tr><td><![endif]-->
 +
<dl>
 +
<dt><a href="/Team:INSA-Lyon/Team">About us</a></dt>
 +
<dd><a href="/Team:INSA-Lyon/Team/Students">Students</a></dd>
 +
<dd><a href="/Team:INSA-Lyon/Team/Advisors">Advisors</a></dd>
 +
<dd><a href="/Team:INSA-Lyon/Team/Insa">The INSA</a></dd>
 +
<dd><a href="/Team:INSA-Lyon/Team/Lyon">Discover Lyon</a><b class="p8"></b><b class="p7"></b><b class="p6"></b><b class="p5"></b></dd>
 +
</dl>
 +
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
 +
</li>
 +
<li>
 +
<!--[if lte IE 6]><a href="#nogo"><table><tr><td><![endif]-->
 +
<dl>
 +
<dt><a href="/Team:INSA-Lyon/Project">Droppy Project</a></dt>
 +
<dd><a href="../layouts/body5.html"> </a></dd>
 +
<dd><a href="../layouts/minimum.html"> </a><b class="p8"></b><b class="p7"></b><b class="p6"></b><b class="p5"></b></dd>
 +
</dl>
-
/* menu structure */
+
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
 +
</li>
 +
<li>
 +
<!--[if lte IE 6]><a href="#nogo"><table><tr><td><![endif]-->
 +
<dl>
 +
<dt><a href="/Team:INSA-Lyon/Safety">Human Practice</a></dt>
 +
<dd><a href="../mozilla/dropdown.html"> </a></dd>
 +
<dd><a href="../mozilla/target.html"> </a><b class="p8"></b><b class="p7"></b><b class="p6"></b><b class="p5"></b></dd>
 +
</dl>
-
.art-menu
+
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
-
{
+
</li>
-
  padding: 6px 3px 0 2px;
+
<li>
-
}
+
<!--[if lte IE 6]><a href="#nogo"><table><tr><td><![endif]-->
 +
<dl>
 +
<dt><a href="/Team:INSA-Lyon/Modeling">Modeling</a></dt>
 +
<dd><a href="../mozilla/dropdown.html"> </a></dd>
 +
<dd><a href="../mozilla/target.html"> </a><b class="p8"></b><b class="p7"></b><b class="p6"></b><b class="p5"></b></dd>
 +
</dl>
-
.art-nav
+
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
-
{
+
</li>
-
  position: relative;
+
<li>
-
  height: 30px;
+
<!--[if lte IE 6]><a href="#nogo"><table><tr><td><![endif]-->
-
  z-index: 100;
+
<dl>
-
}
+
<dt><a href='#'>Notebook</a></dt>
 +
<dd><a href="/Team:INSA-Lyon/Notebook/Calendar">Calendar</a></dd>
 +
<dd><a href="/Team:INSA-Lyon/Notebook/Protocols">Protocols</a><b class="p8"></b><b class="p7"></b><b class="p6"></b><b class="p5"></b></dd>
 +
</dl>
-
.art-nav .l, .art-nav .r
+
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
-
{
+
</li>
-
  position: absolute;
+
<li>
-
  z-index: -1;
+
<!--[if lte IE 6]><a href="#nogo"><table><tr><td><![endif]-->
-
  top: 0;
+
<dl>
-
  height: 30px;
+
<dt><a href="/Team:INSA-Lyon/Parts">The Parts</a></dt>
-
  background: url('https://static.igem.org/mediawiki/2010/d/d0/INSA-Lyon_Nav.png');
+
<dd><a href="../mozilla/dropdown.html"> </a></dd>
-
}
+
<dd><a href="../mozilla/target.html"> </a><b class="p8"></b><b class="p7"></b><b class="p6"></b><b class="p5"></b></dd>
 +
</dl>
-
.art-nav .l
+
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
-
{
+
</li>
-
  left: 5px;
+
-
  right: 5px;
+
-
}
+
-
.art-nav .r
+
<li>
-
{
+
<!--[if lte IE 6]><a href="#nogo"><table><tr><td><![endif]-->
 +
<dl>
 +
<dt><a href="/Team:INSA-Lyon/Sponsors">Sponsors</a></dt>
 +
<dd><a href="../mozilla/dropdown.html"> </a></dd>
 +
<dd><a href="../mozilla/target.html"> </a><b class="p8"></b><b class="p7"></b><b class="p6"></b><b class="p5"></b></dd>
 +
</dl>
 +
</li>
-
  width: 890px;
+
<li>
-
  clip: rect(auto, auto, auto, 890px);
+
<dl>
-
}
+
<dt><a href="/Team:INSA-Lyon/Contact">Contact Us</a></dt>
 +
 +
</dl>
 +
</li>
 +
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
 +
</ul>
-
/* end Menu */
+
</div> <!-- end of info -->
-
 
-
 
-
/* begin MenuItem */
 
-
.art-menu a
 
-
{
 
-
  text-align: justify;
 
-
  position: relative;
 
-
  display: block;
 
-
  overflow: hidden;
 
-
  height: 24px;
 
-
  text-decoration: none;
 
-
}
 
-
 
-
.art-menu li
 
-
{
 
-
  text-align: justify;
 
-
  margin-right: 2px;
 
-
  margin-left: 2px;
 
-
}
 
-
 
-
.art-menu ul li
 
-
{
 
-
    text-align: justify;
 
-
    margin:0;
 
-
    clear: both;
 
-
}
 
-
 
-
 
-
.art-menu a .r, .art-menu a .l
 
-
{
 
-
  text-align: justify;
 
-
  position: absolute;
 
-
  display: block;
 
-
  top: 0;
 
-
  z-index: -1;
 
-
  height: 72px;
 
-
  background-image: url('https://static.igem.org/mediawiki/2010/b/bc/INSA-Lyon_Menuitem.png');
 
-
}
 
-
 
-
.art-menu a .l
 
-
{
 
-
  left: 0;
 
-
  right: 6px;
 
-
}
 
-
 
-
.art-menu a .r
 
-
{
 
-
  width: 412px;
 
-
  right: 0;
 
-
  clip: rect(auto, auto, auto, 406px);
 
-
}
 
-
 
-
.art-menu a .t
 
-
{
 
-
  margin-right: 10px;
 
-
  margin-left: 10px;
 
-
  font-weight: bold;
 
-
  font-size: 12px;
 
-
  text-transform: uppercase;
 
-
  color: #162414;
 
-
  padding: 0 7px;
 
-
  margin: 0 6px;
 
-
  line-height: 24px;
 
-
  text-align: center;
 
-
}
 
-
 
-
.art-menu a:hover .l, .art-menu a:hover .r
 
-
{
 
-
  top: -24px;
 
-
}
 
-
 
-
.art-menu li:hover>a .l, .art-menu li:hover>a .r
 
-
{
 
-
  top: -24px;
 
-
}
 
-
 
-
.art-menu li:hover a .l, .art-menu li:hover a .r
 
-
{
 
-
  top: -24px;
 
-
}
 
-
.art-menu a:hover .t
 
-
{
 
-
  color: #F0F6EE;
 
-
}
 
-
 
-
.art-menu li:hover a .t
 
-
{
 
-
  color: #F0F6EE;
 
-
}
 
-
 
-
.art-menu li:hover>a .t
 
-
{
 
-
  color: #F0F6EE;
 
-
}
 
-
 
-
 
-
.art-menu a.active .l, .art-menu a.active .r
 
-
{
 
-
  top: -48px;
 
-
}
 
-
 
-
.art-menu a.active .t
 
-
{
 
-
  color: #000000;
 
-
}
 
-
/* end MenuItem */
 
-
 
-
 
-
 
-
 
-
/* begin MenuSubItem */
 
-
.art-menu ul a
 
-
{
 
-
  display: block;
 
-
  text-align: center;
 
-
  white-space: nowrap;
 
-
  height: 20px;
 
-
  width: 180px;
 
-
  overflow: hidden;
 
-
  line-height: 20px;
 
-
  background-image: url('https://static.igem.org/mediawiki/2010/e/ef/INSA-Lyon_Subitem.png');
 
-
  background-position: left top;
 
-
  background-repeat: repeat-x;
 
-
  border-width: 0;
 
-
  border-style: solid;
 
-
}
 
-
 
-
.art-nav ul.art-menu ul span, .art-nav ul.art-menu ul span span
 
-
{
 
-
  display: inline;
 
-
  float: none;
 
-
  margin: inherit;
 
-
  padding: inherit;
 
-
  background-image: none;
 
-
  text-align: inherit;
 
-
  text-decoration: inherit;
 
-
}
 
-
 
-
.art-menu ul a, .art-menu ul a:link, .art-menu ul a:visited, .art-menu ul a:hover, .art-menu ul a:active, .art-nav ul.art-menu ul span, .art-nav ul.art-menu ul span span
 
-
{
 
-
  text-align: left;
 
-
  text-indent: 12px;
 
-
  text-decoration: none;
 
-
  line-height: 20px;
 
-
  color: #314E2D;
 
-
  margin-right: 10px;
 
-
  margin-left: 22px;
 
-
  margin:0;
 
-
  padding:0;
 
-
}
 
-
 
-
.art-menu ul li a:hover
 
-
{
 
-
  color: #000000;
 
-
  background-position: 0 -20px;
 
-
}
 
-
 
-
.art-menu ul li:hover>a
 
-
{
 
-
  color: #000000;
 
-
  background-position: 0 -20px;
 
-
}
 
-
 
-
.art-nav .art-menu ul li a:hover span, .art-nav .art-menu ul li a:hover span span
 
-
{
 
-
  color: #000000;
 
-
}
 
-
 
-
.art-nav .art-menu ul li:hover>a span, .art-nav .art-menu ul li:hover>a span span
 
-
{
 
-
  color: #000000;
 
-
}
 
-
 
-
 
-
/* end MenuSubItem */
 
-
 
-
 
-
</style>
 
</html>
</html>

Latest revision as of 08:40, 18 August 2010