Difference between revisions of "Template:UNC-Chapel Hill"

Line 18: Line 18:
 
/* Creates a container that will wrap all of the content inside your wiki pages. */
 
/* Creates a container that will wrap all of the content inside your wiki pages. */
 
#mainContainer {   
 
#mainContainer {   
width: 1280px;
+
width: 100%;
 
overflow:hidden;
 
overflow:hidden;
 
float:left;
 
float:left;
Line 39: Line 39:
 
background-color: #E8E8E9;
 
background-color: #E8E8E9;
 
}
 
}
 +
 +
drop_menu {
 +
background:#005555;
 +
padding:0;
 +
margin:0;
 +
list-style-type:none;
 +
height:30px;
 +
}
 +
 +
.drop_menu li { float:left; }
 +
.drop_menu li a {
 +
padding:9px 20px;
 +
display:block;
 +
color:#fff;
 +
text-decoration:none;
 +
font:12px arial, verdana, sans-serif;
 +
}
 +
 +
/* Submenu */
 +
.drop_menu ul {
 +
position:absolute;
 +
left:-9999px;
 +
top:-9999px;
 +
list-style-type:none;
 +
}
 +
.drop_menu li:hover { position:relative; background:#5FD367; }
 +
.drop_menu li:hover ul {
 +
left:0px;
 +
top:30px;
 +
background:#5FD367;
 +
padding:0px;
 +
}
 +
 +
.drop_menu li:hover ul li a {
 +
padding:5px;
 +
display:block;
 +
width:168px;
 +
text-indent:15px;
 +
background-color:#5FD367;
 +
}
 +
.drop_menu li:hover ul li a:hover { background:#005555; }
 +
  
 
/* Creates the container for the content */
 
/* Creates the container for the content */
Line 45: Line 87:
 
padding-right:10px;
 
padding-right:10px;
 
margin-bottom: 20px;
 
margin-bottom: 20px;
width: 1280px;
+
width: 100%px;
 
padding-left: 20px;
 
padding-left: 20px;
 
float: left;
 
float: left;
Line 213: Line 255:
  
 
<!-- Start of the template html elements. -->
 
<!-- Start of the template html elements. -->
<div class = "header"> </div>  
+
<div class = "header">  
 +
 
 +
<div class="drop">
 +
<ul class="drop_menu">
 +
<a href="https://2015.igem.org/Team:UNC-Chapel_Hill"><li>HOME</li></a>
 +
 
 +
<li><a href='#'>Link 2</a>
 +
<ul>
 +
<li><a href='#'>Sub Link 1</a></li>
 +
<li><a href='#'>Sub Link 2</a></li>
 +
<li><a href='#'>Sub Link 3</a></li>
 +
<li><a href='#'>Sub Link 4</a></li>
 +
</ul>
 +
</li>
 +
<li><a href='#'>Link 3</a>
 +
<ul>
 +
<li><a href='#'>Sub Link 1</a></li>
 +
<li><a href='#'>Sub Link 2</a></li>
 +
<li><a href='#'>Sub Link 3</a></li>
 +
<li><a href='#'>Sub Link 4</a></li>
 +
</ul>
 +
</li>
 +
</ul>
 +
</div>
 +
<div id="menuContainer">
 +
</div>  
 +
 
 
<div id ="mainContainer"><!--The closing tag for mainContainer should be placed at the bottom of each content page.-->
 
<div id ="mainContainer"><!--The closing tag for mainContainer should be placed at the bottom of each content page.-->
  
Line 227: Line 295:
 
<!-- Start of menu -->
 
<!-- Start of menu -->
  
<div id="menuContainer">
 
  
 
<!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons -->
 
<!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons -->

Revision as of 22:52, 5 June 2015