realestate
<!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>Real Estate</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
body {
font-family: helvetica, arial, sans-serif;
font-size: 11px;
text-align: center;
color: #ebeaea;
}
html, body, #wrapper, h1 {
margin: 0;
padding: 0;
}
th, td {
font-size: 11px;
}
img { border: 0; }
#wrapper {
margin: auto;
text-align: left;
width: 702px;
position: relative;
}
h1, h2, h3 {
font-size: 11px;
}
h1 {
margin: 0;
padding: 0;
}
h2 {
margin: 0 0 5px 0;
padding: 0;
}
h3 {
padding: 4px 0 0 0;
}
p {
margin: 1em 0;
padding: 0;
}
a {
color: #fff;
font-weight: bold;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
.block {
display: block;
}
.clear {
clear: both;
border-top: 1px solid white;
padding: 0;
margin: 0;
}
.left {
float: left;
margin: 1px 8px 0px 4px;
}
.softright {
text-align: right;
}
.readmore {
text-align: right;
}
/* ***** */
body {
background: #4d662c;
}
#wrapper {
background: #375114 url(realestate-images/body_bg.gif) repeat-y;
}
h1 {
margin: 0 1px;
background: #607c3c;
border-bottom: 1px solid #fff;
position: relative;
}
#topnav {
position: absolute;
top: 0px;
left: 560px;
font-size: 1px;
}
#bigphoto {
position: absolute;
top: 45px;
left: 1px;
}
#nav {
position: absolute;
top: 45px;
left: 326px;
margin: 0;
padding: 0;
width: 162px;
}
* html #nav {
left: 323px;
lef\t: 326px;
}
#nav li {
margin: 0;
padding: 0;
list-style: none;
}
#nav img {
display: block;
}
* html #nav img {
float: left;
}
#homesearchtitle {
position: absolute;
top: 261px;
left: 1px;
}
#titlelatest {
position: absolute;
top: 45px;
left: 489px;
}
#leftcol {
float: left;
width: 324px;
margin-left: 1px;
display: inline;
}
#searchbox {
background: #607c3c;
padding-top: 240px;
}
#searchbox form {
padding: 8px 0px 20px 35px;
margin: 0;
}
#searchbox table {
margin: 0;
}
#searchbox th {
text-align: right;
font-weight: normal;
}
#searchbox .submitrow {
text-align: right;
}
.topped {
border-top: 1px solid white;
}
#special p {
padding-right: 1em;
}
#special h2 {
padding-bottom: 5px;
}
#houses {
width: 162px;
float: left;
padding-top: 127px;
margin-left: 1px;
display: inline;
}
#houses div {
background-repeat: no-repeat;
padding: 8px 0 3px 33px;
margin: 0 0 5px 0;
}
#houses p {
margin: 5px 0 2px 27px;
padding: 0 0 0 18px;
}
#houses p.gallery {
background: url(realestate-images/ico_search.gif) left center no-repeat;
}
#houses p.buy {
background: url(realestate-images/ico_buy.gif) left center no-repeat;
}
#news {
float: right;
width: 178px;
margin: 0 17px 0 0;
padding: 30px 0 0 0;
font-size: 10px;
display: inline;
}
#news h3 {
color: #162206;
margin: 1em 0;
padding: 0;
}
#footer {
background: #375114;
border-bottom: 1px solid white;
margin: 0 1px;
padding: 6px 16px;
}
* html #footer {
padding-top: 3px;
}
#footer p {
margin: 0;
padding: 0;
position:relative;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="inner">
<h1><a href="http://www.free-css.com/"><img src="realestate-images/logo.gif" width="122" height="44" alt="The Real Estate" /></a></h1>
<div id="topnav"> <a href="http://www.free-css.com/"><img src="realestate-images/header_nav_1.gif" width="50" height="44" alt="home" /></a> <a href="http://www.free-css.com/"><img src="realestate-images/header_nav_2.gif" width="53" height="44" alt="contact" /></a> </div>
<!-- end topnav -->
<img src="realestate-images/big_photo.jpg" width="325" height="216" alt="big photo" id="bigphoto" />
<ul id="nav">
<li><a href="http://www.free-css.com/"><img src="realestate-images/menu_1.gif" width="162" height="22" alt="menu 1" /></a></li>
<li><a href="http://www.free-css.com/"><img src="realestate-images/menu_2.gif" width="162" height="22" alt="menu 2" /></a></li>
<li><a href="http://www.free-css.com/"><img src="realestate-images/menu_3.gif" width="162" height="22" alt="menu 2" /></a></li>
<li><a href="http://www.free-css.com/"><img src="realestate-images/menu_4.gif" width="162" height="22" alt="menu 2" /></a></li>
<li><a href="http://www.free-css.com/"><img src="realestate-images/menu_5.gif" width="162" height="22" alt="menu 2" /></a></li>
<li><a href="http://www.free-css.com/"><img src="realestate-images/menu_6.gif" width="162" height="22" alt="menu 2" /></a></li>
</ul>
<h2><img src="realestate-images/title_search.gif" width="325" height="24" alt="search for your dream home" id="homesearchtitle" /></h2>
<div id="leftcol">
<div id="searchbox">
<form action="#" method="get" >
<table summary="Search form" cellspacing="1" cellpadding="3">
<tr>
<th>City:</th>
<td colspan="3"><input type="text" class="text" name="city" /></td>
</tr>
<tr>
<th>Area:</th>
<td colspan="3"><input type="text" class="text" name="area" /></td>
</tr>
<tr>
<th>Price Range:</th>
<td colspan="3"><select name="pricerange">
<option value="banda">$10,000 - $20,000</option>
<option value="bandb">$20,000 - $50,000</option>
<option value="bandc">$50,000 - $100,000</option>
<option value="bandd">$100,000 - $200,000</option>
<option value="bandd">$500,000 - $1,000,000</option>
<option value="bandd">$1,000,000+</option>
</select>
</td>
</tr>
<tr>
<th>Bedrooms:</th>
<td><select name="bedrooms">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5+</option>
</select>
</td>
<th>Bathrooms:</th>
<td><select name="bedrooms">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5+</option>
</select>
</td>
</tr>
<tr>
<td colspan="4" class="submitrow"><input type="submit" value="Find your Real Estate" /></td>
</tr>
</table>
</form>
</div>
<!-- end searchbox -->
<div id="special">
<h2 class="topped"><img src="realestate-images/title_special.gif" width="144" height="24" alt="special offer: 30% off" /></h2>
<img src="realestate-images/house_1.jpg" width="85" height="64" alt="house 1" class="left" />
<p>This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text.</p>
<p class="readmore"><a href="http://www.free-css.com/">Read More</a></p>
</div>
<!-- end special -->
</div>
<!-- end leftcol -->
<h2><img src="realestate-images/title_latest_news_and_event.gif" width="212" height="22" alt="latest news and events" id="titlelatest" /></h2>
<div id="news">
<h3>June 11, 2005</h3>
<p>This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original.</p>
<p class="readmore"><a href="http://www.free-css.com/">Read More</a></p>
<h3>June 12, 2005</h3>
<p>This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original.</p>
<img src="realestate-images/house_5.jpg" width="178" height="100" alt="house 5" />
<p>This is a demo text. It will be replaced by the original. This is a demo text. </p>
<p class="readmore"><a href="http://www.free-css.com/">Read More</a></p>
<h3>June 11, 2005</h3>
<p>This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original.</p>
<p class="readmore"><a href="http://www.free-css.com/">Read More</a></p>
</div>
<!-- end news -->
<div id="houses">
<div style="background-image: url(realestate-images/title_home_1.gif)"> <a href="http://www.free-css.com/"><img src="realestate-images/house_2.jpg" width="122" height="82" alt="house 1" /></a>
<p class="gallery"><a href="http://www.free-css.com/">View Gallery</a></p>
<p class="buy"><a href="http://www.free-css.com/">Buy Now</a></p>
</div>
<!-- end wooden -->
<div style="background-image: url(realestate-images/title_home_2.gif)" class="topped"> <a href="http://www.free-css.com/"><img src="realestate-images/house_3.jpg" width="122" height="82" alt="house 2" /></a>
<p class="gallery"><a href="http://www.free-css.com/">View Gallery</a></p>
<p class="buy"><a href="http://www.free-css.com/">Buy Now</a></p>
</div>
<!-- end wooden -->
<div style="background-image: url(realestate-images/title_home_3.gif)" class="topped"> <a href="http://www.free-css.com/"><img src="realestate-images/house_4.jpg" width="122" height="82" alt="house 3" /></a>
<p class="gallery"><a href="http://www.free-css.com/">View Gallery</a></p>
<p class="buy"><a href="http://www.free-css.com/">Buy Now</a></p>
</div>
<!-- end wooden -->
</div>
<!-- end houses -->
<div class="clear" id="footer">
<p align="center">Powered by <a href="http://www.freewebsitetemplates.com">Free Website Templates</a></p>
</div>
</div>
<!-- end inner -->
</div>
<!-- end wrapper -->
</body>
</html>
Related examples in the same category