Team:UCLondon/Templates/links-footerv2

From 2012e.igem.org

(Difference between revisions)
(Created page with "<html> <div id="footer-links"> <div id="foot-icon1"></div> <div class="vertical"> <p class="left-footer">Morph Bioinformatics</p> <ul class="ri...")
 
(61 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
 +
<div id="MBFooter">
 +
<div style="clear:both; height:1px;"></div>
<div id="footer-links">
<div id="footer-links">
       <div id="foot-icon1"></div>
       <div id="foot-icon1"></div>
Line 6: Line 8:
<p class="left-footer">Morph Bioinformatics</p>
<p class="left-footer">Morph Bioinformatics</p>
<ul class="right-footer">
<ul class="right-footer">
-
<li><a href="#">Home</a></li>
+
<li><a href="http://dl.dropbox.com/u/3703109/igeme/home.html">Home</a></li>
-
<li><a href="#">Downloads</a></li>
+
<li><a href="http://dl.dropbox.com/u/3703109/igeme/downloads.html">Downloads</a></li>
-
<li><a href="#">News</a></li>
+
<li><a href="http://dl.dropbox.com/u/3703109/igeme/news.html">News</a></li>
-
<li><a href="#">Job Opportunities</a></li>
+
<li><a href="http://dl.dropbox.com/u/3703109/igeme/jobs.html">Job Opportunities</a></li>
-
<li><a href="#">Contact Us</a></li>
+
<li><a href="http://dl.dropbox.com/u/3703109/igeme/contact.html">Contact Us</a></li>
                                                 <li><a href="#">MediaWiki</a><ul class='mediawiki-footer'><li>item1</li></ul></li>
                                                 <li><a href="#">MediaWiki</a><ul class='mediawiki-footer'><li>item1</li></ul></li>
</ul>
</ul>
                   </div>
                   </div>
         <div id="foot-icon2"></div>
         <div id="foot-icon2"></div>
 +
</div>
</div>
</div>
<style type="text/css">
<style type="text/css">
 +
 +
        #MBFooter { background: url(http://db.tt/cPPm1hVY) repeat-x; width:100%; margin:auto; height:100px; position:relative;  bottom:-40px; left:0; }
 +
 +
      #MBFooter:before { content:""; display:block; width:100%; height:3px;
 +
 +
          background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from( rgba(255, 255, 255, 0.7) ), to( rgb(0, 0, 0) ) );
 +
          background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.7), rgb(0, 0, 0) );
 +
          background-image: -moz-linear-gradient(top,  rgba(255, 255, 255, 0.7), rgb(0, 0, 0) );
 +
          background-image: -ms-linear-gradient(top,  rgba(255, 255, 255, 0.7), rgb(0, 0, 0) );
 +
          background-image: -o-linear-gradient(top,  rgba(255, 255, 255, 0.7), rgb(0, 0, 0) );
 +
          background-image: linear-gradient(top,  rgba(255, 255, 255, 0.7), rgb(0, 0, 0) );
 +
 +
        box-shadow: 1px #888;
 +
     
 +
        }
         #foot-icon1 { float: left; }
         #foot-icon1 { float: left; }
         #foot-icon2 { float: left; }
         #foot-icon2 { float: left; }
-
#footer-links * {  
+
#footer-links * {
-
padding:0;
+
-
margin: 0;
+
list-style-type:none;
list-style-type:none;
 +
                color: rgb(250, 250, 250);
     }
     }
Line 33: Line 50:
text-decoration: none;  
text-decoration: none;  
}
}
-
+
 
-
#footer-links ul li ul {
+
    #footer-links div li ul {  
-
border: solid 1px #b4b4b4;
+
                display: none;
 +
                background-color:white;
 +
                width: 140px;
 +
                border: solid 1px #b4b4b4;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
-
background: white;
+
                z-index: 10;
-
}
+
                color:black;
 +
  }
 +
 
 +
    #footer-links div li:hover > ul { display: block; position:absolute; bottom:50%;  }
 +
 +
    #footer-links div li ul li { color:black; width:140px; padding:0 !important; border:0 !important;  }
 +
    #footer-links div li ul li a { color:black; width:140px;  }
 +
    #footer-links div li ul li:hover { background-color:rgb(56, 90, 79); }
 +
    #footer-links div li ul li:hover > a { color:white;}
-
#footer-links ul li ul li a {
 
-
padding-top:3px;
 
-
padding-bottom:3px;
 
-
}
 
-
#footer-links ul li {
 
-
float: left;
 
-
}
 
-
#footer-links ul li a {
 
-
//font-weight: bold;
 
-
padding: 15px 10px;
 
-
}
 
-
#footer-links li{
 
-
position:relative;
 
-
float:left;
 
-
}
 
-
#footer-links ul li ul, #footer-links:hover ul li ul, #footer-links:hover ul li:hover ul li ul{
 
-
display:none;
 
-
list-style-type:none;
 
-
width: 140px;
 
-
}
 
-
#footer-links:hover ul, #footer-links:hover ul li:hover ul, #footer-links:hover ul li:hover ul li:hover ul {
 
-
display:block;
 
-
}
 
-
#footer-links:hover ul li:hover ul li:hover ul {
 
-
position: absolute;
 
-
margin-left: 145px;
 
-
margin-top: -22px;
 
-
//font: 10px;
 
-
}
 
-
#footer-links:hover ul li:hover ul {
 
-
position: absolute;
 
-
margin-top: 1px;
 
-
//font: 10px;
 
-
bottom:100%;
 
-
}
 
-
 
#footer-links .left-footer {
#footer-links .left-footer {
Line 86: Line 78:
list-style: none;
list-style: none;
float:left;
float:left;
 +
                margin-right: 10px;
 +
                padding-top:2px;
}
}
Line 98: Line 92:
#footer-links .right-footer li:last-child {
#footer-links .right-footer li:last-child {
border:none;
border:none;
-
padding-right: none;
+
padding-right: none !important;
}
}
Line 104: Line 98:
-
       #footer-links { width:90%; margin-left:auto; margin-right:auto; bottom:5px;}
+
       #footer-links { width:761px; margin-left:auto; margin-right:auto; padding-top:40px; }
-
      // .vertical { display:table-cell; vertical-align:centre; }
+
</style>
</style>

Latest revision as of 01:02, 9 January 2013