I_Like
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>I-Like</title>
<style type='text/css'>
body {
margin: 0;
padding: 0;
background: url(I_Like-images/bkg.jpg) repeat;
background-color: #ffffff; }
dl {
position: absolute;
left: 50px;
top: 20px;
width: 320px; }
dl, dt, dd {
margin: 0;
padding: 0; }
dl {
background: url(I_Like-images/c_bottom.gif) bottom left no-repeat;
padding-bottom: 14px; }
dt {
height: 14px;
background: url(I_Like-images/c_top.gif) top left no-repeat;
font-size: 10px;
font-weight: bold;
text-align: center; }
dd {
padding: 0 10px 0 10px;
text-align: justify;
background: url(I_Like-images/c_middle.gif) top left repeat-y; }
h1 {
font-family: Verdana, Arial, sans-serif;
font-size: 12px;
font-weight: bold; }
p {
padding: 0px;
font-family: Verdana, Arial, sans-serif;
font-size: xx-small; }
#box {
position: relative;
left: 50%;
width: 320px;
height: auto;
margin-top: 20px;
margin-left: -160px;
color: #ffffff;
background-color: #ffffff; }
#header {
position: relative;
width: 300px;
height: 200px;
margin-top: 0px;
margin-left: 0px;
color: #ffffff;
background: url(I_Like-images/header.jpg) no-repeat; }
#navcontainer {
font-family: Verdana, Arial,Sans-Serif;
font-size: 0.8em;
margin-top: 10px;
margin-left: 0px;
width: 300px;
height: 30px;
background: url(I_Like-images/navbar.jpg) no-repeat; }
#navlist {
width: 300px;
height: 30px;
text-align: left;
margin: 0 auto;
padding-left: 6px;
padding-top: 6px;
text-indent: 0;
list-style-type: none; }
#navlist li {
padding: 0;
margin: 0;
text-indent: 0;
display: inline; }
#navlist li a {
letter-spacing: -1px;
text-decoration: none;
color: #ffffff;
font-size: 0.8em;
padding: 0 2px; }
#navlist li a:hover {
color: #ff0000;
font-size: 1.0em;
border-bottom: 1px solid #ff0000; }
#content {
position: relative;
width: 280px;
min-height: 320px;
padding: 10px;
margin: 0px; }
/* for IE */
* html div #content { height:320px; }
/* ----- */
#content a {
background-color: #000000;
color: #ff0000;
font-family: arial, verdana, helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
}
#content a:active, a:link, a:visited {
background-color: #000000;
color: #ff0000;
font-family: arial, verdana, helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
}
#content a:hover {
text-decoration: underline;
}
#footer {
position: relative;
width: 300px;
height: 12px;
padding-top: 1px;
text-align: right;
font-size: 10px;
border-top: 1px solid #666666; }
.footer a {
background-color: #000000;
color: #666666;
font-family: arial, verdana, helvetica, sans-serif;
font-size: 8px; }
.footer a:active, a:link, a:visited {
background-color: #000000;
color: #666666;
font-family: arial, verdana, helvetica, sans-serif;
font-size: 8px;
text-decoration: none; }
.footer a:hover {
background-color: #000000;
color: #ffffff;
font-size: 10px; }
</style>
</head>
<body>
<div id="box">
<dl>
<dt></dt><!-- close top -->
<dd>
<div id="header"></div><!-- close header -->
<div id="navcontainer">
<ul id="navlist">
<li><a href="index.html">Home</a></li>
<li><a href="index.html">About</a></li>
<li><a href="index.html">News</a></li>
<li><a href="index.html">Contact</a></li>
<li><a href="index.html">Feedback</a></li>
</ul>
</div><!-- close navcontainer -->
<div id="content">
<h1>"I-Like" for OSWD</h1>
<p>Hi...<br />
another one design for OSWD.<br />
I thing a good starting point of using the Template are small private Bloger Sites.<br />
The Template is tested with Mozilla, FF, Opera, IE and SeaMonkey and works with all very well
(be sure all the latest Browsers on PC).<br /><br />
<strong>Notice</strong><br /> All my Templates that are publiced on OSWD are free(in use) and Open Source.<br />
If you are planning to use one of my Designs please let me know, and also if you change anything in the code.<br />
The header image was created be me self with "The Gimp", and is only used for this Template. Otherwise just ask me.<br /><br />
In compliance with <a href="http://validator.w3.org/check?uri=referer">XHTML</a> and <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>,<br /></p>
</div><!-- content -->
<div id="footer" class="footer">
|:.<a href="mailto:M75@sgies.com">Contact</a>.:|:.<a href="http://m75.dyndns.org">Design By M75</a>.:|:.<a href="http://www.oswd.org">OSWD</a>.:|
</div><!-- close footer -->
</dd><!-- close middle -->
</dl><!-- close bottom -->
</div><!-- close box -->
</body>
</html>
Related examples in the same category