CarCar
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Car</title>
<style type='text/css'>
*{font-family:Arial, Helvetica, sans-serif; font-size:12px}
body
{
padding:0 0 0 0;
margin:0 0 0 0;
background:url(images/body-background.jpg) repeat-x 0 0;
height:217px;
}
h1
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
color:#f1f1f1;
padding:0 0 0 0;
margin:0;
text-align:center;
padding:12px 23px 41px 0;
text-transform:uppercase;
}
h2
{
font-size:14px;
font-weight:bold;
color:#C00000;
background-color:#ffffff;
padding:0 0 0 0;
margin:30px 0 18px 0;
}
ul
{
list-style-type:none;
padding:0 14px 0 34px;
margin:0 0 0 0;
}
li.bullets
{
list-style-type:none;
background-image:url(images/bullets.gif);
background-repeat:no-repeat;
background-position:0 50%;
padding:2px 20px 2px 20px;
}
a
{
padding:0;
margin:0;
}
#div-wrapper
{
width:778px;
height:auto;
margin:0 auto 0 auto;
padding:0;
}
p
{
margin:0 0 0 0;
}
.body-text
{
color:#666464;
background-color:#ffffff;
}
form
{
margin:0 0 0 0;
color:#666464;
background-color:#ffffff;
border:1px solid #F1F1EE;
}
.form-leftpart
{
width:160px;
padding-top:16px;
padding-right:15px;
padding-bottom:16px;
/*text-align:right;*/
height:auto;
float:left;
}
.form-rightpart
{
width:225px;
padding-top:16px;
padding-bottom:16px;
height:auto;
float:right;
}
.input-box
{
color:#666464;
background-color:#ffffff;
border:1px solid #666464;
width:150px;
}
.budget
{
color:#666464;
background-color:#ffffff;
border:1px solid #666464;
width:70px;
}
.submit
{
color:#666464;
background-color:#ffffff;
border:1px solid #666464;
width:70px;
height:20px;
}
/*________________________________________________________Left Div_____________________________________________*/
#left-div-wrapper
{
width:345px;
height:auto;
float:left;
}
.logo
{
padding-top:29px;
padding-left:49px;
}
.menu
{
font-size:12px;
font-weight:bold;
color:#ffffff;
background-color:#541015;
}
.menu a
{
font-size:12px;
font-weight:bold;
text-decoration:none;
color:#ffffff;
background-color:#541015;
}
.menu a:hover{
color:#666464;
}
.divider
{
padding-left:5px;
padding-right:5px;
}
.universal-padding-top
{
padding-right:23px;
}
.universal-padding-right
{
padding-right:14px;
}
.universal-padding-left
{
padding-left:14px;
}
.line-spacer
{
padding-top:5px;
padding-bottom:5px;
}
/*____________________________________________________Right Div Wrapper_____________________________________*/
#right-div-wrapper
{
width:433px;
height:auto;
float:right;
}
.search-div
{
width:405px;
height:auto;
border:1px solid #C6C5C5;
margin:13px;
}
.best-selling-menu
{
width:405px;
height:auto;
margin-left:7px;
margin-right:7px;
color:#000000;
background-color:#EFEAEA;
padding-top:11px;
padding-bottom:10px;
float:left;
}
.model
{
font-weight:bold;
padding-left:14px;
}
.gallery-image
{
width:145px;
height:auto;
color:#666464;
background-color:#ffffff;
padding-top:15px;
padding-bottom:15px;
float:left;
}
.gallery-text
{
width:273px;
height:auto;
color:#666464;
background-color:#ffffff;
padding-top:11px;
padding-bottom:10px;
float:left;
}
/*_______________________________________________________footer________________________________________________*/
.footer
{
width:755px;
height:50px;
float:left;
text-align:right;
margin-top:75px;
}
.footer p.tk
{
font:bold 10px Arial, Helvetica, sans-serif;
color:#000;
text-transform:uppercase;
margin:5px 0 0 0;
}
.footer p.tk a
{
font:bold 10px Arial, Helvetica, sans-serif;
color:#00408B;
text-transform:uppercase;
text-decoration:underline;
}
.footer p.tk a:hover
{
text-decoration:none;
}
</style>
</head>
<body>
<div id="div-wrapper">
<!-- ____________________________________________________Left div wrapper_________________________________ -->
<div id="left-div-wrapper">
<a href="index.html"><img src="images/logo.gif" alt="Car world" width="220" height="100" border="0" class="logo" title="Car world" /></a>
<h1>Company Slogan Goes Here</h1>
<p class="menu universal-padding-left" >
<a href="#" title="Home">Home</a> <span class="divider">|</span>
<a href="#" title="News">News</a> <span class="divider">|</span>
<a href="#" title="Racing">Racing</a> <span class="divider">|</span>
<a href="#" title="Car">Cars</a> <span class="divider">|</span>
<a href="#" title="Corporate""> Corporate</a></p>
<h2 class="universal-padding-left">Welcome to online Car Selling Company</h2>
<p class="body-text universal-padding-left universal-padding-right">
This is Car, a free, fully standards-compliant CSS template designed by <a href="http://www.free-css-templates.com/">Free CSS Templates</a>.
<br /> This free template is released under a Creative Commons Attributions 2.5 license, so you're pretty much free to do whatever you want with it (even use it commercially) provided you keep the links in the footer intact. Aside from that, have fun with it :)
</p>
<h2 class="universal-padding-left">News and Updates</h2>
<p class="universal-padding-left body-text"><img src="images/news-update-image.jpg" /><br /><br />
<strong>Nunc non justo. Mauris</strong> arcu lorem, convallis vitae, sagittis sed, porttitor eu, </p>
<br />
<ul>
<li class="bullets"><a href="#">nisi. Suspendisse fringilla</a> </li>
<li class="bullets"><a href="#">porttitor tortor. Vivamus ac</a></li>
<li class="bullets"><a href="#">urna quis felis venenatis adipiscing.</a></li>
<li class="bullets"><a href="#">Class aptent taciti sociosqu</a></li>
<li class="bullets"><a href="#">torquent per conubia nostra</a></li>
<li class="bullets"><a href="#">per inceptos hymenaeos.</a></li>
</ul>
<h2 class="universal-padding-left">Other Importent Links</h2>
<ul>
<li class="bullets"><a href="#">Buy New Car </a> </li>
<li class="bullets"><a href="#">Buy Used Car</a></li>
<li class="bullets"><a href="#">Sell Your Car</a></li>
<li class="bullets"><a href="#">Car Research</a></li>
<li class="bullets"><a href="#">Detailed Car Reviews</a></li>
<li class="bullets"><a href="#">Road Tests</a></li>
<li class="bullets"><a href="#">Technical Specs</a></li>
<li class="bullets"><a href="#">Standard Equipment</a></li>
<li class="bullets"><a href="#">Owner's Feedback</a></li>
<li class="bullets"><a href="#">Photo Gallery</a></li>
</ul><br />
<p class="body-text universal-padding-left universal-padding-right"><strong>Nunc non justo. Mauris</strong> arcu lorem, convallis vitae, sagittis sed, porttitor eu, </p>
</div>
<!-- ____________________________________________________Right div wrapper_________________________________ -->
<div id="right-div-wrapper">
<img src="images/banner-image.jpg" alt="banner" width="419" height="217" />
<h2 class="universal-padding-left">Search a Car</h2>
<div class="search-div">
<form name="frm1" action="#" method="post" class="form-input">
<table width="100%" cellspacing="0" cellpadding="0">
<tr class="li">
<td width="47%" align="right" valign="top" class="line-spacer">Select Manufacturer : </td>
<td width="53%" class="line-spacer">
<select name="select" class="input-box">
<option>Demo Manufacturer 1</option>
<option>Demo Manufacturer 2</option>
<option>Demo Manufacturer 3</option>
<option>Demo Manufacturer 4</option>
<option>Demo Manufacturer 5</option>
</select>
</td>
</tr>
<tr>
<td align="right" valign="top" class="line-spacer">Select a Category : <br /></td>
<td class="line-spacer"><select name="select2" class="input-box">
<option>Demo category 1</option>
<option>Demo category 2</option>
<option>Demo category 3</option>
<option>Demo category 4</option>
<option>Demo category 5</option>
</select></td>
</tr>
<tr>
<td align="right" valign="top" class="line-spacer">Budget : </td>
<td class="line-spacer"><input name="textfield" type="text" class="budget" /> To <input name="textfield2" type="text" class="budget" /></td>
</tr>
<tr>
<td align="right" valign="top" class="line-spacer"><input name="Submit" type="submit" class="submit" value="Submit" /></td>
<td class="line-spacer"> </td>
</tr>
</table>
</form>
</div>
<h2 class="universal-padding-left">Best Selling Cars</h2>
<div class="best-selling-menu"><p class="model">Model : mlx0001</p></div>
<div class="gallery-image"><p class="model"><img src="images/car-1.jpg" alt="car 1" width="103" height="66" /></p></div>
<div class="gallery-text"><strong>Nunc non justo. Mauris</strong> arcu lorem, convallis vitae, sagittis sed, porttitor eu, nisi.natis adipiscing.<br /><br /><p><a href="#">More about this Model</a> | <a href="#">Buy Now</a></p></div>
<div class="best-selling-menu"><p class="model">Model : mlx0002</p></div>
<div class="gallery-image"><p class="model"><img src="images/car-2.jpg" alt="car 1" width="115" height="69" /></p>
</div>
<div class="gallery-text"><strong>Nunc non justo. Mauris</strong> arcu lorem, convallis vitae, sagittis sed, porttitor eu, nisi.natis adipiscing.<br /><br /><p><a href="#">More about this Model</a> | <a href="#">Buy Now</a></p></div>
<div class="best-selling-menu"><p class="model">Model : mlx0003</p></div>
<div class="gallery-image"><p class="model"><img src="images/car-3.jpg" width="119" height="54" /></p></div>
<div class="gallery-text"><strong>Nunc non justo. Mauris</strong> arcu lorem, convallis vitae, sagittis sed, porttitor eu, nisi.natis adipiscing.<br /><br /><p><a href="#">More about this Model</a> | <a href="#">Buy Now</a></p></div>
<div class="best-selling-menu"><p class="model">Model : mlx0004</p></div>
<div class="gallery-image"><p class="model"><img src="images/car-1.jpg" alt="car 4" width="103" height="66" /></p></div>
<div class="gallery-text"><strong>Nunc non justo. Mauris</strong> arcu lorem, convallis vitae, sagittis sed, porttitor eu, nisi.natis adipiscing.<br /><br /><p><a href="#">More about this Model</a> | <a href="#">Buy Now</a></p></div>
</div>
<div class="footer universal-padding-left"><p>Copyright @ 2006, <a href="#">www.carworld.com</a>, all rights reserved.
</p>
<p class="tk"><a href="http://www.templatesold.com/" target="_blank">Website Templates</a> by <a href="http://www.free-css-templates.com/" target="_blank">Free CSS Templates</a></p>
</div>
</div>
</body>
</html>
Related examples in the same category