I'm having some problems regarding the positioning issue on CSS. Take a look at my skin that is being developed:


You should see the table where the main resources are listed right below the page, as you scroll down though you'll see that this DIV will truncate the remaining content DIV. What I wanted to know is how can I make this DIV stop doing this? I want the DIV to act like a frame (But I don't want it to be a frame), I don't want it to truncate the content the way it does, how would I go on about doing this?

CSS for DIV:

#resource {
	width: 100%;
	height: 60px;
	padding: 10px 0;
	background: #fff url("images/resource_strip.gif") repeat-x top;
	text-indent: -999em;
	bottom: 0;
	position: fixed;