I have a fixed footer div and a content div. Content div is 100% height and I want it not to go through the footer, although I do not want to give percent value that is less than 100%.
<!-- fixed --><div id="footer" style="border:4px solid black;">
<div>
<!-- crosses the footer thus fails --><div id="content" style="border:4px solid blue;">
</div>
Here is a JSFiddle link: http://jsfiddle.net/TAVmF/2/
Bottom border of blue box should be on top of black box's border AND it should not cross it.
A result of the way I want it to be is next: http://i49.tinypic.com/2hs3mna.jpg
Thank you in advance.
Remove position:fixed
from footer and interchange the html code of container
and footer
divs.