I'm working on a database-driven site, and I would like to use CSS to position the web elements, but I seem to have run into a wall. This is what I am trying to do:
section 1 -------------------------
{dynamically-generated elements postioned wrt section 1's upper left}
end of section 1-----------------------------
section 2 ----------------------
{dynamically-generated elements postioned wrt section 2's upper left}
end of section 2 ---------------
section 3 ------------------
{dynamically-generated elements postioned wrt section 3's upper left}
end of section 3 -----------
Looks to be fairly simple, but the catch is that the elements are dynamically generated from a database and I don't know beforehand how many there will be and how big to make each section. I guess what I would like to do is to position according to the BOTTOM edge of a section, not the top.
I've tried this:
<div>
{dynamically generated elements positioned using position:relative}
</div>
<div>
{dynamically generated elements positioned using position:relative}
</div>
but the dynamically generated elements seem to 'overflow' outside of the area that I think should be contained by the <div> tags.
Does anyone know how to accomplish this?
section 1 -------------------------
{dynamically-generated elements postioned wrt section 1's upper left}
end of section 1-----------------------------
section 2 ----------------------
{dynamically-generated elements postioned wrt section 2's upper left}
end of section 2 ---------------
section 3 ------------------
{dynamically-generated elements postioned wrt section 3's upper left}
end of section 3 -----------
Looks to be fairly simple, but the catch is that the elements are dynamically generated from a database and I don't know beforehand how many there will be and how big to make each section. I guess what I would like to do is to position according to the BOTTOM edge of a section, not the top.
I've tried this:
<div>
{dynamically generated elements positioned using position:relative}
</div>
<div>
{dynamically generated elements positioned using position:relative}
</div>
but the dynamically generated elements seem to 'overflow' outside of the area that I think should be contained by the <div> tags.
Does anyone know how to accomplish this?