2 replies [Last post]
Boxkites
Boxkites's picture
Offline
newbie
New Zealand
Last seen: 1 year 24 weeks ago
New Zealand
Timezone: GMT+12
Joined: 2009-12-25
Posts: 9
Points: 12

Ok I have a basic page and I let others place events on that page.
Now in my CSS file the div container holding the info is set to 900px high.

#Body_Container {
		margin-left:15px;
		width:98%;
		min-height: 900px;
	             }

That is to make sure the page without events still has the right height. Simple, right?
Now here comes the problem,
When more events are entered through the CMS system I use, and the height of the events div is taller than 900px, it runs off the page, downwards.
Exceeding the footer.
See image below. Any help would be appreciated.

Cheers

CssError1_0.png

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 9 hours 3 min ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9276
Points: 3282

Forgot we need the whole enchilada, did ya?

The problem doesn't lie with body's min-height. I will take a guess that the left column is a float or positioned absolute. In the first case, make the float column's parent {overflow: hidden;}. See enclosing float elements. If it is the latter, hold your nose, because you're going under. That's an inappropriate use of the position property.

cheers,

gary

UI design should be egoless; if you succumb to the temptation to show off, you’re probably doing it wrong. (from ESR)

There are enough html & css demos and tutorials to be interesting. Please visit.

Boxkites
Boxkites's picture
Offline
newbie
New Zealand
Last seen: 1 year 24 weeks ago
New Zealand
Timezone: GMT+12
Joined: 2009-12-25
Posts: 9
Points: 12

Thanks for that, it seems to

Cool Thanks for that, it seems to have solved it.
I placed overflow: hidden; into the parent body div and yes the child div was floating left. Wink Good guess there. Like I said, an old dog learning new tricks.

#Body_Container {
		margin-left:15px;
		width:98%;
		min-height: 900px;
		overflow: hidden;
				 }
.Cms_Index_Container{
		float:left;
		width:50%;
		}

Anyway thanks again gary.turner