Mysterious blank space?

9three · 04-28-2009, 09:22 PM

Hey,

I'm having an issue where extra space is added to my background image.

http://i261.photobucket.com/albums/i...05/example.jpg

I don't know why, I did not set a margin or padding to the lower part.

HTML:

Code:

<div class="pollframe">
      <img src="images/pollTop.jpg" width="225" height="19" />
        <div class="content">
        Poll
        </div>
        <img src="images/pollBottom.jpg" width="225" height="3" />
      </div>

CSS

Code:

#misc .pollframe
{
  width: 225px;
  margin: 0px;
  padding: 0px;
  background: url(../images/pollFrame.jpg) repeat-y;
}

#misc .content
{
  width: 215px;
  height: 100px;
  margin: 0px 0px 0px 2px;
  padding: 20px;
  color: #5e5e5e;
  background: url(../images/pollBG.jpg) no-repeat;
}

Also, if you notice the background of pollframe continues a little further down by about 2 pixels. I don't know why as there is no space for it to continue, the DIV ends where the image is.

I removed the height in .content and this was the out come:

http://i261.photobucket.com/albums/i...andez305/2.jpg
Anyone, please? :)