css, jquery issue

I was playing with Info开发者_StackOverflow社区grid on my site. I added a header, a footer and added some text on the last block of iron man. As you can see the footer doesn't show up and the text of the last block is cut off. Now if you remove overflow:hidden; on the body, html the footer shows up but the text is still cut off. Any idea on how this the footer could show up without the scrollbar (so overflow:hidden; has to stay) and how to get the text of the last block to show up entirely? Thanks in advance and have fun :) wadada

It seems like you're taking the wrong approach.

First of all, the text of the last block is NOT cut off on Firefox... but it is completely dependent on the resolution of the browser.

Basically, your CSS is saying: I don't care if there's more content, don't scroll. Taking this control away from the user isn't a good idea.

I'm not trying to lecture here, but I'm just stating that by artificially limiting what your users can do, it doesn't allow for the thousands of different browsers and configurations your users have.

One way you can prevent content from getting cut off is by setting a max height on your dd elements. This way, the scroll bars only go on necessary elements.

.info-col dd {
   max-height:100px;
   overflow-y:auto;
   overflow-x:none;
}

This will NOT work in IE6, however...