Hello,
I am trying to find a way to do the following.

I have included some code (link below) of the basic layout for the
question at hand showing two examples of content amount possible.

The Goal:
When someone lands on the page there are 3 containers in a row. All
three containers are of equal height regardless of the amount of
content in them.

If there is more content then can fit in the given height of a
container, a “…more…” link is added. When the “…more…” link is clicked
on, the container expands to display the full content.
The “…more…” link only displays when needed.

The three containers always start out with a set height, say 400px,
regardless of what the amount of content might be. So every time a
person lands on this page the three containers always have the start
height of 400px.

In other words it is not to behave like an “equal height” based on the
largest of the containers.

To summarize:
- minimum height at all times (all containers are at least 400px tall
at all times)
- a start height of 400px for all containers regardless of content
amount
- if the content amount is more than the start height (overflow?) then
a “…more…” link is added to the bottom of the container. Clicking on
this link expands the container to show the full content.
- At this point the containers behave independent of each other. In
other words, expanding one container has no affect of the others.
- A bonus feature would be to have a  “…close…” link to shrink the
container back to the starting height (minimum height) after it has
been expanded.

Some sample code as a starting point.

http://paste.pocoo.org/show/88358/

Thank you in advance.

Reply via email to