Background position

HTML & CSS
1

Hi all, I have a listing page and I would like to divide the listing items with a background image in the left bottom corner of each item. But whatever I try the background image appears at approx 85% of the top instead of at 100%. Here are mine CSS and HTML:


* {/* For testing only */
	margin: 0;
	padding: 0;
	list-style: 0;
}

.content {
	width: 585px;
	margin: 50px auto 0;
	overflow: hidden;
}

.content .listing {
	width: 585px;
	height: 80px;
	margin: 0 0 5px;
	background: url(images/site/listing.png) 0 100% no-repeat;
	overflow: hidden;
}

.content .listing img {
	width: 100px;
	height: 75px;
	margin-right: 15px;
	float: left;	
}

.content .listing .listing_details {
	width: 470px;
	float: left;
}

.content .listing .listing_details li {
  width: 100%;
	display: block;	
}

.content .listing .listing_details li p {
  margin:0 !important;
	line-height: 1;
}



<div class="content">
	<div class="listing">
		<img src="package_photos/thumbnails/tour1.jpg" alt="" />
    <ul class="listing_details">
    	<li>
				<p><strong>Pilgrimage Excursion to Holy Sites & Mt Sinai, Cairo
CAIRO</strong></p>
				<p>Air Travel</p>
        <p>4 Days</p>
    	</li>
    </ul>
  </div>

	<div class="listing">
		<img src="package_photos/thumbnails/tour2.jpg" alt="" />
    <ul class="listing_details">
    	<li>
				<p><strong>Pilgrimage Excursion to Holy Sites & Mt Sinai, Cairo
CAIRO</strong></p>
				<p>Air Travel</p>
        <p>4 Days</p>
    	</li>
    </ul>
  </div>

</div>

Does anyone see what I’m doing wrong? Thank you in advance.

2

You aren’t giving us a live link. :stuck_out_tongue:

The CSS looks ok to me, but it would be much easier with a live link.