stickybud
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
Title : Stickybud
Version : 1.0
Released : 20070701
Description: A two-column, fixed-width template. This template features a splash page that can be changed easily.
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Stickybud by Free Css Templates</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<style type='text/css'>
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/
body {
margin: 0;
padding: 0;
background: #7F7772 url(stickybud-images/img01.gif) repeat-x;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 13px;
color: #FFFFFF;
}
h1, h2, h3 {
margin-top: 0;
font-weight: normal;
color: #000000;
}
h1 {
font-size: 197%;
}
h2 {
font-size: 136%;
}
h3 {
font-size: 100%;
font-weight: bold;
}
p, ul, ol {
margin-bottom: 1.6em;
line-height: 180%;
}
p {
}
blockquote {
font-style: italic;
}
ul {
}
ol {
}
a {
color: #FFBF23;
}
a:hover {
text-decoration: none;
}
small {
}
hr {
display: none;
}
img {
border: 1px solid #B2B2B2;
}
img.left {
float: left;
margin: 0 15px 0 0;
}
img.right {
float: right;
margin: 0 0 0 15px;
}
/* header */
#header {
width: 700px;
height: 100px;
margin: 0 auto;
}
/* Logo */
#logo {
float: left;
}
#logo h1, #logo h2 {
margin: 0;
}
#logo h1 {
padding-top: 15px;
font-size: 36px;
}
#logo h2 {
}
#logo a {
text-decoration: none;
color: #7F7772;
}
/* Search */
#search {
float: right;
width: 290px;
padding-top: 40px;
}
#search form {
margin: 0;
padding: 0;
}
#search fieldset {
margin: 0;
padding: 0;
border: none;
}
#search legend {
display: none;
}
#searchinput, #searchsubmit {
font: bold 100% Georgia, "Times New Roman", Times, serif;
}
#searchinput {
padding: 2px 5px;
width: 198px;
color: #7F7772;
}
#searchsubmit {
}
/* Menu */
#menu {
width: 700px;
height: 50px;
margin: 0 auto;
}
#menu ul {
margin: 0;
padding: 15px 0 0 0;
list-style: none;
}
#menu li {
display: inline;
}
#menu a {
display: block;
float: left;
padding: 0 20px 0 10px;
background: url(stickybud-images/img02.gif) no-repeat left center;
text-align: center;
text-decoration: none;
font-size: 154%;
color: #F8DFC9;
}
#menu a:hover {
color: #FFFFFF;
}
#menu .active a {
color: #990000;
}
/* Page */
#page {
clear: both;
width: 720px;
margin: 0 auto 20px auto;
padding: 131px 0 0 0;
background: url(stickybud-images/img03.jpg) no-repeat;
}
/* Splash */
#splash {
width: 660px;
height: 180px;
padding: 30px 30px 0 30px;
background: url(stickybud-images/img04.jpg) no-repeat;
}
.twocols {
}
.twocols .title {
}
.twocols .col1 {
float: left;
width: 320px;
}
.twocols .col2 {
float: right;
width: 320px;
}
/* Content */
#content {
float: right;
width: 420px;
padding-right: 10px;
}
.title {
padding-bottom: 5px;
}
.list {
margin-left: 0;
padding-left: 0;
list-style: none;
}
.list li {
padding-left: 10px;
background: url(stickybud-images/img10.gif) no-repeat left center;
}
/* Sidebar */
#sidebar {
float: left;
width: 240px;
padding: 10px 0 0 10px;
}
#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
#sidebar li {
}
#sidebar li ul {
}
#sidebar li li {
padding: 5px 0;
}
#sidebar h2 {
font-size: 114%;
font-weight: bold;
}
#sidebar h3 {
margin: 0;
}
#sidebar p {
margin: 0;
line-height: normal;
}
#sidebar a {
text-decoration: none;
}
#sidebar a:hover {
text-decoration: underline;
}
/* Footer */
#footer {
clear: both;
height: 100px;
padding-top: 20px;
background: #FFFFFF;
color: #666666;
}
#footer p {
margin: 0;
text-align: center;
font-size: 77%;
}
#footer a {
color: #666666;
}
</style>
</head>
<body>
<div id="header">
<div id="logo">
<h1><a href="http://www.free-css.com/">Stickybud</a></h1>
<h2><a href="http://www.freecsstemplates.org/">By Free CSS Templates</a></h2>
</div>
<div id="search">
<form id="searchform" method="get" action="">
<fieldset>
<legend>Search</legend>
<input id="searchinput" type="text" name="searchinput" value="" />
<input id="searchsubmit" type="submit" value="Search" />
</fieldset>
</form>
</div>
</div>
<div id="menu">
<ul>
<li class="active"><a href="http://www.free-css.com/">Home</a></li>
<li><a href="http://www.free-css.com/">Products</a></li>
<li><a href="http://www.free-css.com/">Support</a></li>
<li><a href="http://www.free-css.com/">About</a></li>
<li><a href="http://www.free-css.com/">Contact</a></li>
</ul>
</div>
<hr />
<div id="page">
<div id="splash" class="twocols">
<div class="col1">
<h2 class="title">Lorem Ipsum Dolor</h2>
<p>Donec leo, vivamus fermentum nibh in augue praesent a lacus at urna congue rutrum. Quisque dictum integer nisl risus sagittis. <a href="http://www.free-css.com/">Read more…</a></p>
</div>
<div class="col2">
<h2 class="title">Pellentesque Quis</h2>
<ul class="list">
<li><a href="http://www.free-css.com/">Quisque fermentum semper augue mattis wisi…</a></li>
<li><a href="http://www.free-css.com/">Donec leo vivamus fermentum nibh in augue…</a></li>
<li><a href="http://www.free-css.com/">Integer nisl risus sagittis convallis rutrum…</a></li>
</ul>
</div>
<div style="clear: both;"> </div>
</div>
<div id="content">
<div>
<h1 class="title">Welcome to Our Website!</h1>
<p><strong>Stickybud</strong> is a free template from <a href="http://www.freecsstemplates.org/">Free CSS Templates</a> released under a <a href="http://creativecommons.org/licenses/by/2.5/">Creative Commons Attribution 2.5 License</a>. The photo is from <a href="http://www.pdphoto.org/">PDPhoto.org</a>. You"re free to use it for both commercial or personal use. I only ask that you link back to <a href="http://www.freecsstemplates.org/">my site</a> in some way. <em>Enjoy :)</em></p>
<h2>Praesent Scelerisque</h2>
<p>In posuere eleifend odio. Quisque semper augue mattis wisi. Maecenas ligula. Pellentesque viverra vulputate enim. Aliquam erat volutpat:</p>
<blockquote>
<p>“Integer nisl risus, sagittis convallis, rutrum id, elementum congue, nibh. Suspendisse dictum porta lectus. Donec placerat odio vel elit. Nullam ante orci, pellentesque eget, tempus quis, ultrices in, est. Curabitur sit amet nulla. Nam in massa. Sed vel tellus. Curabitur sem urna, consequat vel, suscipit in, mattis placerat, nulla. Sed ac leo. Pellentesque imperdiet.”</p>
</blockquote>
</div>
</div>
<div id="sidebar">
<ul>
<li>
<h2>Recent Updates</h2>
<ul>
<li>
<h3><span>6/25:</span> Semper vestibulum</h3>
<p><a href="http://www.free-css.com/">In posuere eleifend odio quisque semper augue mattis wisi maecenas ligula…</a></p>
</li>
<li>
<h3><span>6/21:</span> Posuere eleifend odio</h3>
<p><a href="http://www.free-css.com/">Donec leo, vivamus fermentum nibh in augue praesent a lacus at urna congue rutrum…</a></p>
</li>
<li>
<h3><span>6/17:</span> Vivamus fermentum</h3>
<p><a href="http://www.free-css.com/">Quisque dictum integer nisl risus, sagittis convallis, rutrum id, congue, and nibh…</a></p>
</li>
</ul>
</li>
<li> </li>
<li>
<h2>Sagittis Convallis</h2>
<ul>
<li><a href="http://www.free-css.com/">Ut semper vestibulum est</a></li>
<li><a href="http://www.free-css.com/">Vestibulum luctus venenatis dui</a></li>
<li><a href="http://www.free-css.com/">Integer rutrum nisl in mi</a></li>
<li><a href="http://www.free-css.com/">Etiam malesuada rutrum enim</a></li>
</ul>
</li>
</ul>
</div>
<div style="clear: both;"> </div>
</div>
<hr />
<div id="footer">
<p id="legal">Copyright © 2007 Stickybud. All Rights Reserved | Designed by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a></p>
<p id="links"><a href="http://www.free-css.com/">Privacy Policy</a> | <a href="http://www.free-css.com/">Terms of Use</a> | <a href="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional"><abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a> | <a href="http://jigsaw.w3.org/css-validator/check/referer" title="This page validates as CSS"><abbr title="Cascading Style Sheets">CSS</abbr></a></p>
</div>
</body>
</html>
Related examples in the same category