# CSS Image overlap issue

**URL:** https://forum.kirupa.com/t/css-image-overlap-issue/223796
**Category:** web dev
**Created:** [April 25, 2007, 9:25pm UTC](https://forum.kirupa.com/t/css-image-overlap-issue/223796 "2007-04-25T21:25:57Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![nymyth](https://avatars.discourse-cdn.com/v4/letter/n/f08c70/32.png) [@nymyth](https://forum.kirupa.com/u/nymyth)
#### Post date: [April 25, 2007, 9:25pm UTC](https://forum.kirupa.com/t/css-image-overlap-issue/223796/1 "2007-04-25T21:25:57Z")

</div>

Im trying to overlap 2 images.

The css has this:

```auto

.imgHeader { position:relative; top: 0px; left: 0px; z-index: 1; }
.imgNews { position:relative; top: -42px; left: 0px; z-index: 2; }

```

The html has this:

```auto

<img class=imgHeader src="images/headerPics.jpg" height="42" width="100%" border="0">
<img class=imgNews src="images/newsItems.jpg" border="0">

```

Now the overlap works fine, however i have a big empty block underneath the images. When i do a select all i see that the empty block is part of the image that is on top. Anyone know why this is happening?

Cheers.