Team:MSOE Milwaukee

From 2013.igem.org

(Difference between revisions)
Line 2: Line 2:
<head>  
<head>  
<title>Horizontal Navigation Bar w/Rollover Effect</title>  
<title>Horizontal Navigation Bar w/Rollover Effect</title>  
-
<style type="text/css">  
+
<style type="text/css">
-
<!--
+
body { padding: 3em; }
-
+
 
-
#navbar ul {  
+
#cssm1 *  { padding:0; margin: 0; font: 1em arial; }
-
margin: 0;  
+
 
-
padding: 5px;  
+
#cssm1 { margin: 0 auto; float: left; line-height: 20px; }
-
list-style-type: none;  
+
 
-
text-align: center;  
+
#cssm1 a { display: block; border: 1px solid #fff; background: #abc; text-decoration: none; padding: 3px 10px; }
-
background-color: #000;  
+
#cssm1 a:hover { background: #789; }
-
}  
+
 
-
+
 
-
#navbar ul li {  
+
#cssm1 ul li, #cssm1 ul li ul li  { width: 120px; list-style-type:none; }
-
display: inline;  
+
 
-
}  
+
#cssm1 ul li { float: left; width: 120px; }
-
+
 
-
#navbar ul li a {  
+
#cssm1 ul li ul, #cssm1:hover ul li ul, #cssm1:hover ul li:hover ul li ul{  
-
text-decoration: none;  
+
display:none;
-
padding: .2em 1em;  
+
list-style-type:none;  
-
color: #fff;  
+
width: 120px;
-
background-color: #000;  
+
}
-
}  
+
 
-
+
#cssm1:hover ul, #cssm1:hover ul li:hover ul, #cssm1:hover ul li:hover ul li:hover ul {
-
#navbar ul li a:hover {  
+
display:block;  
-
color: #000;  
+
}
-
background-color: #fff;  
+
 
-
}  
+
#cssm1:hover ul li:hover ul li:hover ul {  
-
+
position: absolute;
-
-->
+
margin-left: 120px;
-
</style>  
+
margin-top: -20px;
 +
}
 +
 
 +
 
 +
 
 +
 
 +
</style>
</head>  
</head>  
<body>  
<body>  
-
<div id="navbar">  
+
<div id="cssm1">  
   <ul>  
   <ul>  
<li><a href="/Team:MSOE_Milwaukee">Home</a></li>  
<li><a href="/Team:MSOE_Milwaukee">Home</a></li>  

Revision as of 18:46, 4 June 2013

Horizontal Navigation Bar w/Rollover Effect


MSOE logo
This is where the background goes

Tell us more about your project. Give us background. Use this as the abstract of your project. Be descriptive but concise (1-2 paragraphs)

Team MSOE_Milwaukee