cityscapesblog : City « Templates « HTML / CSS






cityscapesblog

    

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Cityscapesblog</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
/* CSS RESET */
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border:0;font-variant:normal;}sup {vertical-align:text-top;}sub {vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}legend{color:#000;}

body {font:13px/1.231 arial,helvetica,clean,sans-serif;}table{font-size:inherit;font-size:100%;}pre,code,kbd,samp,tt{font-family:monospace;line-height:100%;}
/* CSS RESET */



body {
  text-align:center;
  color:#6d6b6e
}
a {
  text-decoration:none;
  color:#000
}
a:hover {
  text-decoration: underline;
}
#wrap {
  width:900px;
  text-align:left;
  margin:0 auto;
}

.fl{ float:left}
.fr{ float:right}
.clearfix{ clear:both}



/* header */
#header { background:url(cityscapesblog-images/hd.jpg); height:273px; position:relative}
#header h1 {font-size:40px; font-weight:700; position:absolute; left:70px; top:20px;color:#fff}
.sc{background:url(cityscapesblog-images/s.gif) no-repeat;height:38px;  width:230px; position:absolute; right:70px; top:20px}
.q { border:#1D7E9F 1px solid;width:165px; height:25px; position: absolute; top:8px; right:55px; background:#1D7E9F }
.submit {background:url(cityscapesblog-images/go.gif) no-repeat; height:39px; width:39px; border:0; position: absolute; top:0px; right:5px; }

#header li{ float:left; padding:0 6px; line-height:1.9em }
#header ul{  position:absolute; right:30px; top:232px; font-size:11px;border: #0099CC solid; border-width:3px 0}
#header li a:hover { background:#0099CC; text-decoration:none}
/* content */
#content {}
.side {background:url(cityscapesblog-images/left.jpg) no-repeat; width:451px;}
.sinner {width:250px; margin:200px 0 0 150px; font-size:11px}
.main {background:#F4F5EE; }
.main h2 {font-size:34px; text-align:right; font-weight:700; margin:20px 0}
.mainin { padding:20px; width:409px;}
#bg{ background:url(cityscapesblog-images/bg.jpg)}

#bg,.main {
  padding-bottom:300px;
  margin-bottom:-300px;
}
#copyright{ width:250px; height:50px; padding:100px 0 0 150px;}
#content  {
  overflow:hidden;
}

/* footer */
#copyright {font-size:11px;}


</style>


</head>
<body>
<div id="wrap">
  <div id="header">
    <h1>CITYSCAPESBLOG</h1>
    <div class="sc">
      <form action="http://www.free-css.com/" method="post" id="sc">
        <input type="text" name="q" id="q"  value="" class="q"/>
        <input type="submit" name="submit" id="submit"  value="" class="submit"/>
      </form>
    </div>
    <ul id="nav">
      <li class="first"><a href="http://www.free-css.com/">HOME</a></li>
      <li><a href="http://www.free-css.com/">CONTACT</a></li>
      <li><a href="http://www.free-css.com/">ABOUT</a></li>
      <li><a href="http://www.free-css.com/">COMMENT</a></li>
    </ul>
  </div>
  <div id="content">
    <div class="main fr">
      <div class="mainin">
        <h2>Lorem Ipsum</h2>
        <p>CITYSCAPESBLOG is a CSS template that is free and fully standards compliant. Free CSS Templates designed this template. </p>
        <p> This template is allowed for all uses, including commercial use, as it is released under the Creative Commons Attributions 2.5 license. The only stipulation to the use of this free template is that the links appearing in the footer remain intact. Beyond that, simply enjoy and have fun with it!</p>
        <h2>Lorem Ipsum</h2>
        <p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse pretium commodo lorem. Cras gravida, mauris pellentesque aliquet posuere, sapien eros interdum orci, et sagittis sem dolor eu est. Curabitur et urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Mauris laoreet egestas tortor. Donec sit amet ante sit amet velit bibendum interdum. Curabitur vitae enim. Curabitur sapien. Nullam sit amet urna ac velit tincidunt dapibus. Maecenas iaculis, orci eu hendrerit vehicula, turpis nunc vestibulum velit, quis tristique pede mauris eu arcu. Morbi fringilla, orci malesuada lobortis sollicitudin, magna odio interdum sem, sit amet ultricies metus dolor non nunc. In odio tortor, suscipit sit amet, placerat vel, vulputate nec, turpis. Morbi dictum nibh in est. Proin luctus malesuada odio. Praesent ut ipsum a nibh lobortis semper. </p>
      </div>
    </div>
    <div class="side fl">
      <div class="sinner">
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque porta. Aliquam mi. Nulla vitae elit. Vivamus imperdiet, nulla et interdum pulvinar, mauris felis vulputate velit, eget tempus nulla felis id sapien. Duis imperdiet erat eget ligula. Maecenas ultricies velit. Vivamus auctor. Nulla ullamcorper, tortor in ultricies congue, eros massa pharetra felis, vitae tempus magna dolor sed eros. Aliquam erat volutpat. Integer id mi. </p>
      </div>
      <div id="bg">
        <p id="copyright"> 2008. All Rights Reserved. <br/>
          Designed by <a href="http://www.free-css-templates.com/">Free CSS Templates</a>, Thanks to <a href="http://www.dubaiapartments.biz/">Dubai Apartments</a></p>
      </div>
    </div>
  </div>
</div>
</body>
</html>

   
    
    
    
  








Related examples in the same category

1.metamorph_city
2.metamorph_citylights
3.busycity
4.city-night
5.city 2
6.citylights
7.citynightlife
8.cityrhythm
9.cityscape
10.simplicity
11.wildcity