oldenglishblog
<!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="cz">
<head>
<title>Old English Blog</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type='text/css'>
*{
padding:0;
margin:0;
}
body
{
background: url("oldenglishblog-img/main_pattern.gif") top left repeat;
background-color: black;
font-family: arial;
font-size: 12px;
color: #272525;
}
#Container
{
width: 826px;
margin: 0px auto;
}
#TopPart
{
width: 826px;
height: 296px;
float: left;
background-color: white;
}
#Header
{
width: 826px;
height: 226px;
float: left;
background: url("oldenglishblog-img/header.jpg") top left no-repeat;
color: white;
font-family: Candara;
font-size: 33px;
text-align: center;
padding-top: 20px;
}
.link
{
color: white;
font-family: Candara;
font-size: 14px;
text-decoration: none;
}
#Top_left
{
width: 312px;
height: 50px;
float: left;
}
#Top_right
{
width: 514px;
height: 50px;
float: right;
}
fieldset
{
border: none;
float: left;
background: url("oldenglishblog-img/search.gif") top left no-repeat;
width: 262px;
height: 45px;
padding-top: 5px;
padding-left: 50px;
}
input
{
float: left;
height: 15px;
width: 180px;
}
.button
{
float: right;
width: 77px;
height: 20px;
background: none;
border: none;
color: #f6b9ba;
font-size: 12px;
}
.button:hover
{
text-decoration: underline;
}
p
{
text-align: justify;
}
#Menu
{
width: 514px;
height: 29px;
float: right;
}
#Menu_bottom
{
height: 21px;
float: right;
width: 264px;
background: url("oldenglishblog-img/button_shadow.gif") top left no-repeat;
}
#Menu a
{
width: 88px;
line-height: 29px;
vertical-align: middle;
float: right;
background: url("oldenglishblog-img/button.gif") top left no-repeat;
text-align: center;
color: #f6b9ba;
text-decoration: none;
}
#Menu a:hover, #Menu a.active
{
text-decoration: underline;
}
#CentralPart
{
width: 826px;
clear: both;
background-color: white;
}
#LeftPart
{
width: 564px;
float: left;
color: #272525;
}
#RightPart
{
float: right;
width: 262px;
background: url("oldenglishblog-img/pattern1.gif") top left repeat;
padding-bottom: 10px;
}
.cleaner
{
clear: both;
}
#Page
{
width: 564px;
padding-top: 15px;
}
h2
{
font-size: 15px;
line-height: 28px;
font-weight: bold;
}
h4
{
font-size: 13px;
}
h3
{
font-size: 12px;
line-height: 20px;
font-weight: bold;
}
h5
{
font-size: 12px;
line-height: 20px;
}
.article_head
{
background: url("oldenglishblog-img/gradient.gif") top left repeat-y;
padding-top: 3px;
height: 70px;
}
.arrow
{
background: url("oldenglishblog-img/arrow2.gif") top left no-repeat;
width: 39px;
height: 60px;
float: left;
margin-top: 5px;
padding-right: 10px;
}
.article_body p
{
padding: 15px;
}
.article_comments a
{
color: black;
}
.article_comments
{
padding-top: 5px;
padding-bottom: 15px;
padding-left: 15px;
}
.photo
{
padding-top: 8px;
padding-bottom: 5px;
float: left;
padding-right: 8px;
}
.rightpart_header
{
color: #272525;
font-size: 15px;
font-weight: bold;
background: url("oldenglishblog-img/arrow.gif") top left no-repeat;
background-position: 0px 10px;
line-height: 20px;
text-indent: 23px;
padding-top: 10px;
}
#RightPart a
{
font-size: 13px;
display: block;
padding-left: 23px;
line-height: 25px;
color: #272525;
}
.main
{
text-indent: 23px;
}
.child
{
text-indent: 36px;
}
#Bottom
{
width: 826px;
background: url("oldenglishblog-img/bottom.gif") top left repeat-x;
height: 21px;
float: left;
}
.down_left
{
font-size: 11px;
text-align: left;
padding-top: 4px;
padding-left: 15px;
float: left;
color: white;
}
.down_right
{
font-size: 11px;
text-align: right;
padding-top: 4px;
float: right;
padding-right: 8px;
}
.down_right a, .down_left a
{
text-decoration: none;
color: white;
}
.down2
{
padding-top: 10px;
float: right;
}
.down2 img
{
border: 0px;
}
</style>
</head>
<body>
<div id="WholePage">
<div id="Inner">
<div id="Container">
<div id="TopPart">
<div id="Header"> <span>Old english blog</span><br/>
<a class="link" href="http://www.free-css.com/">www.oldenglishblog.com</a> </div>
<div id="Top_left">
<fieldset>
<input type="text" id="search" name="search" />
<input type="submit" class="button" value="Search" />
</fieldset>
</div>
<div id="Top_right">
<div id="Menu"> <a class="homepage active" href="http://www.free-css.com/"><span>Home</span></a> <a class="about-us" href="http://www.free-css.com/"><span>Page 1</span></a> <a class="products" href="http://www.free-css.com/"><span>Page 2</span></a> </div>
<div id="Menu_bottom"></div>
</div>
</div>
<div id="CentralPart">
<div id="LeftPart">
<div id="Page">
<div id="article1">
<div class="article_head">
<div class="arrow"></div>
<h5>18.7.2007</h5>
<h2>LOREM IPSUM DOLOR SIT AMET, CONSECTETUEROREM</h2>
<h4>autor: lorem ipsum</h4>
</div>
<div class="article_body">
<p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent gravida. Integer eget tellus sed magna condimentum scelerisque. Quisque sed lacus. Morbi consequat pellentesque ipsum. Ut eu nunc et turpis semper auctor. Donec non lorem. Cras pede. Cras luctus neque et nulla. Sed vitae ipsum eget lectus dictum elementum. Etiam vel metus. Quisque malesuada pharetra lacus. Phasellus id augue. Vestibulum non augue. Cras commodo. Nunc suscipit mi faucibus enim. Nunc risus sapien, tristique nec, bibendum sit amet, eleifend convallis, nibh. Nunc vel orci. Cras egestas consequat sem. Praesent id justo eget lorem vehicula suscipit. Nulla eget nunc.</p>
<p> Ut fermentum tristique purus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent diam lorem, porta vel, pharetra id, tristique at, velit. Mauris accumsan, augue ut consectetuer pulvinar, felis nulla viverra erat, sed commodo diam leo a massa. Phasellus sed nunc. Donec porttitor erat et nulla. Aliquam aliquet erat non tellus. Fusce pede. Integer ut sapien. Praesent eu orci sed tellus molestie tempus. Aliquam vestibulum, neque non dapibus posuere, sapien nunc pretium massa, nec fringilla tortor risus in nulla. Maecenas sed sem. Nunc tortor. Proin tempus leo id leo. </p>
</div>
<p class="article_comments"> <a class="comments" href="http://www.free-css.com/"><span>Comments (10)</span></a> </p>
</div>
<div id="article2">
<div class="article_head">
<div class="arrow"></div>
<h5>3.7.2007</h5>
<h2>MAECENAS SUSCIPIT PURUS A PEDE. NULLA CONSECTETUR</h2>
<h4>autor: lorem ipsum</h4>
</div>
<div class="article_body">
<p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent gravida. Integer eget tellus sed magna condimentum scelerisque. Quisque sed lacus. Morbi consequat pellentesque ipsum. Ut eu nunc et turpis semper auctor. Donec non lorem. Cras pede. Cras luctus neque et nulla. Sed vitae ipsum eget lectus dictum elementum. Etiam vel metus. Quisque malesuada pharetra lacus. Phasellus id augue. Vestibulum non augue. Cras commodo. Nunc suscipit mi faucibus enim. Nunc risus sapien, tristique nec, bibendum sit amet, eleifend convallis, nibh. Nunc vel orci. Cras egestas consequat sem. Praesent id justo eget lorem vehicula suscipit. Nulla eget nunc. Ut fermentum tristique purus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
</div>
<p class="article_comments"> <a class="comments" href="http://www.free-css.com/"><span>Comments (10)</span></a> </p>
</div>
</div>
</div>
<div id="RightPart">
<div id="Pages">
<div class="rightpart_header">Pages</div>
<a class="main" href="http://www.free-css.com/"><span>Page 1</span></a> <a class="child" href="http://www.free-css.com/"><span>- Page 1</span></a> <a class="main" href="http://www.free-css.com/"><span>Page 2</span></a> <a class="main" href="http://www.free-css.com/"><span>Page 3</span></a> </div>
<div id="Archives">
<div class="rightpart_header">Archives</div>
<a href="http://www.free-css.com/"><span>October 2006</span></a> <a href="http://www.free-css.com/"><span>November 2006</span></a> <a href="http://www.free-css.com/"><span>December 2006</span></a> <a href="http://www.free-css.com/"><span>January 2007</span></a> </div>
<div id="Categories">
<div class="rightpart_header">Categories</div>
<a class="main" href="http://www.free-css.com/"><span>Categorie 1</span></a> <a class="child" href="http://www.free-css.com/"><span>- Categorie 1 child 1</span></a> <a class="child" href="http://www.free-css.com/"><span>- Categorie 1 child 2</span></a> <a class="child" href="http://www.free-css.com/"><span>- Categorie 1 child 3</span></a> <a class="main" href="http://www.free-css.com/"><span>Categorie 2</span></a> <a class="child" href="http://www.free-css.com/"><span>- Categorie 2 child 1</span></a> <a class="child" href="http://www.free-css.com/"><span>- Categorie 2 child 2</span></a> </div>
<div id="Friends">
<div class="rightpart_header">Friends</div>
<a href="http://www.free-css.com/"><span>Peter</span></a> <a href="http://www.free-css.com/"><span>Susan</span></a> <a href="http://www.free-css.com/"><span>Jane</span></a> <a href="http://www.free-css.com/"><span>Michal</span></a> <a href="http://www.free-css.com/"><span>Richard</span></a> <a href="http://www.free-css.com/"><span>Ola</span></a> </div>
</div>
<div class="cleaner"></div>
</div>
<div id="Bottom">
<p class="down_left">Copyright 2007 </p>
<p class="down_right"> <a href="http://www.sunlight.cz">Webdesign, tvorba www strnek</a></p>
</div>
<div class="down2">
<p> <a target="_blank" href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml11" alt="Valid XHTML 1.1" height="31" width="88" /></a> </p>
</div>
</div>
</div>
</div>
</body>
</html>
Related examples in the same category