Team:Groningen/Template/CSS/cleanup
From 2014.igem.org
Andries1990 (Talk | contribs) |
|||
(12 intermediate revisions not shown) | |||
Line 3: | Line 3: | ||
/*First, we'll have to work a bit on the standard stuff iGEM gives us.*/ | /*First, we'll have to work a bit on the standard stuff iGEM gives us.*/ | ||
- | body{ | + | #content, body{ |
- | + | ||
text-align: justify; | text-align: justify; | ||
background-color: #000000; | background-color: #000000; | ||
width:100%; | width:100%; | ||
height:100%; | height:100%; | ||
- | padding: | + | padding:0; |
- | margin: | + | margin:0; |
+ | line-height:0; | ||
} | } | ||
- | #p-logo, #search-controls, #footer, .firstHeading, #siteSub, .printfooter | + | #p-logo, #search-controls, #footer, .firstHeading, #siteSub, .printfooter, #catlinks |
{ | { | ||
+ | position:absolute; | ||
visibility:hidden; | visibility:hidden; | ||
+ | display: none; | ||
+ | height:0; | ||
+ | line-height:0; | ||
+ | overflow: hidden; | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | top:0px; | ||
+ | left:0px; | ||
} | } | ||
Line 30: | Line 39: | ||
/*Everything related to the menubar. The menubar is one of the things that's in the coding we can't change, and we HAVE to keep it (so we can't just make it invisible and ignore it). Note that there are two elements with the id menubar, and that they are divided into two classes, namely left-menu and right-menu. We made and extra box called topmenubarbackground so that we can have a background for the menu that is 100% the wide of the screen. But we will set the style for that element later in the site, because it's inside the element where we programmed our own stuff.*/ | /*Everything related to the menubar. The menubar is one of the things that's in the coding we can't change, and we HAVE to keep it (so we can't just make it invisible and ignore it). Note that there are two elements with the id menubar, and that they are divided into two classes, namely left-menu and right-menu. We made and extra box called topmenubarbackground so that we can have a background for the menu that is 100% the wide of the screen. But we will set the style for that element later in the site, because it's inside the element where we programmed our own stuff.*/ | ||
#menubar ul{ | #menubar ul{ | ||
- | z-index: | + | z-index:9999; |
width:510px; | width:510px; | ||
height:12px; | height:12px; | ||
Line 60: | Line 69: | ||
font:10px arial,sans-serif; | font:10px arial,sans-serif; | ||
text-decoration: none; | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | .firstHeading { | ||
+ | height: 11pt; | ||
+ | } | ||
+ | |||
+ | .top-section { | ||
+ | position:absolute; | ||
+ | } | ||
+ | |||
+ | #contentSub{ | ||
+ | display:none; | ||
+ | visibility:hidden; | ||
+ | position:absolute; | ||
+ | width:0; | ||
+ | height:0; | ||
} | } | ||
</html> | </html> |
Latest revision as of 03:01, 18 October 2014
/*The text below will make some of the annoying standard elements invisible, like the mega iGEM logo, the search box and the footer about wikimedia. Because our custom divs #scrollablebontent and #noscroll (in which we code our entire site) are embedded inside #globalwrapper (that we just made invisible) we have to make the custom div visible again. The same counts for the #menubar, that is one of the elements that MUST stay on the page.*/ /*First, we'll have to work a bit on the standard stuff iGEM gives us.*/ #content, body{ text-align: justify; background-color: #000000; width:100%; height:100%; padding:0; margin:0; line-height:0; } #p-logo, #search-controls, #footer, .firstHeading, #siteSub, .printfooter, #catlinks { position:absolute; visibility:hidden; display: none; height:0; line-height:0; overflow: hidden; margin:0; padding:0; top:0px; left:0px; } #globalWrapper, #content, #bodyContent{ position:absolute; top:0px; left:0px; padding:0px; margin:0px; width:100%; height:100%; } /*Everything related to the menubar. The menubar is one of the things that's in the coding we can't change, and we HAVE to keep it (so we can't just make it invisible and ignore it). Note that there are two elements with the id menubar, and that they are divided into two classes, namely left-menu and right-menu. We made and extra box called topmenubarbackground so that we can have a background for the menu that is 100% the wide of the screen. But we will set the style for that element later in the site, because it's inside the element where we programmed our own stuff.*/ #menubar ul{ z-index:9999; width:510px; height:12px; position:absolute; top:-15px; left:50%; padding: 0px; list-style-type: none; } .left-menu ul{ margin-left:-510px; } .left-menu li{ float:left; margin-right:10px; display:inline; color:#ffffff; font:10px arial,sans-serif; } .right-menu li{ float:right; margin-left:10px; display: inline; color:#ffffff; font:10px arial,sans-serif; } #menubar a{ color:#ffffff; font:10px arial,sans-serif; text-decoration: none; } .firstHeading { height: 11pt; } .top-section { position:absolute; } #contentSub{ display:none; visibility:hidden; position:absolute; width:0; height:0; }