Overflow hidden on body tag

HTML & CSS
1

I have a weird thing going in this test page. There should be 3 columns. It works basically fine when I have overflow: hidden on the body tag (don’t ask me why). When I take the overflow out, it shows as you now see it in the example! Can someone tell me why?

Thank you in advance

2

remove height 100% from the wrapper.

3

I just took that off but it didn’t change a thing as you will see in the example page

4

It’s not really clear what you are aiming for here. There isn’t enough room for three columns at the moment. You’d have to modify the width setting to allow for three columns:

#content {
[COLOR="#FF0000"]width: 70%;[/COLOR]
margin: 3% 2% 0;
float: left;
}
5

Hi Ralph. It should be enough width. I just added the overflow hidden back as a property on the body and voila three columns.

6

Well, two columns for me. There is nowhere near enough room there in the Content div for three columns. What browser are you using?

7

Hi Ralph. I have seen it in Firefox, Chrome and IE9. And like I said I only see it as I have planned when I have the property overflow: hidden on the body tag. What should I do. I could work with pixels instead but I would like to have the design responsive or should I use a combined sollution?.

Thank you in advance

Edit: I have changed the width for the list_items to a percentage as well (33%) and now it seems to work, at least for me