Full Featured
Ciudad Quesada
- 382,000 €
- £ 263,619
- VILLA
- 3 Bedrooms
- 1250 sq.ft.
- New
Ciudad Quesada
- 382,000 €
- £ 263,619
- VILLA
- 3 Bedrooms
- 1250 sq.ft.
- New
Lite weight
Ciudad Quesada
- 382,000 €
- £ 263,619
- VILLA
- 3 Bedrooms
- 1250 sq.ft.
- New
The Markup
<div class="result">
<h4>Ciudad Quesada</h4>
<a href="#"><img src="http://www.fiftyfoureleven.com/challenge-1.jpg" alt=""/></a>
<ul>
<li class="euros">382,000 €</li>
<li class="pounds">£ 263,619</li>
<li class="type">VILLA</li>
<li class="bedrooms">3 Bedrooms</li>
<li class="size">1250 sq.ft.</li>
<li>New</li>
</ul>
<div><a class="go" href="#">View more details</a><br />
<a class="go" href="#">Request information</a></div>
</div>
The CSS
div.result{
font:16px Verdana,Arial,Helvetica,sans-serif;
background:#F6FAFD;
border-bottom:1px solid #425D80;
border-top:1px solid #425D80;
height:95px;
margin:10px 5px 0 5px;
padding:3px 3px 0 3px;
position:relative;
width:506px;
}
div.result ul,div.result ul li{
font-size:0.9em;
font-weight:bold;
list-style:none;
margin:0;
padding:0;
}
div.result h4{
color:#374F6A;
font-size:1em;
left:129px;
margin:0;
padding:0;
position:absolute;
top:4px;
}
div.result img{
border:1px solid #425D80;
float:left;
height:90px;
margin:0 3px 3px 0;
width:120px;
}
div.result img a{
background:red;
display:block;
height:90px;
}
li.euros{
float:right;
margin-top:-4px;/* for IE */
}
html>body li.euros{
margin-top:-20px;/* for Modern Browsers */
}
.pounds,#result div a.go:link,#result div a.go:visited{
clear:right;/* Need #result specificity here or else these att's run into the #listing .go links */
float:right;
}
.type{
margin-top:22px !important;/*font-size:1.1em !important;*/
}
.result div{
bottom:3px;
position:absolute;
right:0;
}
a.go:link,a.go:visited{
background:#DFECF5 url(arrowA.gif) no-repeat right;
border:1px solid #DFECF5;
font-size:0.9em;
font-weight:bold !important;
margin:0 2px 2px;
padding:1px 33px 1px 2px;
text-decoration:underline;
clear:right;
float:right;
}
a.go:visited{
color:purple;
font-weight:normal !important;
}
.result div a.go:hover{
background:#F7FAFC url(arrowA.gif) no-repeat 101%;
border:1px solid #425D80;
text-decoration:none;
}