binary-news
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Free BinaryNews Template For sNews</title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-2" />
<style type='text/css'>
/*
By Herreman David
http://www.free-css-templates.com
StyleSheet for BinaryNews Template
*/
body {
background-color: #e7e7e7;
color: #FFF;
padding: 0; margin: 0; font: 0.7em Arial, sans-serif; line-height: 1.5em;
}
a { color: #46574D; background: inherit; }
a:hover { color: #647B6D; background: inherit;}
h1 { font: bold 2em Arial, Sans-Serif; letter-spacing: -1px; padding: 16px 0 0 8px; margin: 0; }
h2 { margin: 0; padding: 0; font: normal 1.6em Arial, Sans-Serif; letter-spacing: -1px; }
h1 a { color: #46574D; background: inherit; }
h1 a, h2 a { text-decoration: none; }
h1 a:hover, h2 a:hover { color: #BFE1ED; background: inherit; }
h3 { font: 90% Arial, Sans-Serif; margin: 0 0 10px 0; padding: 0; color: #46574D; background: #FFF; }
p { margin: 0 0 0px 0; line-height: 1.5em; }
form { margin: 0; }
input.search { width: 122px; height: 15px; border: 1px dashed #46574D; background: #FFF url(input.jpg) no-repeat; padding: 3px; color: #616161; }
input.submit { width: 28px; height: 20px; font-weight: bold; border: none; background: #FFF; padding: 3px; color: #616161; }
.content {
background: #FFF;
margin: 0 auto;
padding: 0px;
width: 886px;
color: #000;
}
.preheader {
background: #000 url(preheader.jpg) no-repeat center bottom;
color: #FFF;
width: 886px;
height: 71px;
margin: 0;
padding: 0;
}
.preheader a { color: #FFF; background: inherit; text-decoration:none; }
.preheader a:hover { color: #FFF; background: inherit;}
.preheader .padding {
float: right;
padding: 52px 70px 0 0;
color: #FFF;
}
.header {
background: #000 url(header.jpg) no-repeat center bottom;
color: #FFF;
width: 886px;
height: 78px;
margin: 0;
padding: 0;
}
.header .title {
float: left;
padding: 12px 0 0 84px;
color: #FFF;
font: bold 1.8em Arial, sans-serif;
}
.header .slogan {
float: left;
clear: both;
padding: 2px 0 0 84px;
color: #FFF;
font: bold 0.8em Arial, sans-serif;
}
#nav {
background: #000 url(menu.jpg) no-repeat center bottom;
background-color: #000;
width: 886px;
height: 28px;
margin: 0;
padding: 0;
}
#nav ul { margin:0; list-style:none; padding: 0px 0 0 76px; }
#nav a, #nav strong, #nav span { float:left; display:block; color:#fff; padding: 5px 10px 5px 10px; background: #9e9e9e; text-decoration:none; font-weight: bold; }
#nav a { float:none; }
#nav li { float:left; color: #FFF; background: #9e9e9e; margin:0; padding:0 0 0 0px; }
#nav #current { float:left; background: #aeaeae; color: #FFF; }
#nav #current a { float:left; background: #aeaeae; padding:5px 10px 5px 10px; color:#FFF; }
#nav a:hover { float:left; color:#FFF; background: #aeaeae; }
#nav .padding { padding: 5px 0 0 10px; font-weight: bold; }
.main_content {
background: #FFF url(bg.jpg) repeat-y center bottom;
background-color: #FFF;
margin: 0 auto;
padding: 0px;
width: 886px;
}
.sd_left {
background-color: #FFF;
color: #000;
margin: 0 0 0px 80px;
padding: 0px 20px 0px 5px;
width: 500px;
}
.sd_right {
clear:both;
background-color: #FFF;
float: right;
color: #000;
margin: 0 90px 0 0;
padding: 0px 0px 0 15px;
width: 170px;
border-left: 1px dashed #ccc;
}
/* For IE... */
* html .sd_right {
clear:both;
background-color: #FFF;
float: right;
color: #000;
margin: 0 40px 0 0;
padding: 0px 0px 0 15px;
width: 170px;
border-left: 1px dashed #ccc;
}
.text_padding {
padding: 15px 0 0 0;
}
.main_content h2 {
background-color: #FFF;
padding: 5px 0 5px 0;
color: #46574D;
font: bold 1.6em Arial, sans-serif;
}
.date {
color: #46574D;
background: #FFFFFF;
text-align: right;
margin: 10px 0 5px 0;
padding: 0.4em 0 0 0;
border-top: 1px solid #eee;
}
input.button {
background: #FFFFF4;
color: #808080;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
.comments {
padding: 10px 10px 8px 10px;
margin: 0 0 7px 0;
background: #f8f8f8;
color: #000;
}
.commentsbox {
padding: 8px 0 10px 10px;
margin: 0 0 10px 0;
background: #f4f4f4;
color: #000;
}
.error {
color: #990000;
background-color: #FFF0F0;
padding: 7px;
margin-top: 5px;
margin-bottom: 10px;
border: 1px dashed #990000;
}
.error h2 {
color: #990000;
background: inherit;
}
.success {
color: #000000;
background: #F5FBE1;
padding: 7px;
margin-top: 5px;
margin-bottom: 5px;
border: 1px dashed #7BA813;
}
.success h2 {
color: #7BA813;
background: inherit;
}
.footer {
background: #000 url(footer.jpg) center no-repeat;
width: 886px;
height: 78px;
color:#555;
font-size:90%;
text-align:center;
clear:both;
}
.footer .padding {
padding: 40px 0 0 0;
}
</style>
</head>
<body>
<div class="content">
<div class="preheader">
<div class="padding"> <a href="http://www.free-css.com/">About</a> <a href="http://www.free-css.com/">Contact</a> </div>
</div>
<div class="header">
<div class="title">YOUR COMPANY NAME</div>
<div class="slogan">Your Best Slogan Here</div>
</div>
<div id="nav">
<ul>
<li><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/">Archive</a></li>
<li><a href="http://www.free-css.com/">Affiliates</a></li>
<li id="current"><a href="http://www.free-css.com/">About</a></li>
<li><a href="http://www.free-css.com/">Contact</a></li>
</ul>
</div>
<div class="main_content">
<div class="sd_right">
<div class="text_padding">
<h2>BinaryNews</h2>
sit amet consectetuer adipiscing elit. Donec libero. Suspendisse bibendum. Cras id urna. Morbi tincidunt, orci ac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Donec mattis, purus nec placerat bibendum, dui pede condimentum odio. <br />
<h2>Search</h2>
<form method="post" action="http://www.free-css.com/">
<p>
<input type="text" name="search" class="search" />
<input type="submit" value="Go" class="submit" />
</p>
</form>
<br />
<h2>Last Articles</h2>
<a href="http://www.free-css.com/">Link to a article</a><br />
<a href="http://www.free-css.com/">Link to another article...</a><br />
<br />
<h2>Links</h2>
<a href="http://www.free-css.com/">www.solucija.com</a><br />
<a href="http://www.free-css.com/">ww.free-css-templates.com</a><br />
</div>
</div>
<div class="sd_left">
<div class="text_padding">
<h2>About</h2>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec libero. Suspendisse bibendum. Cras id urna. Morbi tincidunt, orci ac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Donec mattis, purus nec placerat bibendum, dui pede condimentum odio, ac blandit ante orci ut diam. Cras fringilla magna. Phasellus suscipit, leo a pharetra condimentum, lorem tellus eleifend magna, eget fringilla velit magna id neque. Curabitur vel urna. In tristique orci porttitor ipsum. Aliquam ornare diam iaculis nibh. Proin luctus, velit pulvinar ullamcorper nonummy, mauris enim eleifend urna, congue egestas elit lectus eu est. Fusce et odio sit amet erat ullamcorper accumsan.Proin luctus, velit pulvinar ullamcorper nonummy, mauris enim eleifend urna, congue egestas elit lectus eu est. Fusce et odio sit amet erat ullamcorper accumsan.
<p class="date"><img src="binary-news-images/comment.gif" alt="" /> <a class="date" href="http://www.free-css.com/">Comments(2)</a> <img src="binary-news-images/timeicon.gif" alt="" /> 21.02.</p>
<br />
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi tincidunt, orci ac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Donec mattis, purus nec placerat bibendum, dui pede condimentum odio, ac blandit ante orci ut diam. Cras fringilla magna. Phasellus suscipit, leo a pharetra condimentum, lorem tellus eleifend magna, eget fringilla velit magna id neque. Curabitur vel urna. In tristique orci porttitor ipsum. Aliquam ornare diam iaculis nibh. Proin luctus, velit pulvinar ullamcorper nonummy, mauris enim eleifend urna, congue egestas elit lectus eu est. Fusce et odio sit amet erat ullamcorper accumsan.Proin luctus, velit pulvinar ullamcorper nonummy, mauris enim eleifend urna, congue egestas elit lectus eu est. Fusce et odio sit amet erat ullamcorper accumsan.
<p class="date"><img src="binary-news-images/comment.gif" alt="" /> <a class="date" href="http://www.free-css.com/">Comments(15)</a> <img src="binary-news-images/timeicon.gif" alt="" /> 13.01.</p>
<br />
</div>
</div>
<div class="footer">
<div class="padding"> Powered by <a href="http://snews.solucija.com" title="Single file CSS and XHTML valid CMS">sNews</a> | © Copyright BinaryNews Template :: Design: <a href="http://www.free-css-templates.com/" title="Free CSS Templates">David Herreman</a> | <a href="rss/">RSS Feed</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> and <a href="http://validator.w3.org/check?uri=referer">XHTML</a> | <a href="http://www.free-css.com/">Login</a> </div>
</div>
</div>
</div>
</body>
</html>
Related examples in the same category