Team:UEA-JIC Norwich/experiment

From 2011.igem.org

(Difference between revisions)
 
(30 intermediate revisions not shown)
Line 4: Line 4:
<style type="text/css">
<style type="text/css">
-
body  
+
<body>
{ margin-top: 0;
{ margin-top: 0;
-
   margin-bottom: 0;
+
   margin-bottom:0px;
   margin-left: 0;
   margin-left: 0;
   margin-right: 0;
   margin-right: 0;
Line 20: Line 20:
#left {
#left {
   position: absolute;
   position: absolute;
-
   left: 15px;
+
   left: 0px;
-
   top: 560px;
+
   top: 675px;
   width: 200px;
   width: 200px;
}
}
Line 31: Line 31:
#right {
#right {
   position: absolute;
   position: absolute;
-
   right: 15px;
+
   right: 0px;
-
   top: 560px;
+
   top: 675px;
   width: 200px;
   width: 200px;
}
}
Line 38: Line 38:
</head>
</head>
-
<body>
+
</body>
<div id="header">
<div id="header">
-
 
+
</html>
<html>
<html>
<head>
<head>
Line 335: Line 335:
</div>
</div>
</div>
</div>
 +
</html>
-
<html>
 
 +
<html>
<div id="leftbox" style="float:left; height:200px;  width:319px;" class="tophome">
<div id="leftbox" style="float:left; height:200px;  width:319px;" class="tophome">
<div id="lefttop" style="background:#f87217; background-image:url('https://static.igem.org/mediawiki/2010/a/ad/Cam-Gradient-Overlay.png');" class="secheader"><a style="color:#7d1b7e !important" href="https://2011.igem.org/Team:UEA-JIC_Norwich/UKConference">UK Team Meet</a></div>
<div id="lefttop" style="background:#f87217; background-image:url('https://static.igem.org/mediawiki/2010/a/ad/Cam-Gradient-Overlay.png');" class="secheader"><a style="color:#7d1b7e !important" href="https://2011.igem.org/Team:UEA-JIC_Norwich/UKConference">UK Team Meet</a></div>
Line 378: Line 379:
<div id="rcontent" style="background:-webkit-gradient(linear, left top, left bottom, from(#5cb3ff), to(#488ac7));  
<div id="rcontent" style="background:-webkit-gradient(linear, left top, left bottom, from(#5cb3ff), to(#488ac7));  
background: -moz-linear-gradient(top, #f2f2f2, #f8f8f8); color:#333333; height:150px; margin-top:5px; position:relative;">
background: -moz-linear-gradient(top, #f2f2f2, #f8f8f8); color:#333333; height:150px; margin-top:5px; position:relative;">
-
<p style="line-height:140%; padding-left:10px; padding-top:10px; padding-right:10px;text-align:justify; font-size:90%;">We wanted to dedicate a page to all of the sponsors who made what we've achieved possible. Without there help we wouldn't have been able to. achieve half of what we have. Thank you! Click on the link above to see who lent a hand</a>.
+
<p style="line-height:140%; padding-left:10px; padding-top:10px; padding-right:10px;text-align:justify; font-size:90%;">We wanted to dedicate a page to all of the sponsors who made what we've achieved possible. Without their help we wouldn't have been able to achieve half of what we have. Thank you! Click on the link above to see who lent a hand</a>.
</a>
</a>
</div>
</div>
</div>
</div>
 +
</html>
<br>
<br>
Line 404: Line 406:
</html>
</html>
 +
 +
<br>
 +
<br>
 +
 +
<html>
<div id="left">
<div id="left">
-
Your left menu will go here. You can place images, text links, etc. in this div. To change the properties of this div you can change the #left selector in the style sheet that is located on this page between the head tags.
+
<script src="http://widgets.twimg.com/j/2/widget.js"></script>
 +
<script>
 +
new TWTR.Widget({
 +
  version: 2,
 +
  type: 'search',
 +
  search: 'UEAJIC_IGEM',
 +
  interval: 6000,
 +
  title: 'iGEM 2011',
 +
  subject: 'University of East Anglia-John Innes Centre',
 +
  width: 200,
 +
  height: 250,
 +
  theme: {
 +
    shell: {
 +
      background: '#8ec1da',
 +
      color: '#ffffff'
 +
    },
 +
    tweets: {
 +
      background: '#ffffff',
 +
      color: '#444444',
 +
      links: '#1985b5'
 +
    }
 +
  },
 +
  features: {
 +
    scrollbar: true,
 +
    loop: false,
 +
    live: true,
 +
    hashtags: true,
 +
    timestamp: true,
 +
    avatars: true,
 +
    toptweets: true,
 +
    behavior: 'all'
 +
  }
 +
}).render().start();
 +
</script>
</div>
</div>
 +
</html>
 +
<html>
<div id="center">
<div id="center">
-
All of your content goes in this div. This section is fluid so that if the window is collapsed, your div will collapse also and fit the screen perfectly.  To change the properties of this div you can change the #center selector in the style sheet that is located on this page between the head tags.
+
 
 +
 
 +
<iframe width="450" height="250" src="http://www.youtube.com/embed/CCJot4yiIxs" frameborder="0" allowfullscreen></iframe>
 +
 
 +
 
 +
 
</div>
</div>
 +
</html>
 +
 +
<html>
<div id="right">
<div id="right">
-
Your right menu will go here. You can place images, text links, etc. in this div. To change the properties of this div you can change the #right selector in the style sheet that is located on this page between the head tags.
+
<!-- Facebook Badge START --><a href="http://www.facebook.com/UEAJIC.iGEM" target="_TOP" style="font-family: &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif; font-size: 11px; font-variant: normal; font-style: normal; font-weight: normal; color: #3B5998; text-decoration: none;" title="UEA JIC iGEM Team">UEA JIC iGEM Team</a><br/><a href="http://www.facebook.com/UEAJIC.iGEM" target="_TOP" title="UEA JIC iGEM Team"><img src="http://badge.facebook.com/badge/196910580348644.2296.1971053193.png" width="120" height="176" style="border: 0px;" /></a><br/><a href="http://www.facebook.com/business/dashboard/" target="_TOP" style="font-family: &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif; font-size: 11px; font-variant: normal; font-style: normal; font-weight: normal; color: #3B5998; text-decoration: none;" title="Make your own badge!">Promote your Page too</a><!-- Facebook Badge END -->
</div>
</div>

Latest revision as of 09:11, 1 August 2011

Three Column CSS Layout with Header