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; }
+
<!--
-
 
+
-
#cssm1 *  { padding:0; margin: 0; font: 1em arial; }
+
#navbar ul {  
-
 
+
margin: 0;  
-
#cssm1 { margin: 0 auto; float: left; line-height: 20px; }
+
padding: 5px;  
-
 
+
list-style-type: none;  
-
#cssm1 a { display: block; border: 1px solid #fff; background: #abc; text-decoration: none; padding: 3px 10px; }
+
text-align: center;  
-
#cssm1 a:hover { background: #789; }
+
background-color: #000;  
-
 
+
        line-height:30px
-
 
+
}  
-
#cssm1 ul li, #cssm1 ul li ul li { width: 120px; list-style-type:none; }
+
-
 
+
#navbar ul li, #navbar ul li ul li {
-
#cssm1 ul li { float: left; width: 120px; }
+
display: absolute;  
-
 
+
}  
-
#cssm1 ul li ul, #cssm1:hover ul li ul, #cssm1:hover ul li:hover ul li ul{  
+
 +
#navbar ul li a {  
 +
text-decoration: none;  
 +
padding: .2em 1em;
 +
color: #fff;  
 +
background-color: #000;
 +
}
 +
#navbar ul li ul, #navbar:hover ul li ul, #navbar:hover ul li:hover ul li ul{  
display:none;
display:none;
list-style-type:none;  
list-style-type:none;  
-
width: 120px;
+
        width: 120px;
 +
}
}
-
 
+
#navbar ul li a:hover {
-
#cssm1:hover ul, #cssm1:hover ul li:hover ul, #cssm1:hover ul li:hover ul li:hover ul {  
+
color: #000;
 +
background-color: #fff;
 +
}
 +
#navbar:hover ul, #navbar:hover ul li:hover ul, #navbar:hover ul li:hover ul li:hover ul {  
display:block;  
display:block;  
}
}
-
 
+
#navbar:hover ul li:hover ul li:hover ul {  
-
#cssm1:hover ul li:hover ul li:hover ul {  
+
position: center;
-
position: absolute;
+
margin-left: 120px;
margin-left: 120px;
margin-top: -20px;
margin-top: -20px;
}
}
-
 
+
-->
-
 
+
</style>  
-
 
+
-
 
+
-
</style>
+
</head>  
</head>  
<body>  
<body>  
-
<div id="cssm1">  
+
<div id="navbar">  
   <ul>  
   <ul>  
<li><a href="/Team:MSOE_Milwaukee">Home</a></li>  
<li><a href="/Team:MSOE_Milwaukee">Home</a></li>  

Revision as of 19:16, 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)

File:MSOE Milwaukee team.png
Your team picture
Team MSOE_Milwaukee


Retrieved from "http://2013.igem.org/Team:MSOE_Milwaukee"