how to fix abolute position and z-index issue with IE7 ?

IE7 renders some abosulte positioned divs incorrectly … for instance the absolute positioned div “item-content” doesn’t overlap the image .It comes below the image and gets invisible . While it works properly in IE8 .

This is the code :

#content .item {
		position: relative;
		background: url(library/images/no-image.jpg) no-repeat center center #fff;
		height: 250px;
		margin-bottom: 2%;
		overflow: hidden;
		box-shadow: 0 0 5px #dedede;
		border: 1px solid #fff;

	}

	#content .item-content {
			width: 100%;
			position: absolute;
			bottom: 0;
			word-wrap: break-word;
		}

	#content .item-content header {
				position: relative;
				width: 100%;
				z-index: 3;

	#content .item-content h2{
				background: url(library/images/trans.png);

				}

	#content .item img{
			position: relative;
			height: 200px;
			width:187px;
			z-index: 0;
			text-align: center;
		}

	<div class="item">

		<div class="item-content">
            <header>
                <h2 class="entry-title"> The title which should overlaps the image, comes behind it </h2>
            </header>
		</div>

			<img src="thumb.jpg">  This image displayed over the item-content in ie7

	</div>

how can I fix this with IE7…
thanks