Template:Caltech Menubar
From 2012.igem.org
(Difference between revisions)
m (removed <head> tags) |
|||
(102 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
- | |||
<!-- This is a comment in html --> | <!-- This is a comment in html --> | ||
Line 8: | Line 7: | ||
/* This is a comment in css */ | /* This is a comment in css */ | ||
+ | /* Took tips from https://2011.igem.org/Team:DTU-Denmark/How_to_customize_an_iGEM_wiki */ | ||
/* Remove unwanted wiki formatting */ | /* Remove unwanted wiki formatting */ | ||
/****************************/ | /****************************/ | ||
Line 14: | Line 14: | ||
#top-section { | #top-section { | ||
- | background-image:url('https://static.igem.org/mediawiki/2012/ | + | background-image:url('https://static.igem.org/mediawiki/2012/c/c5/Caltech2012Banner.gif'); |
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-position: center top; | background-position: center top; | ||
- | height: | + | height:100px ! important; |
} | } | ||
- | #bodyContent { padding: 10px auto; width: 910px; margin: auto; clear: none; color:black} | + | #bodyContent { padding: 10px auto; width: 910px; margin: auto; clear: none; color:black; padding-bottom: 2em;} |
+ | #left { | ||
+ | width: 45%; | ||
+ | float: left;} | ||
+ | |||
+ | #right { | ||
+ | width: 55%; | ||
+ | float: right;} | ||
+ | |||
+ | #left_2 { | ||
+ | width: 92%; | ||
+ | float: left;} | ||
+ | |||
+ | #right_2 { | ||
+ | width: 8%; | ||
+ | float: right;} | ||
/* This sets the orange background of the screen. */ | /* This sets the orange background of the screen. */ | ||
Line 43: | Line 58: | ||
#innercontent p { | #innercontent p { | ||
margin: 0.6em 0;} | margin: 0.6em 0;} | ||
- | h3, h4 | + | h3, h4, h6 { |
border: none; | border: none; | ||
font-weight: lighter; | font-weight: lighter; | ||
color: #E56717; text-align:left} | color: #E56717; text-align:left} | ||
+ | |||
+ | h5 { | ||
+ | font-weight: lighter; | ||
+ | color: #565051; | ||
+ | text-align:right;} | ||
+ | } | ||
+ | /* | ||
h1 { | h1 { | ||
border: none; | border: none; | ||
Line 52: | Line 74: | ||
text-shadow: 0 1px rgba(255, 255, 255, 0.5); | text-shadow: 0 1px rgba(255, 255, 255, 0.5); | ||
font-size: 30px; | font-size: 30px; | ||
- | margin: 5px | + | margin: 5px 1px 1px 1px; |
+ | padding: 1px; | ||
+ | |||
font-weight: bold;} | font-weight: bold;} | ||
+ | */ | ||
+ | h1 { | ||
+ | color: #383838; | ||
+ | border: none; | ||
+ | padding: 25px 0 5px; | ||
+ | font-family: Arial; | ||
+ | font-size: 30px; | ||
+ | font-weight: bold; | ||
+ | line-height:28px; | ||
+ | margin-bottom: 0;} | ||
+ | |||
+ | |||
h2 { | h2 { | ||
color: #383838; | color: #383838; | ||
Line 62: | Line 98: | ||
font-weight: bold; | font-weight: bold; | ||
margin-bottom: 0;} | margin-bottom: 0;} | ||
+ | |||
#bodyContent h1, #bodyContent h2 { | #bodyContent h1, #bodyContent h2 { | ||
margin-bottom: 0;} | margin-bottom: 0;} | ||
Line 104: | Line 141: | ||
/************************************************************/ | /************************************************************/ | ||
/* Main menu settings */ | /* Main menu settings */ | ||
+ | /* lots of advice and some code taken from | ||
+ | http://csswizardry.com/2011/02/creating-a-pure-css-dropdown-menu/, | ||
+ | http://www.onextrapixel.com/2011/06/03/how-to-create-a-horizontal-dropdown-menu-with-html-css-and-jquery/, | ||
+ | and the comment sections */ | ||
#nav { | #nav { | ||
- | clear:both; | + | /* clear:both; */ |
float:left; | float:left; | ||
margin:0; | margin:0; | ||
padding:0; | padding:0; | ||
- | border-bottom: | + | border-top:2px solid #000; /* black line above menu */ |
- | width: | + | border-bottom:2px solid #000; /* black line below menu */ |
- | font-family:Verdana, Geneva, sans-serif; | + | /* width: auto; */ |
- | font-size:100%; | + | width:830px; |
+ | /* font-family: Verdana, Geneva, sans-serif; Menu font */ | ||
+ | /* font-size:100%; Menu text size */ | ||
z-index:1000; /* This makes the dropdown menus appear above the page content below */ | z-index:1000; /* This makes the dropdown menus appear above the page content below */ | ||
position:relative; | position:relative; | ||
Line 121: | Line 164: | ||
margin:0; | margin:0; | ||
padding:0; | padding:0; | ||
+ | padding-below: .5em; | ||
list-style:none; | list-style:none; | ||
float:right; | float:right; | ||
Line 127: | Line 171: | ||
} | } | ||
#nav ul li { | #nav ul li { | ||
- | margin:0 0 0 | + | margin:0 0 0 5px; |
padding:0; | padding:0; | ||
float:left; | float:left; | ||
Line 133: | Line 177: | ||
left:50%; | left:50%; | ||
top:1px; | top:1px; | ||
+ | display: block; | ||
} | } | ||
#nav ul li a { | #nav ul li a { | ||
display:block; | display:block; | ||
margin:0; | margin:0; | ||
- | padding:.6em .5em .4em; | + | /* padding: .8em; */ |
- | font-size:1em; | + | padding:.6em .5em .4em; |
+ | /* font-size:1em; */ | ||
line-height:1em; | line-height:1em; | ||
- | background:#A9A9A9; | + | /* background:#A9A9A9; |
text-decoration:none; | text-decoration:none; | ||
color:##E56717; | color:##E56717; | ||
- | font-weight:bold; | + | font-weight:bold; */ |
+ | background: #000000; | ||
border-bottom:1px solid #000; | border-bottom:1px solid #000; | ||
+ | width: auto; | ||
} | } | ||
#nav ul li.active a { | #nav ul li.active a { | ||
Line 181: | Line 229: | ||
#nav ul li:hover ul li a, | #nav ul li:hover ul li a, | ||
#nav ul li.hover ul li a { /* This line is required for IE 6 and below */ | #nav ul li.hover ul li a { /* This line is required for IE 6 and below */ | ||
- | font-size:.8em; | + | /*font-size:.8em; .8em; */ |
font-weight:normal; /* resets the bold set for the top level menu items */ | font-weight:normal; /* resets the bold set for the top level menu items */ | ||
background:#eee; | background:#eee; | ||
Line 209: | Line 257: | ||
</style> | </style> | ||
- | |||
</html> | </html> |
Latest revision as of 19:00, 3 October 2012