Team:Calgary/Sandbox

From 2010.igem.org

(Difference between revisions)
 
(103 intermediate revisions not shown)
Line 1: Line 1:
-
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
+
<html>
-
<!--Colors Blue:4AC6F7, Yellow:F3F778, Green:9ECF3E, White:FFFFFF, Dark Brown:30251A-->
+
<head>
-
<head>
+
<title> iGEM Information Tabs </title>
-
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+
-
</head>
+
-
+
<script type="text/javascript" src="http://www.wikiwikiwebworks.ca/script1.js"></script>
-
<style type="text/css">
+
-
body{
+
<style>
-
margin:0;
+
-
padding:0;
+
</style>
-
line-height: 1.5em;
+
-
}
+
 +
</head>
-
#maincontainer{
 
-
width: 840px; /*Width of main container*/
 
-
margin: 0 auto; /*Center container on page*/
 
-
}
 
-
#topsection{
 
-
background: #EAEAEA;
 
-
height: 90px; /*Height of top section*/
 
-
}
 
-
#topsection h1{
+
<body>
-
margin: 0;
+
-
padding-top: 15px;
+
-
}
+
-
#contentwrapper{
 
-
float: left;
 
-
width: 100%;
 
-
}
 
-
#contentcolumn{
 
-
margin-right: 230px; /*Set right margin to RightColumnWidth*/
 
-
}
 
-
#rightcolumn{
+
<!-- text division -->
-
float: left;
+
-
width: 230px; /*Width of right column*/
+
<div style="margin-left:auto; margin-right:auto; background:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Background.png'); width:556px; height:330px; padding-top:15px; ">
-
margin-left: -230px; /*Set left margin to -(RightColumnWidth) */
+
-
background: #FDE95E;
+
<div id="0" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:block ">
-
}
+
-
#footer{
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
clear: left;
+
-
width: 100%;
+
<img id="boximage1" src="http://www.army.forces.gc.ca/cfb_suffield/Images/CFB_Suffield1.gif"></img>
-
background: black;
+
-
color: #FFF;
+
</div>
-
text-align: center;
+
-
padding: 4px 0;
+
-
}
+
-
#footer a{
 
-
color: #FFFF80;
 
-
}
 
-
.innertube{
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
+
-
margin-top: 0;
+
<p style="padding-left:10px;">On July 14th, 2010, iGEM Calgary visited the Defence Research and Development Canada (DRDC) facility in Suffield, Alberta.</p>
-
}
+
 +
</div>
 +
 +
</div>
-
</style>
+
-
<body>
+
<div id="1" style="background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
<div id="maincontainer">
+
-
<div id="topsection">
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
<div class="innertube">
+
-
<h1>CSS Fixed Layout #2.2- (Fixed-Fixed)</h1>
+
<img id="boximage2" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ImageTBA-1.png"></img>
-
</div>
+
</div>
</div>
-
<div id="contentwrapper">
+
-
<div id="contentcolumn">
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
<div class="innertube">
+
-
<b>Content Column: <em>Fixed</em></b>
+
<p style="padding-left:10px;"> I'm generic information about Lethbridge! </p>
-
</div>
+
-
</div>
+
</div>
-
</div>
+
 +
</div>
-
<div id="rightcolumn">
+
-
<div class="innertube">
+
-
<b>Right Column: <em>200px</em></b>
+
-
</div>
+
-
</div>
+
<div id="2" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
 +
 +
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
<div id="footer">
+
<img id="boximage3" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/bhsgrnsmall.png"></img>
-
<a href="http://www.dynamicdrive.com/style/">Dynamic Drive CSS Library</a>
+
-
</div>
+
</div>
 +
 
 +
 +
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
 +
 
 +
<p style="padding-left:10px;"> I'm like burning man but better! </p>
 +
 +
</div>
 +
 +
</div>
 +
 
 +
 +
 
 +
<div id="3" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
 +
 
 +
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
 +
 +
<img id="boximage4" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ProtocolIcon.png"></img>
 +
 +
</div>
 +
 
 +
 +
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
 +
 
 +
<p style="padding-left:10px;"> I'm a fan of cupcakes! </p>
 +
 +
</div>
 +
 +
</div>
 +
 
 +
 +
 
 +
<div id="4" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
 +
 
 +
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
 +
 
 +
<img id="boximage5" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Twitter.png"></img>
 +
 +
</div>
 +
 
 +
 +
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
 +
 
 +
<p style="padding-left:10px;"> I'm from Alberta and I'm awesome! </p>
 +
 +
</div>
 +
 +
</div>
 +
 
 +
 
 +
</div>
 +
 
 +
 
 +
 
 +
<!-- menu bar -->
 +
 +
<div style="width:524px; height:35px; margin-right:auto; margin-left:auto; margin-top:-10px; padding-left:10px; ">
 +
 
 +
 +
<div onmouseover="imgHover(1);" onmouseout="imgOff(1);" onclick="changeTab(0);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="suffield" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/SuffieldWhite.png" title="suffield" /> </div>
 +
 
 +
 +
<div onmouseover="imgHover(2);" onmouseout="imgOff(2);" onclick="changeTab(1);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="lethbridge" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/LethbridgeGrey.png" title="lethbridge" /> </div>
 +
 
 +
 +
<div onmouseover="imgHover(3);" onmouseout="imgOff(3);" onclick="changeTab(2);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="proteinman" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ProteinManGrey.png" title="protein man" /> </div>
 +
 
 +
 
 +
<div onmouseover="imgHover(4);" onmouseout="imgOff(4);" onclick="changeTab(3);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="community" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/CommunityGrey.png" title="bake sale" /> </div>
 +
 
 +
 +
<div onmouseover="imgHover(5);" onmouseout="imgOff(5);" onclick="changeTab(4);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="agem" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/aGEMGrey.png" title="aGEM" /> </div>
 +
 +
</div>
 +
 
 +
 
 +
 
 +
 
 +
</body>
-
</div>
 
-
</body>
 
</html>
</html>

Latest revision as of 06:48, 25 October 2010

iGEM Information Tabs

On July 14th, 2010, iGEM Calgary visited the Defence Research and Development Canada (DRDC) facility in Suffield, Alberta.

I'm generic information about Lethbridge!

I'm like burning man but better!

I'm a fan of cupcakes!

I'm from Alberta and I'm awesome!