User:Dirk Van Swaay/FP
<html> <link rel="stylesheet" href="http://www.thedirkside.com/css/IC07_mainpage.css" type="text/css" /> <div id="wrap"> <div id="maincontent">
</html><html> <style type="text/css"> h1.firstHeading {display: none;}
- contentSub {
font-size: 0px;
}
- navmenu {
float: left;
width: 667px;
position: relative;
top: -42px;
left: 170px;
padding: 0;
margin: 0 0 0 0;
list-style: none;
z-index:20;
margin-bottom: 10px;
}
- navmenu ul {
list-style: none;
position:absolute;
border-right: solid 1px #666;
border-bottom: solid 1px #666;
border-left: solid 1px #666;
line-height: 10pt;
}
- navmenu a {
font-size: 14pt;
font-family: "Helvetica", Verdana, arial, sans-serif;
text-decoration: none;
color: #0a5b86;
display: block;
list-style: none;
}
- navmenu a:hover {
color: #0a5b86;
}
- navmenu li {
list-style: none;
padding: 0.2em 0.5em;
float:left;
background-color: #FFF;
}
- navmenu li td a:visited { color: #0a5b86; }
- navmenu li ul {
display: none;
margin: 0;
padding-left:0;
background:white;
list-style: none;
}
- navmenu li:hover ul {
display: block;
list-style: none;
}
- navmenu li li {
padding: 0.1em 0.5em;
float:none;
list-style: none;
}
- navmenu li li:hover {
background-color: #e6ecf6;
list-style: none;
}
- navmenu li ul a {
font-size: 8pt;
color: #0a5b86;
list-style: none;
} </style> </html><html>
<!-- Place Team Photo under here -->
<img src="http://openwetware.org/images/1/1a/IC07_teamphoto.jpg" />
<!-- Start of Main Text Column -->
<div id="maincol"> <div class="blurb">Write the Blurb Here. See how large it can be.. it may be pretty long, I think the text wraps around to new lines. Let's see...</div> <p>Write the main content text here. If I were to write a whole story here, how would this display with my CSS? Will it just wrap around? Will it overlap with anything? Blah blah blah. I think this CSS still needs a lot of work, but I'm getting there. Next up will be changing the possible layouts of the postit notes on the right. I would also like to see how it looks in the official IGEM 2007 wiki, because of the colour schemes.</p> <!-- <div id="sitepreviews"> <a href="http://..." title="pop-up text"><img src="http://...image.jpg" /></a> <a href="http://..." title="pop-up text"><img src="http://...image.jpg" /></a> <a href="http://..." title="pop-up text"><img src="http://...image.jpg" /></a> </div> --> </div>
<!-- End of Main Text Column --> <!-- Start of Central Content Box -->
<div id="FeatureBox">
<div class="metainfo">
<h2><a href="http://...">Cell Free Gene Expression</a></h2>
</div>
<div class="contentbox">
The Imperial College iGEM 2007 team is promoting the use of Cell Free Gene Expression systems as a viable chassis in Synthetic Biology. Blah blah blah blah...
</div>
<a href="http://parts.mit.edu/igem07/index.php/Jamboree"><img src="http://cis-action.com/main/images/iGEM07-mainpage_smallpolaroids.jpg" /></a>
</div>
<!-- End of Central Content Box -->
<!-- Start of Side Bar Content -->
<div id="sidebar">
<!-- Post-It Box Template --> <!-- Copy, paste, and edit the following code:
<div class="post-it bluebox"> <h2><a href="http://..." title="">Title</a></h2> <p>Enter text here.</p> <a style="float:right;" href="http://...">Learn More</a> </div>
****other options include:
yellowbox
greenbox
pinkbox
whitebox
blackbox (transparent)
-->
<!-- End of Post-It Box Template -->
<!-- Add your Post-It Boxes in here -->
<div class="post-it bluebox"> <h2><a href="http://...">News</a></h2> <div id="newscol">
<!-- Sample News Entry Item -->
<!-- Copy, Paste, and edit the following to add a news item:
<div class="newsentry"> <div class="newsmeta"> <h2><a href=""></a>News Item Title</h2> <span class="newsmeta-date">26 sep 07</span> </div> <p>Write your news story here.<a class="newsmeta-more" href="http://.....">more</a></p> </div>
-->
<!-- Start of News Entries -->
<div class="newsentry"> <div class="newsmeta"> <h2><a href=""></a>News Item Title</h2> <span class="newsmeta-date">26 sep 07</span> </div> <p>Write your news story here. Testing how much news I need to put in here before the central colum will move to the center. <a class="newsmeta-more" href="http://.....">more</a></p> </div>
</div>
<!-- End of News Entries -->
</div>
<div class="post-it greenbox">
<h2><a href="" title="">Meet the Team</a></h2>
</div>
<div class="post-it pinkbox"> <h2><a href="" title="">Fun with iGEM</a></h2> </div>
<div class="post-it whitebox" style="filter:alpha(opacity=80); -moz-opacity:0.8;"> <h2><a href="" title="">Acknowledgements</a></h2>
<ul style="list-style:none">
<li><a href="http://www.geneart.com"><img src="http://www.geneart.com/fileadmin/templates/img/logo.gif" width="180"></a>
<li>IC Deputy Rector's Fund
<li>IC Faculty of Engineering
<li>IC Faculty of Natural Sciences
</ul>
</div>
</div>
<!-- End of Side Bar Content -->
</div>
</html>
