Team:Groningen/style.css
From 2012.igem.org
(Difference between revisions)
Line 7: | Line 7: | ||
*/ | */ | ||
+ | <html> | ||
+ | <style type="text/css"> | ||
+ | <!-- | ||
+ | .expand-down { | ||
+ | font-family:Arial, Helvetica, sans-serif; | ||
+ | line-height:normal; | ||
+ | margin-top:20px; | ||
+ | height:150px; | ||
+ | width:500px; | ||
+ | background: url(images/macosx-style-background.png) no-repeat; | ||
+ | margin-bottom:30px; | ||
+ | } | ||
+ | .expand-down * { | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | .expand-down ul { | ||
+ | padding-top:10px; | ||
+ | margin-left:10px; | ||
+ | } | ||
+ | .expand-down ul li { | ||
+ | float:left; | ||
+ | list-style-type:none; | ||
+ | } | ||
+ | .expand-down ul li a { | ||
+ | text-decoration:none; | ||
+ | } | ||
+ | .expand-down ul li a img { | ||
+ | width:50px; | ||
+ | height:50px; | ||
+ | border:none; | ||
+ | } | ||
+ | .expand-down ul li a span { | ||
+ | display:none; | ||
+ | } | ||
+ | .expand-down ul li:hover a span { | ||
+ | display:block; | ||
+ | font-size:14px; | ||
+ | text-align:center; | ||
+ | color:#fff; | ||
+ | } | ||
+ | .expand-down ul li:hover a img { | ||
+ | width:100px; | ||
+ | height:100px; | ||
+ | } | ||
+ | .expand-down ul li:hover + li a img { | ||
+ | width:60px; | ||
+ | height:60px; | ||
+ | } | ||
+ | .expand-down ul li:hover + li + li a img { | ||
+ | width:55px; | ||
+ | height:55px; | ||
+ | } | ||
+ | |||
+ | .expand-up { | ||
+ | font-family:Arial, Helvetica, sans-serif; | ||
+ | line-height:normal; | ||
+ | height:150px; | ||
+ | width:500px; | ||
+ | background: url(images/macosx-style-background.png) no-repeat; | ||
+ | overflow:visible; | ||
+ | margin-bottom:30px; | ||
+ | } | ||
+ | .expand-up * { | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | .expand-up ul { | ||
+ | margin-left:10px; | ||
+ | } | ||
+ | .expand-up ul li { | ||
+ | float:left; | ||
+ | list-style-type:none; | ||
+ | padding-top:65px; | ||
+ | margin-top:25px; | ||
+ | } | ||
+ | .expand-up ul li a { | ||
+ | text-decoration:none; | ||
+ | } | ||
+ | .expand-up ul li a img { | ||
+ | width:50px; | ||
+ | height:50px; | ||
+ | border:none; | ||
+ | } | ||
+ | .expand-up ul li a span { | ||
+ | display:none; | ||
+ | font-size:14px; | ||
+ | text-align:center; | ||
+ | color:#fff; | ||
+ | } | ||
+ | .expand-up ul li:hover a span { | ||
+ | display:block; | ||
+ | margin-top:-65px; | ||
+ | } | ||
+ | .expand-up ul li:hover a img { | ||
+ | width:100px; | ||
+ | height:100px; | ||
+ | } | ||
+ | .expand-up ul li:hover + li a img { | ||
+ | width:60px; | ||
+ | height:60px; | ||
+ | margin-top:-10px; | ||
+ | } | ||
+ | |||
+ | --> | ||
+ | </style> | ||
+ | |||
+ | </head> | ||
+ | <body> | ||
+ | <div class="expand-down"> | ||
+ | <ul> | ||
+ | <li> | ||
+ | <a href="https://2012.igem.org/Team:Groningen" title="Home" rel="nofollow" target="_blank"> | ||
+ | <img src="https://static.igem.org/mediawiki/2012/6/61/Groningen2012_ID_20120808_Menu_Home.png" alt="Home" title="Home" /> | ||
+ | <span>Valid CSS</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2012.igem.org/Team:Groningen/Team" title="Team" rel="nofollow" target="_blank"> | ||
+ | <img src="https://static.igem.org/mediawiki/2012/f/fc/Groningen2012_ID_20120808_Menu_Team.png" alt="Team" title="TEAM" /> | ||
+ | <span>Team</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2012.igem.org/Team:Groningen/Project" title="Project" rel="nofollow" target="_blank"> | ||
+ | <img src="https://static.igem.org/mediawiki/2012/1/19/Groningen2012_ID_20120808_Menu_Project.png" alt="Project" title="Project" /> | ||
+ | <span>Project</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2012.igem.org/Team:Groningen/Parts" title="Internet Explorer" rel="Parts" target="_blank"> | ||
+ | <img src="https://static.igem.org/mediawiki/2012/0/06/Groningen2012_ID_20120808_Menu_Parts.png" alt="Parts" title="Parts" /> | ||
+ | <span>Internet Explorer</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2012.igem.org/Team:Groningen/Safety" title="Safety" rel="nofollow" target="_blank"> | ||
+ | <img src="https://static.igem.org/mediawiki/2012/d/d4/Groningen2012_ID_20120808_Menu_Safety.png" alt="Safety" title="Safety" /> | ||
+ | <span>Safety</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2012.igem.org/Team:Groningen/PublicRelations" title="Public Relation" rel="nofollow" target="_blank"> | ||
+ | <img src="https://static.igem.org/mediawiki/2012/6/6f/Groningen2012_ID_20120808_Menu_Public_Relations.png" alt="Public Relation" title="Public Relation" /> | ||
+ | <span>Public Relation</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2012.igem.org/Team:Groningen/Sponsors" title="Sponsors" rel="nofollow" target="_blank"> | ||
+ | <img src="https://static.igem.org/mediawiki/2012/d/d4/Groningen2012_ID_20120808_Menu_Sponsors.png" alt="Sponsors" title="Sponsors" /> | ||
+ | <span>Sponsors</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </body> | ||
+ | </html> | ||
Revision as of 18:23, 8 August 2012
/* Ismael-
Don't worry, the previous style.css has been moved to Team:Groningen/styletest.css. I wanted to play around with the menu elements for a bit. You're right, the menu image is too narrow. The options need to be spaced further apart. There isn't enough space in between for the little cogs.
-Jon
- /
/*Header*/
- top-section
{
height: 208px; width: 550px; border: none;
}
/*test the menubar ID_8-8-2012-16:08*/
- p-logo
{
background-image:url(); background-repeat:no-repeat;
}
.bigcog
{
background-image:url(); height: 100px; width: 100px; opacity: 40%; top: 25%; border: none; z-index: 0;
} .smallcog {
background-image:url(); height: 37px; width: 36px; opacity: 40%; top: 37.5%; border: none; z-index: 0;
}
- windmillarms
{
background-image:url(); height: 120px; width: 104px; border: none; z-index: 2;
}
/*Body*/ body {
background-attachment:fixed; background-image:url(); text-align: justify; border: none;
}
- content
{
position: relative; top:-5px; width: 1024px; padding: 0px 0px 0px 0px; background-color:transparent; border: none;
}
- bodyContent
{
width: 1024px; position: relative; padding: 0px 0px 0px 0px; background-color:transparent; border: none;
}
/*Suppress iGEM defaults*/ a[title="Main Page"]{display: none;} .firstHeading{display: none;}
- menubar{display: none;}
- search-controls{display: none;}
- contentSub{display: none;}
- catlinks{display: none;}
- footer-box{display: none;}
|}