Page 1 of 1

[SOLVED] CSS min-height:100% cut at half the page

Posted: Wed Sep 28, 2011 5:37 am
by LuaMadman
I'm working on a new part of the company site.
The company runs a webshop with Magento.
The new page should have the same design as the webshop.
So I created the index, head and foot php's i wanted, and then i created a cloned.css.
Checked webshop soruce, and found that is uses .wrapper .page and .padding to create the base page.
So i copied it to my page.
However, the .wrapper part ends at the middle of the page.
But the .page and .padding continues to the bottom.

EDIT: Links removed.

As commented in css. using heigt: 1600; insted of min-height works, but the height is gonna be dynamic...

Re: CSS min-height:100% cut at half the page

Posted: Wed Sep 28, 2011 6:49 am
by LuaMadman
Solved it myself! =)
I changed the wrapper from:

Code: Select all

.wrapper { background:url("../img/bg.png") repeat-y top center; width:980px; margin:0px auto;
	min-height: 100%;
}
to:

Code: Select all

.wrapper { background:url("../img/bg.png") repeat-y top center; width:980px; margin:0px auto;
	min-height: 100%;
overflow: hidden;
}
So just adding overflow: hidden; did the trick